• AS3 CookBook学习整理(七)


    1. 调整文本框大小以适应内容

    设置autoSize属性可自动根据内容调整文本框大小。可用值为RIGHT, LEFT, CENTER,和NONE,都是flash.text.TextFieldAutoSize类常量

    默认值为NONE,表示不自动调整大小。 另外,wordWrap属性设置为true,则当内容超出范围时自动换行。貌似必须先设置autoSize才生效

    package {   
        import flash.display.Sprite;   
        import flash.text.TextField;   
        import flash.text.TextFieldAutoSize;   
        import flash.text.TextFieldType;   
      
        public class Sample0323 extends Sprite   
        {   
            public function Sample0323()   
            {   
                var text:TextField = new TextField();   
                text.type = TextFieldType.INPUT;   
                text.border = true;   
                text.borderColor = 0xFFFF00;   
                text.height = 20;   
      
                text.autoSize = TextFieldAutoSize.CENTER;   
                text.wordWrap = true;   
                   
                this.addChild(text);   
            }   
        }   
    }

    2. 滚动文本

    水平滚动的单位为像素(最小值为0),垂直滚动的单位为行(最小值为1)。设置WheelEnabled=false可以禁用滚轮滚动行。

    scrollH -- 水平滚动的像素

    maxScrollH -- 文本的最大水平像素值,只读

    scrollV -- 垂直滚动的行数

    maxScrollV -- 文本的最大行数,只读

    bottomScrollV -- 当前最后一行是第几行(在整个行数里),只读

    package {   
        import flash.display.Sprite;   
        import flash.events.MouseEvent;   
        import flash.text.TextField;   
        import flash.text.TextFieldAutoSize;   
        import flash.text.TextFieldType;   
      
        public class Sample0323 extends Sprite   
        {   
            private var textBox:TextField;   
            private var textInfo:TextField;   
               
            public function Sample0323()   
            {   
                textBox = new TextField();   
                textBox.type = TextFieldType.INPUT;   
                   
                textBox.width = 250;   
                textBox.height = 100;   
                textBox.border = true;   
                textBox.borderColor = 0xFFFF00;   
                textBox.background = true;   
                textBox.backgroundColor = 0xFFFFFF;   
                   
               //测试水平滚动则为false,垂直滚动则为true;    
                textBox.wordWrap = true;   
                   
                this.addChild(textBox);   
               
                var label:TextField = new TextField();   
                label.x = 200;   
                label.y = 100;   
                label.background = true;   
                label.backgroundColor = 0xCCCCCC;   
                label.autoSize = TextFieldAutoSize.CENTER;   
                label.text = "水平滚动10个像素";   
                label.addEventListener(MouseEvent.CLICK,scrollH_onClick);   
                this.addChild(label);   
                   
                label = new TextField();   
                label.x = 200;   
                label.y = 150;   
                label.background = true;   
                label.backgroundColor = 0xCCCCCC;   
                label.autoSize = TextFieldAutoSize.CENTER;   
                label.text = "水平滚动至结尾";   
                label.addEventListener(MouseEvent.CLICK,maxScrollH_onClick);   
                this.addChild(label);   
                   
                label = new TextField();   
                label.x = 200;   
                label.y = 200;   
                label.background = true;   
                label.backgroundColor = 0xCCCCCC;   
                label.autoSize = TextFieldAutoSize.CENTER;   
                label.text = "垂直滚动3行";   
                label.addEventListener(MouseEvent.CLICK,scrollV_onClick);   
                this.addChild(label);   
                   
                label = new TextField();   
                label.x = 200;   
                label.y = 250;   
                label.background = true;   
                label.backgroundColor = 0xCCCCCC;   
                label.autoSize = TextFieldAutoSize.CENTER;   
                label.text = "垂直滚动至结尾";   
                label.addEventListener(MouseEvent.CLICK,maxScrollV_onClick);   
                this.addChild(label);   
                   
                textInfo = new TextField();   
                textInfo.type = TextFieldType.INPUT;   
                textInfo.y = 300;   
                textInfo.autoSize = TextFieldAutoSize.CENTER;   
                   
                this.addChild(textInfo);   
            }   
               
            private function scrollH_onClick(event:MouseEvent):void   
            {   
                textBox.scrollH += 10;   
            }   
               
            private function maxScrollH_onClick(event:MouseEvent):void   
            {   
                textBox.scrollH = textBox.maxScrollH;   
            }   
               
            private function scrollV_onClick(event:MouseEvent):void   
            {   
                textBox.scrollV += 3;   
                textInfo.text = "当前最后一行在整个行数里是第"+textBox.bottomScrollV+"行";   
            }   
               
            private function maxScrollV_onClick(event:MouseEvent):void   
            {   
                textBox.scrollV = textBox.maxScrollV;   
            }   
        }   
    }

    3. 响应滚动事件

    当水平或垂直滚动产生时会触发scroll事件,flash.events.Event类的SCROLL常量即代表该事件

    package {   
        import flash.display.Sprite;   
        import flash.events.Event;   
        import flash.text.TextField;   
        import flash.text.TextFieldAutoSize;   
        import flash.text.TextFieldType;   
        import flash.utils.getTimer;   
      
        public class Sample0323 extends Sprite   
        {   
            private var textBox:TextField;   
            private var textInfo:TextField;   
               
            public function Sample0323()   
            {   
                textBox = new TextField();   
                textBox.type = TextFieldType.INPUT;   
                   
                textBox.width = 250;   
                textBox.height = 100;   
                textBox.border = true;   
                textBox.borderColor = 0xFFFF00;   
                textBox.background = true;   
                textBox.backgroundColor = 0xFFFFFF;   
                textBox.wordWrap = true;   
                   
                textBox.addEventListener(Event.SCROLL,onScroll);   
                   
                this.addChild(textBox);    
                   
                textInfo = new TextField();   
                textInfo.type = TextFieldType.INPUT;   
                textInfo.y = 300;   
                textInfo.autoSize = TextFieldAutoSize.CENTER;   
                   
                this.addChild(textInfo);   
            }   
               
            private function onScroll(event:Event):void   
            {   
                textInfo.text = flash.utils.getTimer()+" -- 滚动了";   
            }   
        }   
    }

    4. 格式化文本框文本

    有三种方式对文本进行格式化:HTML标签格式化、使用TextFormat对象、CSS样式

    * HTML标签格式化示例: textBox.htmlText = "<B>粗体文本</B><U>下划线文本</U>";

    * TextFormat对象示例:(注意:只对setTextFormat之前的代码有效)

    var textFormat:TextFormat = new TextFormat();

    textFormat.color = 0xFF0000;

    textFormat.htmlText = "有效";

    //也可以对部分文字进行格式化,例如:textBox.setTextFormat(textFormat,3,textBox.text.length);

    textBox.setTextFormat(textFormat); textFormat.htmlText = "无效";

    * CSS样式示例:(注意:只对CSS定义之后的代码有效)

    var css:StyleSheet = new StyleSheet();

    var styleObj:Object = {color:"#FF0000"};

    css.setStyle(".stdStyle",styleObj);

    textBox.styleSheet = css;

    textBox.htmlText = "不潮不用花钱";

    this.addChild(textBox);

    package {   
        import flash.display.Sprite;   
        import flash.events.Event;   
        import flash.events.MouseEvent;   
        import flash.net.URLLoader;   
        import flash.net.URLRequest;   
        import flash.text.StyleSheet;   
        import flash.text.TextField;   
        import flash.text.TextFieldAutoSize;   
      
        public class Sample0324 extends Sprite   
        {          
            private var label:TextField;   
            private var text:String = "here comes <span class='stdText'>wayne</span>";   
               
            public function Sample0324()   
            {                      
                var btnRed:TextField = new TextField();   
                btnRed.text = "应用红色样式";   
                btnRed.y = 100;   
                btnRed.addEventListener(MouseEvent.CLICK,onRedClick);   
                this.addChild(btnRed);   
                   
                var btnGreen:TextField = new TextField();   
                btnGreen.text = "应用绿色样式";   
                btnGreen.y = 200;   
                btnGreen.addEventListener(MouseEvent.CLICK,onGreenClick);   
                this.addChild(btnGreen);   
                   
                label = new TextField();       
                label.autoSize = TextFieldAutoSize.CENTER;   
                label.htmlText = text;   
                this.addChild(label);   
            }   
               
            private function onRedClick(event:MouseEvent):void   
            {   
                var loader:URLLoader = new URLLoader();   
                loader.load(new URLRequest("StdStyle.css"));   
                loader.addEventListener(Event.COMPLETE,onLoadComplete);   
            }   
               
            private function onGreenClick(event:MouseEvent):void   
            {   
                var loader:URLLoader = new URLLoader();   
                loader.load(new URLRequest("StdStyle2.css"));   
                loader.addEventListener(Event.COMPLETE,onLoadComplete);   
            }   
               
            private function onLoadComplete(event:Event):void   
            {   
                var css:StyleSheet = new StyleSheet();   
                css.parseCSS((event.target  as  URLLoader).data);   
                label.styleSheet = css;    
                   
                label.htmlText = text;   
            }      
        }   
    }

    5. 格式化用户输入的文本

    应用TextFormat对象到文本框的defaultTextFormat属性上

    package {   
        import flash.display.Sprite;   
        import flash.text.TextField;   
        import flash.text.TextFieldType;   
        import flash.text.TextFormat;   
      
        public class Sample0324 extends Sprite   
        {          
            public function Sample0324()   
            {                      
                var textBox:TextField = new TextField();   
                textBox.type = TextFieldType.INPUT;   
                textBox.border = true;   
                textBox.borderColor = 0xFFFF00;   
                   
                var textFormat:TextFormat = new TextFormat();   
                textFormat.color = 0xFF0000;   
                textFormat.italic = true;   
                   
                textBox.defaultTextFormat = textFormat;   
                   
                this.addChild(textBox);   
            }   
        }   
    }

    6. 设置文本字体

    使用HTML的标签,或者设置TextFormat对象的font属性,或者通过CSS的font-family属性

    修改字体有多种方法,如果使用HTML的话可通过 标签更改:field.htmlText = "Formatted text";

    也可设置TextFormat对象的font属性:formatter.font = "Arial";

    或者在CSS中定义font-family 属性:p {font-family: Arial;}

    需要注意的是电脑中必须要有你所指定的字体,因为有些电脑上可能没有安装相应的字体,这是可指定多种字体:formatter.font = "Arial, Verdana, Helvetica";

    如果都没有指定字体,默认使用系统字体。

    另外我们还可使用字体组,字体组是系统默认字体的一个分类,有三种: _sans, _serif, 和_typewriter。

    _sans 组包含如Arial 或Helvetica,_serif组包含如Times 或Times New Roman,_typewriter 组包含如Courier 或Courier New

    7. 嵌入字体

    通过[embed]元数据嵌入字体,设置文本框的embedFonts属性为true,通过标签,TextFormat对象或CSS应用字体

    嵌入系统字体:

    [Embed(systemFont="Onyx",fontName="hxw",mimeType="application/x-font-truetype")]

    嵌入非系统字体:

    [Embed(source="xjlFont.fon",fontName="xjl",mimeType="application/x-font")]

    可以设置textField.rotation += 30来设置文字旋转(放在定时器或OnEnterFrame事件里),文字必须为嵌入字体,否则无法正常显示。

    TextFormat方式

    package {
     import flash.display.Sprite;
     import flash.text.TextField;
     import flash.text.TextFieldAutoSize;
     import flash.text.TextFormat;
    
     [Embed(source="xjlFont.fon",fontName="xjl",mimeType="application/x-font-truetype")]
     public class Sample0410 extends Sprite
     {
      public function Sample0410()
      { 
       var textBox:TextField = new TextField();
       textBox.text = "hello everybody,my name  is 老胡";
       textBox.autoSize = TextFieldAutoSize.CENTER;
       textBox.embedFonts=true;
       addChild(textBox);
       var formatter:TextFormat = new TextFormat();
       formatter.font = "xjl";
       formatter.size = 30;
       textBox.setTextFormat(formatter);
      }
     }
    }

    CSS方式

    package {
     import flash.display.Sprite;
     import flash.text.StyleSheet;
     import flash.text.TextField;
     import flash.text.TextFieldAutoSize;
    
     [Embed(source="xjlFont.fon",fontName="xjl",mimeType="application/x-font-truetype")]
     public class Sample0410 extends Sprite
     {
      public function Sample0410()
      { 
       var css:StyleSheet = new StyleSheet();
       var styleObj:Object = {color:"#FFFF00", fontFamily:"xjl",fontSize:"30px"};
       css.setStyle(".stdStyle",styleObj);
       
       var textBox:TextField = new TextField();
       textBox.styleSheet = css;
       textBox.text = "<span class='stdStyle'>hello everybody,my name  is  老胡</span>";
       textBox.autoSize = TextFieldAutoSize.CENTER;
       textBox.embedFonts=true;
       addChild(textBox);
      }
     }
    }

    8. 设置焦点

    设置stage.focus = xxx来设置舞台的焦点,stage.focus = null可以移除焦点

    package {
     import flash.display.Sprite;
     import flash.events.MouseEvent;
     import flash.text.TextField;
     import flash.text.TextFieldType;
     public class Sample0410 extends Sprite
     { 
      public function Sample0410()
      { 
       var field:TextField = new TextField( );
       field.border = true;
       field.background = true;
       field.type = TextFieldType.INPUT;
       addChild(field);
       stage.addEventListener(MouseEvent.CLICK,onClick);
      }
      
      private function onClick(event:MouseEvent):void
      {
       stage.focus = getChildAt(0)  as  TextField;
       //this.removeEventListener(MouseEvent.CLICK,onClick);
      }
     }
    }

    9. 选中TextField的部分文本及设置光标所在位置

    设置TextField.setSelection(startIndex,endIndex),同时通过selectionBeginIndex和selectionEndIndex两个只读属性可获得选中文本的具体位置

    如果设置setSelection的两个参数相同,则是在设置光标所在位置,通过TextField.caretIndex属性可以得到当前光标所在位置

    package {
     import flash.display.Sprite;
     import flash.events.MouseEvent;
     import flash.text.TextField;
     import flash.text.TextFieldAutoSize;
     import flash.text.TextFieldType;
     public class Sample0410 extends Sprite
     { 
      private var lblNumber:TextField;
      
      public function Sample0410()
      { 
       var field:TextField = new TextField( );
       field.border = true;
       field.background = true;
       field.type = TextFieldType.INPUT;
       field.text = "我们的祖先在护佑着你";
       this.addChild(field);
       
       lblNumber = new TextField();
       lblNumber.autoSize = TextFieldAutoSize.CENTER;
       lblNumber.background = true;
       lblNumber.y = 150;
       this.addChild(lblNumber);
       
       field.addEventListener(MouseEvent.CLICK,onClick);
      }
      
      private function onClick(event:MouseEvent):void
      {
       var textBox:TextField = event.target  as  TextField;
       textBox.setSelection(5,5);
       var strStart:String = "起始点:"+textBox.selectionBeginIndex.toString();
       var strEnd:String = "结束点:"+textBox.selectionEndIndex.toString();
       var currentIndex:String = "当前光标所在:"+textBox.caretIndex;
       lblNumber.text = strStart + "," + strEnd + "," + currentIndex;
      }
     }
    }

    10. 取消事件的默认行为(如果可以取消)

    默认情况下,许多事件都有Flash Player执行的关联行为。例如,如果用户在文本字段中键入一个字符,则默认行为就是在文本字段中显示该字符。可以使用preventDefault()方法来防止显示该字符

    然后很多事件是瞬发的,像点击事件、获得焦点、失去焦点事件

    可以使用Event.cancelable属性来判断是否可以取消行为,如果返回true,则可以使用preventDefault()来取消事件;否则preventDefault()无效

    package {
     import flash.display.Sprite;
     import flash.events.FocusEvent;
     import flash.events.MouseEvent;
     import flash.text.TextField;
     import flash.text.TextFieldType;
     public class Sample0410 extends Sprite
     {
      public function Sample0410()
      {
       //演示MouseEvent.Click事件是无法取消行为的
       stage.addEventListener(MouseEvent.CLICK,onClick);
       
       //演示FocusEvent.FOCUS_IN事件是无法取消行为的
       var textBox:TextField = new TextField();
       textBox.type = TextFieldType.INPUT;
       textBox.background = true;
       textBox.addEventListener(FocusEvent.FOCUS_IN,onFocusIn);
       this.addChild(textBox);
       
       //演示FocusEvent.MOUSE_FOCUS_CHANGE事件是可以取消行为的
       textBox.addEventListener(FocusEvent.MOUSE_FOCUS_CHANGE,onMouseFocusChange);
      }
      
      private function onClick(event:MouseEvent):void
      {
       trace("MouseEvent.Click事件可以取消行为吗?" + event.cancelable);//显示false
      }
      
      private function onFocusIn(event:FocusEvent):void
      {
       trace("FocusEvent.FOCUS_IN事件可以取消行为吗?" + event.cancelable);//显示false
      }
      
      private function onMouseFocusChange(event:FocusEvent):void
      {
       trace("FocusEvent.MOUSE_FOCUS_CHANGE事件可以取消行为吗?" + event.cancelable);//显示true
      }
     }
    }
  • 相关阅读:
    那些年坑爹的JS题目
    CSS(十三).高度如何铺满全屏
    JS模式和原型精解
    CSS(十二).transition的应用之CSS中心扩散
    一些值得记录的面试题
    随笔
    原生Ajax实现
    code和pre竟然有区别!!!!
    原生JS轮播-各种效果的极简实现(二)面向对象版本的实现和优化
    原生JS轮播-各种效果的极简实现
  • 原文地址:https://www.cnblogs.com/CoderWayne/p/1778060.html
Copyright © 2020-2023  润新知