apache-flex - 如何为拇指的每一侧获得带有皮肤的 HSlider

Question

我想创建一个 HSlider，以便拇指两侧的轨道皮肤不同。因此，例如，拇指左侧的轨道是绿色的，而另一侧是红色的。

这是可能的还是需要一个自定义组件？

Answer 1

您可以通过蒙皮来做到这一点。整个滚动条是可定制的。您只需将 HScrollBar 的 trackSkin 样式设置为程序化皮肤。然后你的皮肤将基本上是两个矩形。0 到parent.scrollPosition. 而另一个从parent.scrollPosition到height。这是一个可能有用的例子。我没有测试过。您可能需要摆弄一些数字。

  public class ScrollBarSkin extends Border
  {
    //maybe needed as a hack for the flex internals. Values may need to be changed for specific cases
    override public function get measuredWidth():Number {return 16; }
    override public function get measuredHeight():Number {return 10;}   

    override protected function updateDisplayList(w:Number, h:Number):void {
      super.updateDisplayList(w,h);

      if(this.parent) {
        var g:Graphics = this.graphics;
        g.clear();

        //top   
        g.beginFill(0xFF0000);
        g.drawRoundRect(1,1, w, parent.scrollPosition);
        g.endFill();

        //bottom
        g.beginFill(0x00FF00);
        g.drawRoundRect(0, parent.scrollPosition, w, h);
        g.endFill();

      }
    }    
  }