flex 学习笔记 as自定义标尺组件

代码：

package contr    
{    
    import flash.geom.Point;  
      
    import mx.controls.Alert;  
    import mx.controls.Text;  
    import mx.graphics.SolidColorStroke;  
      
    import spark.components.BorderContainer;  
    import spark.primitives.Line;  
 
    public class Ruler extends BorderContainer    
    {    
        private var _trunkLine:Line;    
          
        /**设置标尺的长度*/  
        private var _lineLength:Number;  
          
        /**设置最小单位*/  
        private var _spacing:Number;  
          
        /**设置隔几个刻度显示一次*/  
        private var _scale:Number;  
          
        /**标尺是横向还是纵向*/  
        private var _type:String = "horizontal";  
          
        /**标尺的位置,包括上下左右*/  
        private var _position:String = "top";  
 
        [Inspectable(enumeration="top,bottom,left,right")]  
        public function get position():String  
        {  
            return _position;  
        }  
          
        public function set position(value:String):void  
        {  
            _position = value;  
        }  
 
        public function get scale():Number  
        {  
            return _scale;  
        }  
 
        public function set scale(value:Number):void  
        {  
            _scale = value;  
        }  
 
        public function get spacing():Number  
        {  
            return _spacing;  
        }  
 
        public function set spacing(value:Number):void  
        {  
            _spacing = value;  
        }  
 
        [Inspectable(enumeration="vertical,horizontal")]  
        public function get type():String  
        {  
            return _type;  
        }  
          
        public function set type(value:String):void  
        {  
            _type = value;  
        }  
        public function Ruler()    
        {    
            super();       
              
        }  
 
        public function get lineLength():Number  
        {  
            return _lineLength;  
        }  
          
        public function set lineLength(value:Number):void  
        {  
            _lineLength = value;  
        }  
          
          
          
        protected override function createChildren():void{  
            super.updateDisplayList(unscaledWidth,unscaledHeight);  
            this.alpha = 0.5;    
            this.setStyle("borderColor","red");    
            this.width = 0;    
            this.height = 0;    
            _trunkLine = new Line();    
            _trunkLine.stroke = new SolidColorStroke(0x000000);    
            this.x = 0;    
            this.y = 0;  
            if(position == "top"){  
                _trunkLine.xFrom = 25;    
                _trunkLine.yFrom = 25;  
            }else if(position == "bottom"){  
                _trunkLine.xFrom = 25;    
                _trunkLine.yFrom = parentApplication.height-100;  
            }else if(position == "left"){  
                _trunkLine.xFrom = 25;    
                _trunkLine.yFrom = 25;  
            }else if(position == "right"){  
                _trunkLine.xFrom = 600;    
                _trunkLine.yFrom = 25;  
            }  
            if(type =="horizontal"){  
                _trunkLine_trunkLine.xTo = _trunkLine.xFrom + lineLength;    
                _trunkLine_trunkLine.yTo = _trunkLine.yFrom;    
                this.addElement(_trunkLine);    
                for(var i:Number=0;i<=lineLength/spacing;i++){    
                var _line:Line = new Line();    
                var _ySpacing:Number = 5;    
                _line.stroke = new SolidColorStroke(0x000000);    
                _line.xFrom = i * spacing + _trunkLine.xFrom;    
                _line.yFrom = _trunkLine.yFrom;    
                _line_line.xTo = _line.xFrom;    
                var _label:spark.components.Label = new spark.components.Label();    
                _label.text = String(i * 10);    
                _label.y = _trunkLine.yFrom - 20;  
                if(i%10==0){    
                    _ySpacing = 15;                           
                }else if(i%5==0){    
                    _ySpacing = 10;    
                }    
                if(i%scale==0){  
                    _label.x = i * spacing + _trunkLine.xFrom+1;  
                    this.addElement(_label);  
                }  
                _line.yTo = _trunkLine.yFrom - _ySpacing;    
                this.addElement(_line);  
                }  
            }else{  
                _trunkLine = new Line();    
                _trunkLine.stroke = new SolidColorStroke(0x000000);      
                _trunkLine_trunkLine.xTo = _trunkLine.xFrom;   
                _trunkLine_trunkLine.yTo = _trunkLine.yFrom + lineLength;    
                this.addElement(_trunkLine);    
                  
                for(var j:Number = 0;j<=lineLength/spacing;j++){    
                    var _xSpacing:Number = 5;    
                    var _lineV:Line = new Line();    
                    _lineV.stroke = new SolidColorStroke(0x000000);   
                    var _labelV:spark.components.Label = new spark.components.Label();    
                    _labelV.text = String(j * 10);    
                    _labelV.x = (_trunkLine.xFrom - 20);    
                    if(j%10==0){    
                        _xSpacing = 15;    
                    }else if(j%5==0){    
                        _xSpacing = 10;   
                    }  
                    if(j%scale==0){  
                        _labelV.y = j * spacing+1 + + _trunkLine.yFrom;  
                        this.addElement(_labelV);  
                    }  
                    _lineV.xFrom = _trunkLine.xFrom - _xSpacing;    
                    _lineV.yFrom = j * spacing + _trunkLine.yFrom;    
                    _lineV.xTo = _trunkLine.xFrom    
                    _lineV.yTo = j * spacing + _trunkLine.yFrom;    
                    this.addElement(_lineV);  
                }  
            }  
              
            }  
        }  
    }   

使用:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009"   
                    xmlns:s="library://ns.adobe.com/flex/spark"   
                    xmlns:mx="library://ns.adobe.com/flex/mx" 
                    xmlns:con="contr.*" 
                    xmlns:logic="com.runqianapp.fastreport.view.logic.*"    backgroundAlpha="0.0" 
                    width="100%" height="100%" fontFamily="宋体"  creationComplete="init()"> 
    <fx:Declarations> 
        <!-- 将非可视元素（例如服务、值对象）放在此处 --> 
    </fx:Declarations> 
    <mx:HBox width="100%" height="100%" paddingLeft="20" paddingTop="20" horizontalGap="0"> 
        <con:Ruler lineLength="500" spacing="10" scale="5" type="vertical"/> 
    </mx:HBox> 
      
</mx:Application> 

效果：