How to solve the failure about Flex VBOX's vertical scroll policy

本文链接：https://blog.youkuaiyun.com/bright_chen7/article/details/6416777

本文探讨了Flex应用中VBox控件的垂直滚动条显示问题。通过一个实例展示了如何使用verticalScrollPolicy属性来控制垂直滚动条的行为，并揭示了一个与VBox背景颜色设置相关的隐藏bug。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

We know the verticalScrollPolicy property can make VBOX control the appearance of the vertical scroll bar when the container’s contents exceed the dimensions of the container.

Sometimes failed to scroll, but we do this every time, so why it fail?

We see the following code:

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="1024" minHeight="768"> <fx:Script>  </fx:Script> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx"; mx|VBox { paddingLeft: 10; paddingRight: 10; paddingTop: 10; paddingBottom: 10; } </fx:Style> <s:Panel id="myPanel" x="0" y="0" width="100%" height="100%"> <s:layout> <s:VerticalLayout horizontalAlign="center"/> </s:layout> <mx:ApplicationControlBar dock="true" width="100%"> <mx:Form> <mx:FormItem label="verticalScrollPolicy:"> <mx:ComboBox id="comboBox"> <mx:dataProvider> <fx:Array> <fx:Object label="auto" /> <fx:Object label="on" /> <fx:Object label="off" /> </fx:Array> </mx:dataProvider> </mx:ComboBox> </mx:FormItem> <mx:FormItem label="height:"> <mx:HSlider id="slider" minimum="500" maximum="1000" value="50" liveDragging="true" snapInterval="1" tickInterval="50" /> </mx:FormItem> <mx:FormItem label="verticalScrollPosition:"> <mx:Label id="vSP" /> </mx:FormItem> <mx:FormItem label="maxVerticalScrollPosition:"> <mx:Label id="mVSP" /> </mx:FormItem> </mx:Form> </mx:ApplicationControlBar> <mx:VBox id="vBox" verticalScrollPolicy="on" backgroundColor="haloSilver" width="100%" height="100%" minHeight="0" updateComplete="updateScrollPosition();" creationComplete="updateScrollPosition();"> <mx:Box id="box" backgroundColor="haloBlue" width="50%" height="{slider.value}" /> </mx:VBox> </s:Panel> </s:Application>

You can not use mouse wheel to control the scroll bar, but did you find the error?

The mystical code is "backgroundColor="haloSilver""

You add this property to the VBOX, now try again!

It works, right?