今回は，
<view>
これまでにも何度か出てきましたが，
リスト1にあるcornerradius
<view>の中にある<dragstate>は，
ドラッグできるということは，
リスト1
<canvas proxied="false" bgcolor="0xffffcc">
<view width="200" height="100" bgcolor="red" cornerradius="10"
onmousedown="this.dr.apply()" onmouseup="this.dr.remove()">
<dragstate name="dr"/>
<handler name="onx"><![CDATA[
if(this.x<0)this.setAttribute('x',0);
if(this.x+this.width>canvas.width)this.setAttribute('x',canvas.width-this.width);
]]></handler>
<handler name="ony"><![CDATA[
if(this.y<0)this.setAttribute('y',0);
if(this.y+this.height>canvas.height)this.setAttribute('y',canvas.height-this.height);
]]></handler>
</view>
</canvas>リスト1サンプル
<text>
文字列を表示するという，
リスト2
<canvas proxied="false" bgcolor="0xffffcc">
<simplelayout/>
<text textdecoration="underline">下線を引く</text>
<text fontstyle="bold">太字にする</text>
<text fontstyle="italic">斜体にする</text>
<text fontstyle="bold italic">太字及び斜体にする</text>
<text fontsize="20">フォントサイズを大きく</text>
<text fgcolor="0xff0000">文字色をつける</text>
<text bgcolor="0xffff00">背景色をつける</text>
<text multiline="true" bgcolor="0xaaffaa">
複数行<br/>
複数行<br/>
複数行<br/>
</text>
<text textalign="center" width="200" bgcolor="0xaaaaff">センタリング</text>
<text textalign="right" width="200" bgcolor="0xffaaaa">右寄せ</text>
<text><font color="#ff0000">色をつけたり，</font><i>斜めにしたり，</i><u>下線を引いたり，</u><b>太字にしたり。</b></text>
</canvas>リスト2サンプル
ボタン
リスト3のサンプルは，
3つめの青いボタンは，
リスト3
<canvas proxied="false" bgcolor="0xffffcc">
<simplelayout spacing="5"/>
<button width="100" height="50" fontstyle="bold">ボタン
<handler name="onclick">
this.setAttribute('text',this.text=="ボタン"?"ぼたん":"ボタン");
btn.setAttribute('enabled',this.text=="ボタン"?false:true);
</handler>
</button>
<button id="btn" enabled="false" text="ボタン"/>
<resource name="myButton">
<frame src="bt_up.png" /><!--ノーマル時-->
<frame src="bt_over.png" /><!--マウスオーバー時-->
<frame src="bt_down.png" /><!--マウスダウン時-->
</resource>
<basebutton resource="myButton"/>
</canvas>リスト3サンプル
ウインドウ
ウインドウコンポーネントには<window>，
<window>はこれまでにもときどき出てきましたが，
<alert>は文字列と閉じるボタンのみを扱えるアラートウインドウです。このウインドウが表示されている間は画面の他の部分を動かすことはできません。
<modaldialog>は文字列だけの<alert>とは違って，
リスト4
<canvas proxied="false" bgcolor="0xffffcc">
<button onclick="al.open()">アラートウインドウを出す</button>
<button onclick="dl.open()" y="30">モーダルダイアログを出す</button>
<window y="60" width="200" height="150" title="ウインドウサンプル" resizable="true" closeable="true">
<vbox align="center" valign="middle">
<text>・ドラッグアンドドロップ可能</text>
<text>・タイトル設定可能</text>
<text>・リサイズ可能</text>
<text>・クローズ可能</text>
</vbox>
</window>
<alert id="al" button1="閉じる">
アラートウインドウ。
</alert>
<modaldialog id="dl" width="200" height="150">
<simplelayout spacing="5"/>
<text>モーダルダイアログ</text>
<checkbox>チェックボックス</checkbox>
<button onclick="parent.close()">閉じる</button>
</modaldialog>
</canvas>リスト4サンプル