Spark textarea与不同的滑块

时间:2012-08-01 11:49:57

标签: flex textarea flex4 scrollbar flex-spark

我对Flex很新,并且对textarea的滚动条有问题。基本上,我希望textarea有一个看起来像VSlider组件的垂直滚动条,而不像VSrollBar。 (即,带有点跟踪器的线,而不是带有盒跟踪器的盒子)。

现在我想出了如何创建没有滚动条的textarea并将其链接到单独的VSlider组件并通过事件更新,但我很确定应该有一些方法只使用textarea并将其滚动条组件设置为看起来像VSlider而不是VScrollBar。

有人可以帮忙吗?

2 个答案:

答案 0 :(得分:1)

我通过使用spark TextArea和Vertical Scroll Bar的皮肤解决了这个问题。 此外,你必须从这个皮肤上涂上每个按钮。

<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" 
             xmlns:s="library://ns.adobe.com/flex/spark"
             xmlns:fb="http://ns.adobe.com/flashbuilder/2009">
    <fx:Metadata>
        <![CDATA[ 
            [HostComponent("spark.components.VScrollBar")]
        ]]>
    </fx:Metadata> 
    <s:states>
        <s:State name="normal" />
        <s:State name="disabled" />
        <s:State name="inactive" />
    </s:states>
    <s:Group top="2" horizontalCenter="0" bottom="2" left="2" right="2">
        <s:Button id="track" top="8" bottom="8" width="10" focusEnabled="false" 
                  skinClass="skins.scroller.VerticalScrollBarTrackSkin"/>
        <s:Button id="thumb" horizontalCenter="0" focusEnabled="false" visible.inactive="false"
                  skinClass="skins.scroller.VerticalScrollBarThumbSkin" buttonMode="true"/>
        <s:Button id="decrementButton" top="0" enabled.inactive="false"
                  focusEnabled="false" horizontalCenter="0" buttonMode="true"
                  skinClass="skins.scroller.VerticalScrollBarDecrementButtonSkin"/>
        <s:Button id="incrementButton" bottom="0" enabled.inactive="false"
                  focusEnabled="false" horizontalCenter="0" buttonMode="true"
                  skinClass="skins.scroller.VerticalScrollBarIncrementButtonSkin"/>
    </s:Group>
</s:SparkSkin>

然后你必须为你的应用程序应用样式。

s|VScrollBar
{
    skinClass:ClassReference("skins.scroller.VerticalScrollBarSkin");
}

答案 1 :(得分:0)

对于这种情况,我最终使用VSlider,我通过事件监听“手动”同步textarea滚动。不是最流畅的方式,但在这种情况下最容易实现。