Flex中不用ScrollBar实现滚动效果

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;

[Embed(source=&apos;Assets.swf&apos;, symbol=&apos;fwdMonthDown&apos;)]
[Bindable] private var rightArrow:Class;

[Embed(source=&apos;Assets.swf&apos;, symbol=&apos;backMonthUp&apos;)]
[Bindable] private var leftArrow:Class;

[Bindable] private var dp:ArrayCollection = new ArrayCollection([
{label:"11111111111"},
{label:"22222222222"},
{label:"33333333333"}
]);

private function adjustSize():void {
if(container.maxHorizontalScrollPosition > 0){
if(container.horizontalScrollPosition > container.maxHorizontalScrollPosition)
container.horizontalScrollPosition = container.maxHorizontalScrollPosition;
scrollLeftBtn.visible = true;
scrollRightBtn.visible = true;
}else{
container.horizontalScrollPosition = 0;
scrollLeftBtn.visible = false;
scrollRightBtn.visible = false;
}
}

private function scrollLeft(delta:int = 10):void {
if(container.horizontalScrollPosition > 0)
container.horizontalScrollPosition -= delta;
}

private function scrollRight(delta:int = 10):void {
if(container.horizontalScrollPosition < container.maxHorizontalScrollPosition)
container.horizontalScrollPosition += delta;
}

private function onMouseWheel(event:MouseEvent):void {
if(event.delta > 0)
scrollLeft(20);
else if(event.delta < 0)
scrollRight(20);
}

private function onAddItem():void {
var i:int = dp.length+1;
var o:Object = {label: String(i * 11111111111)};
dp.addItem(o);
}

private function onRemoveItem():void {
if(dp.length > 0)
dp.removeItemAt(dp.length-1);
}

]]>
</mx:Script>


<mx:Box width="60%" id="parentContainer" backgroundColor="#ffcc00">

<mx:HBox width="100%" horizontalGap="0" mouseWheel="onMouseWheel(event)" resize="adjustSize()"
horizontalScrollPolicy="off">
<mx:Button buttonDown="scrollLeft()" autoRepeat="true" id="scrollLeftBtn"
includeInLayout="{scrollLeftBtn.visible}" visible="false"
cornerRadius="0" icon="{leftArrow}" width="20" />
<mx:HBox maxWidth="{parentContainer.width-scrollRightBtn.width-scrollLeftBtn.width}"
horizontalScrollPolicy="off" id="container"
horizontalGap="0">
<mx:LinkBar dataProvider="{dp}" labelField="label" updateComplete="adjustSize()" />
</mx:HBox>
<mx:Button buttonDown="scrollRight()" autoRepeat="true" id="scrollRightBtn"
includeInLayout="{scrollRightBtn.visible}" visible="false"
cornerRadius="0" icon="{rightArrow}" width="20" />
</mx:HBox>

</mx:Box>
<mx:Button label="add item" click="onAddItem()" />
<mx:Button label="remove item" click="onRemoveItem()" />

</mx:Application>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值