Flex学习记录（在容器内控制滚动和溢出）

你需要禁用容器的垂直滚动条并且在某个组件上创建一个用户可以通过鼠标滑过来控制滚
动的区域。
使用horizontalScrollPolicy、verticalScrollPolicy 和verticalScrollPosition 属性。
我们可以通过horizontalScrollPolicy 和verticalScrollPolicy 属性控制滚动条。如果
要使其中一个或全部滚动条始终显示，则将其中一个或全部设置成”on”，反之亦然。
而”auto”值则导致滚动条仅在容器的实际测量尺寸大于width 或height 指定的值时出
现。例如，将horizontalScrollPolicy 设置为”auto”则意味着当容器的宽度超过width
属性的值时出现滚动条。
要滚动一个组件，使用horizontalScrollPosition 和verticalScrollPosition 属性。通过
这两个属性，我们可以设定组件内容的可视部分往右下角滚动多远的距离。例如：

<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="600"
height="200" horizontalScrollPolicy="auto"
verticalScrollPolicy="off" mouseMove="autoScroll(event)">
<mx:Script>
<![CDATA[
private var hasAddedScroll:Boolean = false;
private function autoScroll(event:MouseEvent):void
{
if(mouseX > width - 50 && !hasAddedScroll)
{
addEventListener(Event.ENTER_FRAME, scrollRight);
hasAddedScroll = true;
}e
else if(mouseX < 50 && !hasAddedScroll)
{
addEventListener(Event.ENTER_FRAME, scrollLeft);
hasAddedScroll = true;
}e
else
{
removeEventListener(Event.ENTER_FRAME,
scrollRight);
removeEventListener(Event.ENTER_FRAME,
scrollLeft);
hasAddedScroll = false;
}
}
private function scrollRight(event:Event):void
{
if(horizontalScrollPosition <
maxHorizontalScrollPosition)
{
horizontalScrollPosition+=4;
}e
else
{
removeEventListener(Event.ENTER_FRAME,
scrollRight);
hasAddedScroll = false;
}
}
private function scrollLeft(event:Event):void
{
if(horizontalScrollPosition > 0)
{
horizontalScrollPosition-=4;
}e
else
{
removeEventListener(Event.ENTER_FRAME,
scrollLeft);
hasAddedScroll = false;
}
}
]]>
</mx:Script>
<mx:Image source="@Embed('assets/image.png')"/>
<mx:Image source="@Embed('assets/image.png')"/>
<mx:Image source="@Embed('assets/image.png')"/>
<mx:Image source="@Embed('assets/image.png')"/>
<mx:Image source="@Embed('assets/image.png')"/>
</mx:HBox>