main.lzx
<canvas>
<include href="../lib/"/>
<class name="randombox" width="20" height="20" with="Spatialnav">
<handler name="oninit">
this.setAttribute('width', (Math.random() * 60) + 10);
this.setAttribute('height', (Math.random() * 60) + 10);
this.setAttribute('x', Math.random() * (canvas.width - this.width));
this.setAttribute('y', Math.random() * (canvas.height - this.height));
this.setAttribute('bgcolor', Math.random() * 0xffffff);
</handler>
</class>
<view width="100" height="100" bgcolor="red">
<handler name="oninit">
// instances must register
navmanager.add(this);
</handler>
</view>
<view name="container" y="200" width="100%" height="${canvas.height - this.y}">
<replicator name="repl">
<randombox/>
</replicator>
<handler name="oninit">
var i = 100;
var o = [];
while (i > 0) {
i--;
o.push('');
}
this.repl.setNodes(o);
</handler>
<hintedlayout/>
</view>
<view name="tools" align="right" valign="bottom">
<simplelayout axis="x"/>
<view width="100" height="100" bgcolor="red">
<handler name="oninit">
// instances must register
navmanager.add(this);
</handler>
</view>
<view width="100" height="100" bgcolor="green">
<handler name="oninit">
// instances must register
navmanager.add(this);
</handler>
</view>
</view>
<drawview name="highlight">
<handler name="oncontext" method="redraw"/>
<handler name="onwidth" method="redraw"/>
<handler name="onheight" method="redraw"/>
<method name="redraw">
if (! this.context) return;
this.strokeStyle = 0xffcc00;
this.lineWidth = 4;
this.clear();
this.beginPath()
this.rect(0, 0, this.width, this.height);
this.stroke();
</method>
<handler name="onfocused" reference="navmanager" method="show"/>
<method name="show" args="v, speed">
if (speed == null) speed = 300
this.animate('x', v.getAttributeRelative('x', canvas), speed);
this.animate('y', v.getAttributeRelative('y', canvas), speed);
this.animate('width', v.width, speed);
this.animate('height', v.height, speed);
</method>
</drawview>
</canvas>
Cross References
Includes
Classes
Named Instances