Window オブジェクトは、部品を配置するために必ず１つは生成しなければなりません。

YKayoのメインウインドウ#

<?xml version="1.0" encoding="utf-8"?>
<widget version="1.0" minimumVersion="3.1" author="Kei's Media Image Lab.">
	<window title="YKayo">
		<name>mainWindow</name>
		<width>481</width>
		<height>481</height>
		<visible>1</visible>

    <!-- いす-->
		<image src="Resources/a1/a1_001.png">
			<name>layerA</name>
			<opacity>255</opacity>
			<zOrder>1</zOrder>
    	    	</image>
	</window>
</widget>

この例では、MainWindowというウインドウを生成し、Imageを1つ表示しています。

WindowとImageには、それぞれ<name>というプロパティ（属性）があり、JavaScriptから何か操作するときにはこのnameがないといけません。

実際は人物や人物の目、その他もっとたくさんのImageを重ねているのですが、これはJavaScript側で行っています。

ウインドウを複数使うWidget#

<?xml version="1.0" encoding="utf-8"?>
<widget version="1.0" minimumVersion="3.1" author="Kei's Media Image Lab.">
	<window title="YKayo">
		<name>mainWindow</name>
		<width>481</width>
		<height>481</height>
		<image src="Resources/a1/a1_001.png" name="layerA" />
	</window>

	<window title="console">
	<name>consoleWindow</name>
   	   	<image src="Resources/f1/f1_001.png" name="layerF" />
     	  	</image>
	</window>
</widget>

ウインドウを複数使うと、部品を別々の場所に配置することができ、ウインドウごとに透明度などの表示属性を変えることができます。
たとえば入力ウインドウを開く、結果ウインドウを出すなどの応用が考えられます。

YKayoの場合は

• MainWindow - 人物と椅子
• ConsoleWindow - コンソール（Kayoがいじっている画面）
• MenuWindow - メニュー（Kayoを呼んだときに展開されるメニュー）
• StickyWindow - 付箋（付箋にカモフラージュするときの画面）

以上のウインドウを使っていますが、「コンソール」と「メニュー」については、MainWindowにImageをどんどん重ねても実現できなくもありません。
でも、MainWindowのイメージを増やしすぎると、Kayoが姿勢を変えたときなどの表示速度が実用にならないため、それぞれ別のWindowにしています。

一つ目のデメリットは子のWindowをドラッグで移動させられてしまうことがあることで、これは子WindowのonMouseDownに何か命令を仕掛けて抑止する必要があります。
二つ目のデメリットは、Window同士の重ね順が入れ替わってしまうことがあることで、これは適宜WindowのFocus命令で重ねなおさないといけません。