[转]NumericStepper添加百分号

请问 NumericStepper组件中添加百分号

最佳答案

ticore

本帖最后由 ticore 于 2011-7-26 15:50 编辑

自訂一個 MyNumericStepperSkin.mxml 套用到 NumericStepper 上

在 MyNumericStepperSkin.mxml 裡面的 <s:TextInput id="textDisplay"  />

再自訂一個 MyNumericStepperTextInputSkin.mxml

加一個 Label 顯示 % 就好了

1. ...
   
2.     <!-- text -->
   
3.     <!--- @copy spark.components.supportClasses.SkinnableTextBase#textDisplay -->
   
4.     <s:RichEditableText id="textDisplay"
   
5.               lineBreak="explicit"
   
6.               verticalAlign="middle"
   
7.               multiline="false"
   
8.               left="1" right="1" top="1" bottom="1" 
   
9.               paddingLeft="3" paddingTop="6"
   
10.               paddingRight="6" paddingBottom="3"/>
    
11. 
    
12.         <s:Label text="%" verticalAlign="middle" right="3" top="1" bottom="1"  />
    
13. .....

复制代码

textDisplay.right = 14 + 1;
為了拉開右邊的空白給 % 用

1. ...
   
2.         override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
   
3.         {
   
4.             if (getStyle("borderVisible") == true)
   
5.             {
   
6.                 border.visible = true;
   
7.                 shadow.visible = true;
   
8.                 background.left = background.top = background.right = background.bottom = 1;
   
9.                 textDisplay.left = textDisplay.top = textDisplay.right = textDisplay.bottom = 1;
   
10.                                 textDisplay.right = 14 + 1;
    
11.             }
    
12.             else
    
13.             {
    
14.                 border.visible = false;
    
15.                 shadow.visible = false;
    
16.                 background.left = background.top = background.right = background.bottom = 0;
    
17.                 textDisplay.left = textDisplay.top = textDisplay.right = textDisplay.bottom = 0;
    
18.                                 textDisplay.right = 10;
    
19.             }
    
20.             
    
21.             borderStroke.color = getStyle("borderColor");
    
22.             borderStroke.alpha = getStyle("borderAlpha");
    
23.             
    
24.             super.updateDisplayList(unscaledWidth, unscaledHeight);
    
25.         }
    
26. ....

复制代码

最後顯示效果像這樣