首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 媒体动画 > flex >

按钮代替滚动条解决思路

2012-02-04 
按钮代替滚动条我想自定义一个组件,此组件继承mx.containers.Tile为了效果,希望用向左,向右两个按钮来代替

按钮代替滚动条
我想自定义一个组件,此组件继承mx.containers.Tile
为了效果,希望用向左,向右两个按钮来代替容器里的滚动条,每次点击时,Tile容器里的东西向左或向右滚动,不知道这个AS怎么写
对于问题有什么不明白的请留言

[解决办法]
给你个示例,如果想做成组件,自己封装下就可以。

XML code
<?xml version="1.0"?><!-- Simple example to demonstrate the Tile layout container. --><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">    <mx:Script>        <![CDATA[            private static const UNIT_WIDTH:int = 65;                    private function moveScoll(xIndex:int, yIndex:int):void            {                //tile.horizontalScrollPosition += xIndex*UNIT_WIDTH;                 tile.verticalScrollPosition += yIndex*UNIT_WIDTH;             }        ]]>    </mx:Script>        <mx:Panel title="Tile Container Example" height="75%" width="75%"         paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">        <mx:HBox>            <mx:Button label="向上" click="moveScoll(0,-1)" />            <mx:Button label="向下" click="moveScoll(0,1)" />        </mx:HBox>        <mx:Tile id="tile" direction="horizontal" borderStyle="inset" width="200" height="150"                horizontalGap="10" verticalGap="15"                 paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">            <mx:Button label="1" height="50" width="75"/>            <mx:Button label="2" height="50" width="75"/>            <mx:Button label="3" height="50" width="75"/>            <mx:Button label="4" height="50" width="75"/>            <mx:Button label="5" height="50" width="75"/>            <mx:Button label="6" height="50" width="75"/>            <mx:Button label="11" height="50" width="75"/>            <mx:Button label="12" height="50" width="75"/>            <mx:Button label="13" height="50" width="75"/>            <mx:Button label="14" height="50" width="75"/>            <mx:Button label="15" height="50" width="75"/>            <mx:Button label="16" height="50" width="75"/>        </mx:Tile>    </mx:Panel></mx:Application>
[解决办法]
LZ网名是不是"迷失浪迹"呀,哈哈~我以群里已经回答了你的这个问题了,我是Ready Lau
所以也给点分给我吧,哈
[解决办法]
借用楼上代码,帮你实现了左右,上下
Java code
<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:fc="http://www.adobe.com/2006/fc"    layout="absolute"  viewSourceURL="srcview/index.html">    <mx:Script>        <![CDATA[            import mx.controls.Alert;            private static const UNIT_WIDTH:int = 65;                    private function moveRight(xIndex:int):void            {                tile.horizontalScrollPosition += xIndex*UNIT_WIDTH;              }            private function moveLeft(xIndex:int):void{                tile.horizontalScrollPosition-=xIndex*UNIT_WIDTH;            }            private function moveScoll(xIndex:int, yIndex:int):void            {                 tile2.verticalScrollPosition += yIndex*UNIT_WIDTH;             }        ]]>    </mx:Script>        <mx:Panel title="Tile Container Example" height="309" width="482"         paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10" layout="absolute" x="30" y="10">        <mx:HBox x="10" y="10">            <mx:Button label="向左" click="moveLeft(1)" />            <mx:Button label="向右" click="moveRight(1)" />        </mx:HBox>        <mx:HBox x="252" y="12" height="29">            <mx:Button label="向上" click="moveScoll(0,-1)" />            <mx:Button label="向下" click="moveScoll(0,1)" />        </mx:HBox>                  <!--水平滚动-->        <mx:Tile id="tile" direction="vertical" borderStyle="inset" width="200" height="150"                horizontalGap="10" verticalGap="15"                 paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" x="10" y="66">            <mx:Button label="1" height="50" width="75"/>            <mx:Button label="2" height="50" width="75"/>            <mx:Button label="3" height="50" width="75"/>            <mx:Button label="4" height="50" width="75"/>            <mx:Button label="5" height="50" width="75"/>            <mx:Button label="6" height="50" width="75"/>            <mx:Button label="11" height="50" width="75"/>            <mx:Button label="12" height="50" width="75"/>            <mx:Button label="13" height="50" width="75"/>            <mx:Button label="14" height="50" width="75"/>            <mx:Button label="15" height="50" width="75"/>            <mx:Button label="16" height="50" width="75"/>        </mx:Tile>        <!--垂直滚动-->        <mx:Tile x="252" id="tile2" direction="horizontal" y="66" width="200" height="150">            <mx:Button label="1" height="50" width="75"/>            <mx:Button label="2" height="50" width="75"/>            <mx:Button label="3" height="50" width="75"/>            <mx:Button label="4" height="50" width="75"/>            <mx:Button label="5" height="50" width="75"/>            <mx:Button label="6" height="50" width="75"/>            <mx:Button label="11" height="50" width="75"/>            <mx:Button label="12" height="50" width="75"/>            <mx:Button label="13" height="50" width="75"/>            <mx:Button label="14" height="50" width="75"/>            <mx:Button label="15" height="50" width="75"/>            <mx:Button label="16" height="50" width="75"/>        </mx:Tile>    </mx:Panel></mx:Application> 

热点排行