开启左侧

AS3元素处理:TextField

[复制链接]
etthink 发表于 2013-4-20 14:14:49 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
文本这一块内容,算不上是Flash的重头戏,但也是不可缺少的一块内容。TextField的属性和方法众多,我们不用全部记住。但我们需要知道能实现哪些功能。
和面板对应的相关属性有:(继承属性我不列了)
text:文本内容。
htmlText:存储HTML文本的内容。如果要使用HTML文本时,请参阅帮助,了解支持哪些HTML元素,Flash支持的元素不多的。别指望实现太复杂的功能。可能也就<img>标签会比较有用些,可以插入外部的图片和SWF文件。
type:设置文本为动态文本还是输入文本。默认为动态文本。
textColor:设置字体颜色。
autoSize:对齐方式,只有无(默认)、左端对齐、居中对齐、右端对齐。没有两端对齐。
multiline:文本是否为多行文本。
wordWrap:文本是否自动换行。
displayAsPassword:输入的字符以密码形式显示。
border:是否具有边框。
selectable:文本字段是否可选。
maxChars:用户可输入的最大字符数。

属性面板不提供的常用设置属性:
background:是否具有背景填充色。
backgroundColor:当background属性设置为true时,设置背景颜色。
borderColor:当border属性为true时,设置边框颜色。
restrict:在输入文本中,限制用户可输入的字符集。

常用文本类编程属性:
length:获取文本所含字符数。
numLines:获取多行文本的总行数。
caretIndex:获取输入光标所在的位置(插入字符的那条一闪一闪的竖线)。
selectionBeginIndex:所选择文本的起始位置。
selectionEndIndex:所选择文本的结束位置。
textWidth:获取文本区域实际宽度。
textHeight:获取文本区域实际高度。
scrollH:当前水平滚动位置。设置该值可以实现文本水平滚动效果。
maxScrollH:scrollH的最大值。
scrollV:当前垂直滚动位置。设置该值可以实现文本垂直滚动效果。
maxScrollV:scrollV的最大值
bottomScrollV:返回当前可见文本区域的底部ScrollV值。

有关文本定位的相关方法:
(1)根据提供的字符索引值获取:
getCharBoundaries():获得某一个字符的具体位置矩阵(该字符的x、y坐标,以及宽、高)。
getFirstCharInParagraph():获取某一个字符所在段落的第一个字符索引值。
getParagraphLength():获取某一个字符所在段落包含的字符个数。
getLineIndexOfChar():获取某一个字符所在的行号。
(2)根据坐标获取:
getCharIndexAtPoint():根据点坐标,获得当前位置的字符索引值。
getLineIndexAtPoint():根据点坐标,获取当前行号。

和文本行相关的方法:
getLineLength():获取某一行的字符个数。
getLineOffset():获取某一行第一个字符的索引号。
getLineText():获取某一行的文本内容。

接下来的两篇,也和TextField类有比较密切的关系。分别是TextFormat类和styleSheet对象。

学教育技术,上教育技术论坛!http://www.etthink.com

精彩评论2

正序浏览
etthink 发表于 2013-4-20 14:15:41 | 显示全部楼层
1TextFormat包含的内容
和面板对应的相关属性有:
font:设置文本的字体名称,以字符串形式表示。
size:设置文本的字体大小,以磅值表示。
color:设置文本的字体颜色。
bold:设置文字是否为粗体。
italic:设置文字是否为斜体。
align:设置文本对齐方式。包括左端对齐、居中对齐、右端对齐、两端对齐。
indent:设置文本第一个字符的缩进像素。
leading:设置文本之间的行间距。
leftMargin:设置文本段落的左边距。
rightMargin:设置文本段落的右边距。
letterSpacing:设置文本的字间距。
kerning:设置是否启用自动调整字距功能。
url:设置文本的超链接地址。
target:设置超链接打开目标窗口的方式。
其他还有4个属性,是属性面板没有提供的设置,但是也几乎没有什么作用,所以我就不列出来了。

      2TextFormat的用法
      使用TextFormat之前,需要先实例化。具体代码如下:
      var format:TextFormat = new TextFormat(); //定义textFormat对象
      format.font = "Verdana"; //设置具体属性
      tt.defaultTextFormat = format; //设置默认格式
      tt.setTextFormat(format,1,8); //设置格式

      defaultTextFormat属性可以设置文本的默认格式。也就是说,当文本发生变化时,会自动应用设置的格式。但当前存在的文本是不会变化的。
      setTextFormat()方法刚好相反,可以设置当前文本的格式,或者具体设置其中一部分文本应用指定格式。但当文本发生变化时,是不会生效的。

      3)关于TextFormat的一些自我看法
      结合TextField和TextFormat的属性,我们可以实现属性面板的所有设置功能。不过,Adobe的开发团队,对于这两个对象的开发应该是独立的,所以两者之间也存在着一些矛盾。比如:TextField的autoSize和textColor属性,和TextFormat的align、color属性,明显是重复的。体现在AS代码上,就是谁后写,就生效谁的。但是这样子是很容易产生错误的。
      所以我建议大家,还是用TextFormat对象来设置文本对齐方式和文本字体颜色,以免发生不必要的错误。毕竟,严格意义上来说,这两个属性也确实是TextFormat应该管的事。
      另外还有一个小点,TextField的文本对齐方式是不支持两端对齐的,但TextFormat是支持的。所以以为AS代码不支持两端对齐的朋友,你们的看法是错的。

学教育技术,上教育技术论坛!http://www.etthink.com
 楼主| etthink 发表于 2013-4-20 14:17:16 | 显示全部楼层
styleSheet和TextFormat类似,也是用来定义文本格式的,二者实现的效果也差不多。但是,styleSheet和TextFormat之间,是存在兼容冲突的,设置了styleSheet的文本,将无法再使用TextFormat类,否则编译时会产生报错信息。
      那么,这两者之间的区别是什么呢,我大致归纳了下,有以下几点:
      (1) styleSheet只能对HtmlText使用,如果没有设置该属性则无法使用。TextFormat则不受该限制影响。
      (2) styleSheet可以通过修改外部CSS文件来变更文字格式,不用重新编译生成的SWF文件,这个也是styleSheet最大的优势。
      (3) 设置了styleSheet的文本字段是不可以再编辑的。所以如果是一个输入文本的话,应该避免使用styleSheet
      由上也可以看到,CSS虽然说可以在Flash文件中创建,但我觉得,只有外部加载的CSS文件才有意义,否则,真的体现不出styleSheet的优势了。同时,如果你要应用styleSheet的话,建议先看下帮助,因为Flash支持的styleSheet样式元素并不多。

      下面我介绍下如何加载外部CSS文件,首先,我们要创建一个CSS文件,CSS文件我就完全不懂了,所以只好抄袭一段代码来,大家把下面这段代码复制到文本文件,然后命名为example.css,和Flash文件放在同一个目录下:
p {
font-family: Times New Roman, Times, _serif;
font-size: 14;
}
h1 {
font-family: Arial, Helvetica, _sans;
font-size: 20;
font-weight: bold;
}
.bluetext {
color: #0000CC;
}

      如果正确套用该CSS文件,文本会呈现蓝色字体。然后我们打开Flash,写入AS代码如下:
var loader:URLLoader = new URLLoader();
var req:URLRequest = new URLRequest("example.css");
loader.load(req);
loader.addEventListener(Event.COMPLETE, onLoaded);
function onLoaded(event:Event) {
var sheet:StyleSheet = new StyleSheet(); //定义styleSheet实例
sheet.parseCSS(loader.data); //解析外部CSS文件
var myText:TextField = new TextField();
myText.styleSheet = sheet; //调用styleSheet实例
myText.htmlText = "<span class='bluetext'>测试文本</span>"; //采用styleSheet
addChild(myText);
}

      最后我再做点补充说明:
      (1) 首先要创建styleSheet实例,然后用parseCSS()方法解析读取的外部CSS文件
      (2) 必须在设置htmlText属性之前应用样式表,否则CSS样式是不会生效的。
      (3) 在htmlText文件中调用CSS的方法和正式网页中相同
学教育技术,上教育技术论坛!http://www.etthink.com
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则


11关注

460粉丝

7778帖子

推荐阅读更多+
会员达人更多+
广告位

最新信息

更多+

关注我们:教育技术人

官方微信

官方微博

教育技术热线:

13955453231

学教育技术,上教育技术论坛!

教育技术论坛征稿范围:教育技术应用案例、教程文章、优秀作品等。

Email:sf@etthink.com

Copyright   ©2007-2026  应用思考-教育技术论坛  Powered by©Discuz!  技术支持:且行资源    ( 皖ICP备10014945号-4 )