羔羊引擎之文本的把戏

qq229449388

羔羊引擎文本很简单，没什么多讲，但是对于开发的时候，有些东西大家总是随便弄，能出效果就可以了，套个皮就不知道你是笨蛋吗？

先讲正事，羔羊引擎的基础文本组件有3个，GYText，GYTextArea，GYTextInput
GYText就是普通文本，不可编辑，但是可以设置单行或者多行，如下


var gyText:GYText = new GYText(true);
gyText.border = true;
gyText.borderColor = 0xff9966;
gyText.width = 200;
gyText.x = 10;
gyText.y = 40;
gyText.text = "普通的单行文本我就不多说了，这里说说常见的多行文本，羔羊引擎的GYText创建时有参数，设置true为多行，默认为false。设置宽度，不设置高度则自动换行，这是布局常识";
win.addElement(gyText);



小白就不会不知道的东西，设置宽度，不设置高度，内容就会自动换行，所有引擎的组件都应该是这样

但是如果我想自己打换行，不希望设置宽度来控制换行，那你记得把文本设置为多行，并且wordWrap属性设置为flase

GYText跟其他组件没什么区别，这里要说明一下羔羊引擎的一些特性
1、在GYText里面，有个validFormat方法，这个方法的作用是，当设置文本的属性，例如颜色，大小，下划线等TextFormat有的属性，如果不调用validFormat是不会立刻能拿到正确的宽高的。因为这里文本属性做了延时处理。
2、GYText 有两个静态属性defualtSysFont 和defualtFont，分别是系统字体和默认嵌入字体，可以在主题初始化的时候设置一下，这样就可以设置全局的字体，优先使用嵌入字体，没有的情况下就使用系统字体，要注意到是如果选择嵌入字体，若又使用系统字体，则需要手动设置EmbedFonts为false，因为选择嵌入字体的那刻，每次创建GYText都会默认EmbedFonts为true。
3、padding属性和静态属性defautPadding，默认defaultPadding为5，这个属性是用来计算文本宽度的，因为文本的宽度和文本框有一定距离，所以用这个补偿计算，一般5是适合的，但是换字体就难说了，这两个属性的关系是，当padding为-1时使用defualtPadding，当defualtPadding也为-1的时候，就用_textFormat.size/2.5来计算，可以打开GYText源码看这个padding的get方法

1. public function get padding():int
   
2.                 {
   
3.                         if(_padding == -1)
   
4.                         {
   
5.                                 if(defualtPadding == -1)
   
6.                                         return int(int(_textFormat.size)/2.5);
   
7.                                 return defualtPadding
   
8.                         }
   
9.                         return _padding;
   
10.                 }

复制代码

GYTextInput输入文本，这个也跟其他组件一样的，没什么好说的，皮肤就一背景，当然自己可以扩展TextInputSkin实现更丰富的皮肤。

GYTextArea文本框组件，ediable控制是否可编辑，可以设置paddingTop，paddingRight，paddingLeft，paddingRight来增加边距，GYTextInput也可以，这里特别说明setPadding方法是一次性设置4个边距，这里里面同时算进来滚动条的宽度，所以隐藏滚动条的时候别觉得右边边距大，代码如下，特意设置skin给大家看看的

1. var gyInput:GYTextInput = new GYTextInput(new TextInputSkin(inputBitData,rect));
   
2.                         gyInput.x = 10;
   
3.                         gyInput.y = 300;
   
4.                         gyInput.prompt = "输入文本有prompt属性，没内容的时候显示就是prompt属性";
   
5.                         gyInput.promptText.color = 0x333333;
   
6.                         gyInput.textInput.color = 0;
   
7.                         gyInput.paddingLeft = 5;
   
8.                         gyInput.width = 400;
   
9.                         gyInput.height = 22;
   
10.                         win.addElement(gyInput);

复制代码

下面说说设置文本居中的一个问题，我经常看到有人设置文本居中是不设置宽度，直接用相对布局verticalCenter=0来操作的，相对布局的教程已经说明过，如果能不用，就避免滥用，这里面文本居中大可可以设置宽度，然后用align属性设置居中，完全能搞定，而且效果更好。代码如下，特意设置skin给大家看看的

1. var rect:Scale9GridRect = new Scale9GridRect;
   
2. var textArea:GYTextArea = new GYTextArea(new TextAreaSkin(inputBitData,rect));
   
3. textArea.x = 240;
   
4. textArea.y = 40;
   
5. textArea.width = 200;
   
6. textArea.height = 200;
   
7. textArea.editable = true;
   
8. textArea.setPadding(20);
   
9. textArea.vScroller.verticalPolicy = 1;
   
10. textArea.text = "主题的TextArea你们已经见过了，现在换一个样式。从构造函数的参数传入TextAreaSkin，设置editable为true则可编辑，使用setPadding方法可以增加边距，现在我们设置为20边距看看，是不是内容变小了";
    
11. win.addElement(textArea);

复制代码

lesson5.rar (2.03 KB, 下载次数: 2)

2017-11-16 01:50 上传

点击文件名下载附件