scrollbar_example.lzx

<canvas height="600" width="600" bgcolor="0xeaeaea">
    <resource name="cherry" src="testmedia/cherry.png"/>
    <include href="testmedia/frosty.lzx"/>
    
    <class name="scrollview" defaultplacement="content" clip="true" focusable="true">
        <attribute name="scrollto" value="0" type="number"/>
        <view x="${-parent.scrollto}" name="content"/>
        <scrollbar name="sbx" usemousewheel="false" axis="x"/>
        <scrollbar name="sby"/>
    </class>
    
    <class name="testoldstyle" clip="true" height="250" width="200">
        <view options="releasetolayout">
            <frosty/>
        </view>
        <scrollbar height="${parent.height}" axis="y"/>
        <resizelayout axis="x"/>
    </class>
    
    <view x="40" y="40">
        <view>
            <view>
                <view bgcolor="0x848484" width="200" height="100">
                    <scrollview id="sv1" width="${parent.width-2}" height="${parent.height-2}" x="1" y="1" scrollto="50" bgcolor="white">
                        <frosty/>
                </scrollview>
                </view>
                <view>
                    <view bgcolor="0x4D4D4D" width="60" height="22">
                        <inputtext id="scrolltopos" bgcolor="0xF2F2F2" width="${parent.width-2}" height="${parent.height-2}" x="1" y="1">0</inputtext>
                    </view>
                    <button onclick="Debug.write(Number(scrolltopos.text));                             sv1.setAttribute('scrollto',Number(scrolltopos.text))">set scroll</button>
                    <simplelayout axis="x" spacing="10"/>
                </view>
                <simplelayout axis="y" spacing="10"/>
            </view>
            <view bgcolor="0x848484" height="100" width="100">
                <scrollview id="sv2" bgcolor="white" width="${parent.width-2}" height="${parent.height-2}" x="1" y="1">
                    <view name="pic" resource="cherry" clip="true"/>
                </scrollview>
            </view>
        
            <view>
            <view bgcolor="0x4D4D4D" width="60" height="22">
                <inputtext id="w" bgcolor="0xF2F2F2" width="${parent.width-2}" height="${parent.height-2}" x="1" y="1">20</inputtext>
            </view>
            <button onclick="sv2.pic.setAttribute('width', Number(w.text))">set width</button>
            <button onclick="Debug.write('width='+sv2.pic.width);                             sv2.pic.animate('width', Number(w.text), 1000);                             Debug.write('width='+sv2.pic.getExpectedAttribute('width'));">anim width</button>
            <simplelayout axis="y" spacing="8"/>
            </view>
            <simplelayout axis="x" spacing="20"/>
        </view>
        
        <view>
            <view bgcolor="0x848484" height="200" width="200">
                <scrollview id="sv3" bgcolor="white" width="${parent.width-2}" height="${parent.height-2}" x="1" y="1">
                <frosty/>
            </scrollview>
            </view>
            <simplelayout axis="x" spacing="20"/>
        </view>
        <simplelayout axis="y" spacing="20"/>
    </view>

</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2001-2011 Laszlo Systems, Inc.  All Rights Reserved.              *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->

Cross References

Includes

Resources

Name Source Image
cherry testmedia/cherry.png

Classes

Named Instances