Question

我将使用HSlider设置一系列值。我希望左手拇指看起来像（和右手拇指像一样），所以它们似乎包含像（范围）这样的范围而不是 |范围| 。我只知道如何为SliderThumb设置皮肤，这将为两者设置皮肤。有没有人知道为每个拇指设置不同皮肤的方法？

感谢。

更新

我现在有了这个代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:HSlider xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Style>
    .thumbTickLeft
    {
        disabledSkin: Embed(source="skins.swf", symbol="thumbTickLeft_disabledSkin");
        downSkin: Embed(source="skins.swf", symbol="thumbTickLeft_downSkin");
        overSkin: Embed(source="skins.swf", symbol="thumbTickLeft_overSkin");
        upSkin: Embed(source="skins.swf", symbol="thumbTickLeft_upSkin");
    }
    .thumbTickRight
    {
        disabledSkin: Embed(source="skins.swf", symbol="thumbTickRight_disabledSkin");
        downSkin: Embed(source="skins.swf", symbol="thumbTickRight_downSkin");
        overSkin: Embed(source="skins.swf", symbol="thumbTickRight_overSkin");
        upSkin: Embed(source="skins.swf", symbol="thumbTickRight_upSkin");
    }
    </mx:Style>

    <mx:Script>
        <![CDATA[
            override protected function commitProperties():void
            {
                super.commitProperties();

                updateThumbSkins();   
            }

            private function updateThumbSkins():void
            {
                this.getThumbAt(0).setStyle('styleName','thumbTickLeft');
                this.getThumbAt(1).setStyle('styleName','thumbTickRight');
            }
        ]]>
    </mx:Script>


</mx:HSlider>

拇指嘀嗒根本不显示？顺便说一句，我确保皮肤正确加载，因为我可以将它们设置为这样的按钮：

<mx:Button styleName="thumbTickRight"/>

Answer 1

我能够以这种方式工作......不确定这是否是最佳方式。

<?xml version="1.0" encoding="utf-8"?>
<mx:HSlider 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    sliderThumbClass="RangeSliderThumb" 
    creationComplete="initThumbs()">

    <mx:Script>
        <![CDATA[
            import mx.controls.sliderClasses.SliderThumb;

            [Embed(source="skins.swf", symbol="thumbTickLeft_upSkin")]
            private var leftUp:Class;

            [Embed(source="skins.swf", symbol="thumbTickRight_upSkin")]
            private var rightUp:Class;

            [Embed(source="skins.swf", symbol="thumbTickLeft_downSkin")]
            private var leftDown:Class;

            [Embed(source="skins.swf", symbol="thumbTickRight_downSkin")]
            private var rightDown:Class;

            [Embed(source="skins.swf", symbol="thumbTickLeft_overSkin")]
            private var leftOver:Class;

            [Embed(source="skins.swf", symbol="thumbTickRight_overSkin")]
            private var rightOver:Class;

            [Embed(source="skins.swf", symbol="thumbTickLeft_disabledSkin")]
            private var leftDisabled:Class;

            [Embed(source="skins.swf", symbol="thumbTickRight_disabledSkin")]
            private var rightDisabled:Class;

            private function initThumbs():void 
            {
                this.thumbCount = 2;

                var thumb1:SliderThumb = this.getThumbAt(0);
                thumb1.setStyle("thumbUpSkin", leftUp);
                thumb1.setStyle("thumbDownSkin", leftDown);
                thumb1.setStyle("thumbOverSkin", leftOver);
                thumb1.setStyle("thumbDisabledSkin", leftDisabled);

                var thumb2:SliderThumb = this.getThumbAt(1);
                thumb2.setStyle("thumbUpSkin", rightUp);
                thumb2.setStyle("thumbDownSkin", rightDown);
                thumb2.setStyle("thumbOverSkin", rightOver);
                thumb2.setStyle("thumbDisabledSkin", rightDisabled);
            }
        ]]>
    </mx:Script>

</mx:HSlider>

Answer 2

你可能不会再读这篇文章了，但是为了其他人的利益，我正试图操纵多个拇指，每个人都有不同的皮肤，我想我会指出你原来哪里出错了码。我按照你原来的代码示例，也无法用拇指渲染，然后我就明白为什么你的最终解决方案有效。

问题是在原始代码中你正在使用样式属性upSkin，downSkin等，而在代码中，你使用的是thumbUpSkin，thumbDownSkin等。微妙的改变，但它会有所不同！

希望这有助于某人在赛道上拯救他们的一天......; - ）

干杯德鲁

Answer 3

我认为你可以通过继承Slider类（或HSlider）并添加一个方法来分别为每个拇指应用皮肤来做到这一点。

在Slider.as中有一个名为createThumbs的方法。如果你查一下，你会发现当创建一个拇指时，它的皮肤会根据为thumbUpSkin等设置的内容分配给它。

thumb = SliderThumb(new _thumbClass());

thumb.owner = this;
thumb.styleName = new StyleProxy(this, thumbStyleFilters);
thumb.thumbIndex = i;
thumb.visible = true;
thumb.enabled = enabled;

thumb.upSkinName = "thumbUpSkin";
thumb.downSkinName = "thumbDownSkin";
thumb.disabledSkinName = "thumbDisabledSkin";
thumb.overSkinName = "thumbOverSkin";
thumb.skinName = "thumbSkin";

因此，您可以创建一个名为skinThumbs的方法，并使其覆盖createThumbs中应用的外观设置。您可以致电getThumbAt(int)获取每个拇指。如果您需要一只手覆盖皮肤设置，请给我留言。

我会覆盖commitProperties方法并从那里拨打skinThumbs - 只需确保在调用skinThumbs后将呼叫设为super.commitProperties。顺便提一下，createThumbs方法仅从commitProperties调用，并且只从commitProperties中的一个位置调用，因此您不必担心处理您的修改被另一个替换内部呼叫createThumbs。

Flex：HSlider - 为不同的拇指设置不同的皮肤？

3 个答案: