`

AS3.0 styleSheet

阅读更多

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的方法和正式网页中相同。

 

分享到:
评论

相关推荐

    jquery 仿制苹果系统导航菜单

    &lt;link href="style.css" rel="stylesheet" type="text/css" /&gt; &lt;!--[if lt IE 7]&gt; &lt;style type="text/css"&gt; .dock img { behavior: url(iepngfix.htc) } &lt;/style&gt; &lt;![endif]–&gt; 第一部分是JavaScript,第二...

    StyleSheet

    StyleSheet、StyleSheet

    stylesheet

    安装WINCC勾选消息队列时需要安装的系统组件,下载下来和大家分享。

    Qt stylesheet

    Qt stylesheet 感觉还不错。I think this is a good resoure for qt stylesheet new leaner.

    qt黑色styleSheet样式表

    QT界面开发 样式挑战

    Qt5stylesheet

    Qt5环境下实现style和stylesheet换窗口背景色和控件背景色,功能强大!

    Qt利用StyleSheet更改大部分默认控件外观

    Qt4.8.4,利用StyleSheet更改大部分默认控件外观,对于个性化界面比较有帮助

    Qt5-stylesheet-样式表

    配合本人博客Qt开发总结(29)——样式表的例子,内含三个典型的样式表,几乎涵盖了Qt样式表的所有语法规则。具体内容可以移步到我的个人博客下学习。

    Qt StyleSheet 样式表实例

    这是一个大神总结的一些Qt界面美化的实例 每一种方式大神都有实例代码, 可以好好借鉴一下 希望大家共同进步

    stylesheet:使用JavaScript创建sylesheets

    bower install stylesheet --save-dev使用范例 var stylesheet = new StyleSheet ( ) ;// Specify the selector to work on.stylesheet . setSelector ( '.pause-hud' ) ;// Insert rules.stylesheet . insertRule ...

    css3.0新知识小结

    CSS就是一种叫做样式表(stylesheet)的技术。也有的人称之为层叠样式表(Cascading Stylesheet)。 在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。 只要对相应...

    stylesheet.zip

    qss界面美化实例,很好的学习开端。有助于帮助你进行程序界面美化。

    css3.0参考手册.rar

    CSS就是一种叫做样式表(stylesheet)的技术。也有的人称之为层叠样式表(Cascading Stylesheet)。 在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。 只要对相应...

    react-native-extended-stylesheet, 用于本机响应的扩展样式表.zip

    react-native-extended-stylesheet, 用于本机响应的扩展样式表 本地扩展样式表 在替换的过程中,使用媒体查询,变量,动态主题,单位,百分比,算术操作,比例和其他样式元素来调整本地样式表。 演示工具安装工具...

    浏览器默认样式(User Agent Stylesheet)的介绍与最佳处理方法

    如果对这个默认样式不满意最简单的解决办法就是重新设置该样式的属性,因为user agent stylesheet优先级很低,会被覆盖,这样就不会影响到我们的样式了,比如这里我就讲form 的margin-bottom设为0px。 User Agent ...

    jquery-stylesheet:用于样式表操作的jQuery插件

    jQuery StyleSheet jQuery.stylesheet插件允许您动态添加,删除和更改CSS规则。 将更改应用于CSS规则比遍历匹配元素并对每个元素应用相同的更改更为有效,尤其是在元素很多或更改触发多次昂贵的绘制操作的情况下。 ...

    2015-stylesheet

    克隆存储库以获取文件和配置,在终端上输入 git git clone git@github.org:hackathongi/2015-stylesheet.git ,或使用您喜欢的 GIT 工具或 IDE。 或者,如果您必须使用样式表或脚本对前端文件做出贡献,则需要一些...

    react-native-extended-stylesheet:用于React Native的扩展StyleSheets

    React本机扩展StyleSheet 用媒体查询,变量,动态主题,相对单位,百分比,数学运算,缩放和其他样式化内容直接替换 。 演示版 可以在浏览器或使用此与Extended StyleSheets一起玩。 安装 npm i react-native-...

    StyleSheet:界面UI样式复用基础机制,构建类似于CSS的样式表

    要求UIKit安装可通过获得StyleSheet。 要安装它,只需将以下行添加到您的Podfile中: pod "StyleSheet"原点方法有什么问题?如果要实现以下这个效果,两个标签,一个按钮,一个视图基于一流的配置大概要写 self....

Global site tag (gtag.js) - Google Analytics