Question

如何使用vslider作为列表的滚动条？我有这个，但无法从这里弄清楚：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"    
           xmlns:mx="library://ns.adobe.com/flex/mx"     
           xmlns:s="library://ns.adobe.com/flex/spark"  height="100%" width="100%">

<s:VSlider id="slider" minimum="0" maximum="{listy.height}" liveDragging="true"/>

<s:List id="listy" width="50%" height="100">
    <s:layout>
        <s:VerticalLayout id="vLayout" verticalScrollPosition="{slider.value}" />
    </s:layout>

    <mx:ArrayCollection>
        <fx:String>Flash</fx:String> 
        <fx:String>Director</fx:String> 
        <fx:String>Dreamweaver</fx:String> 
        <fx:String>ColdFusion</fx:String> 
        <fx:String>Flash</fx:String> 
        <fx:String>Director</fx:String> 
        <fx:String>Dreamweaver</fx:String> 
        <fx:String>ColdFusion</fx:String> 
        <fx:String>Flash</fx:String> 
        <fx:String>Director</fx:String> 
        <fx:String>Dreamweaver</fx:String> 
        <fx:String>ColdFusion</fx:String> 
    </mx:ArrayCollection>
</s:List>
</s:Application>

编辑：使用下面的Nate建议，我现在已经开始工作，但它既显示了vslider，也显示了默认滚动条。如何隐藏默认滚动条？我尝试设置verticalScrollPolicy =“off”但这不起作用。 THX

Answer 1

这是完全可能的，我的目标是证明它！所有开玩笑，这里只是一些简单的绑定，你非常接近！

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"    
               xmlns:mx="library://ns.adobe.com/flex/mx"     
               xmlns:s="library://ns.adobe.com/flex/spark"  height="100%" width="100%">

    <s:Group>
        <s:layout>
            <s:HorizontalLayout/>
        </s:layout>

        <s:List id="listy" width="50%" height="100" 
                change="slider.value=listy.layout.verticalScrollPosition" creationComplete="
                listy.dataGroup.addEventListener(MouseEvent.MOUSE_WHEEL, function():void{
                    slider.value=listy.layout.verticalScrollPosition}
                );">
            <s:layout>
                <s:VerticalLayout id="vLayout" verticalScrollPosition="{slider.value}" />
            </s:layout>

            <mx:ArrayCollection>
                <fx:String>Flash</fx:String> 
                <fx:String>Director</fx:String> 
                <fx:String>Dreamweaver</fx:String> 
                <fx:String>ColdFusion</fx:String> 
                <fx:String>Flash</fx:String> 
                <fx:String>Director</fx:String> 
                <fx:String>Dreamweaver</fx:String> 
                <fx:String>ColdFusion</fx:String> 
                <fx:String>Flash</fx:String> 
                <fx:String>Director</fx:String> 
                <fx:String>Dreamweaver</fx:String> 
                <fx:String>ColdFusion</fx:String> 
            </mx:ArrayCollection>
        </s:List>

        <s:VSlider id="slider" height="{listy.height}" 
                   minimum="0" maximum="{listy.dataGroup.contentHeight - listy.height}" 
                   showDataTip="false" scaleY="-1" liveDragging="true"/> 

    </s:Group>
</s:Application>

如果你不了解它的方式和原因，请告诉我：）

Answer 2

我建议你实现目标的最佳方式是剥皮。为VScrollBar创建一个与VSlider相同的外观。然后创建自定义Scroller皮肤（将spark.skins.spark.ScrollerSkin作为模式）并在那里分配这些滚动皮肤。然后创建自定义的List皮肤（基于spark.skins.spark.ListSkin）并将Scroller皮肤分配给那里的Scroller。

如果您（出于某种原因）必须使用原始VSlider，则需要使用滑块编写自己的Scroller并在List皮肤中使用它。< / p>

我建议你使用第一种方法。

Answer 3

如何使用vslider作为列表的滚动条？我有这个，但是无法从这里弄清楚：

不幸的是，如果没有重大的返工，我不相信这是可能的。

该列表在ListSkin中作为Scroller和DataGroup实现 Scroller有两个外观部件，verticalScrollBar和horizontalScrollBar。您想用VSlider替换veritcalScrollBar。

不幸的是，皮肤需要一个VScrollBar实例，并且没有可用于替换另一个的接口类。（Scroller实现是使用Flex 2/3方法实现的，以使其难以扩展）

你被困在使用黑魔法来完成这项工作。

然而，试图让VSCrollBar看起来像VSlider似乎确实是你最好的选择。

如何使用vslider作为列表的滚动条？

3 个答案: