Flex 4 - s：Scroll

Question

我创建了一个包含mx：ViewStack的项目，因为它是第一个容器。

<?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:comp="mycomp.*" 
      xmlns:mx="library://ns.adobe.com/flex/mx" 
      height="100%" width="100%" 
      minHeight="600" minWidth="800"> 
<s:layout> 
    <s:VerticalLayout horizontalAlign="center" /> 
</s:layout><mx:ViewStack horizontalCenter="0" 
       verticalCenter="0" 
       id="contentVs" 
       height="100%" 
       width="100%"> 
    <s:NavigatorContent name="biography" 
         label="Biography" 
         width="100%" 
         height="100%"> 
     <comp:Biography /> 
    </s:NavigatorContent> 
    <s:NavigatorContent name="collections" 
         label="Collections" 
         width="100%" 
         height="100%"> 
     <comp:Collections/> 

在各s：NavigatorContent内的mxViewStack我有一个自定义S：SkinnableContainer组件。在这些组件中，我添加了一个s：Scroller作为第一个子容器。

<?xml version="1.0" encoding="utf-8"?> 
    <s:SkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" 
        width="100%" height="100%" 
        creationComplete="this_creationCompleteHandler(event)"> 
<s:Scroller id="scroller1" 
      width="100%" 
      height="100%"> 
    <s:Group>   
     <s:BorderContainer width="100%" height="100%" borderVisible="true"> 

请注意，该应用程序的宽度和高度都为100％。

现在，当我减少浏览器的大小滚动不出现。在其中一个s：NavigatorContent（始终在ViewStack内）的情况下，滚动条出现。

我很困惑，为什么它确实出现在一个案例中。如果我将政策设置为, s：Scroller会显示，但即​​使我的浏览器很小，它也会被禁用。

另外我似乎无法找到一种方法来将这些滚轮着色为黑色。

谢谢。

Answer 1

我用静态（width =“1200”height =“800”）大小替换Viewstack上的相对大小，这就实现了。

<s:Group width="100%" height="100%">   
    <s:Scroller width="100%" height="100%"> 
     <s:VGroup horizontalAlign="center"> 
      <mx:ViewStack horizontalCenter="0" 
          verticalCenter="0" 
          id="contentVs" 
          width="1200" height="800"> 
       <s:NavigatorContent name="biography" 

关于改变Scroller组件的颜色，我不得不创建我自己的皮肤。

一种的spark.components.Scroller也是皮肤：

VScrollBarSkin VScrollBarTrackSkin VScrollBarThumbSkin ScrollBarUpButtonSkin ScrollBarDownButtonSkin

也是如此HScrollBar控件...

Answer 2

我不能清楚地看到从您的代码示例，但此行：

<s:BorderContainer width="100%" height="100%" borderVisible="true"> 

使它看起来像滚动的组的内容具有高度=“100％”的设置。

如果滚动条的组内容比自身宽或高，滚动条将只显示滚动条。

尝试将组的宽度和高度设置为100％，并确保组的内容比Scroller高。

例如。

<s:Scroller width="100%" height="100%"> 
    <s:VGroup width="100%" height="100%"> 

     <s:Label text="The rectangle below is very tall" /> 

     <!-- just a boring gradient rectangle --> 
     <s:Rect width="200" height="1500"> 
      <s:fill> 
       <s:LinearGradient rotation="90"> 
        <s:GradientEntry color="0xFFFF00" /> 
        <s:GradientEntry color="0x00FFFF" /> 
       </s:LinearGradient> 
      </s:fill> 
     </s:Rect> 

    </s:VGroup> 
</s:Scroller>