Flex学习2课.pdfVIP

联盟第 2次 Flex公开课笔记 笔记日期：2006/12/08  今天主要讲一下 Flex 中的 CSS 使用方法,以及 AS 3.0 基础 请把 Lesson1.mxml 所有代码删除,然后替换为以下代码  ?xml version=1.0 encoding=utf­8?  mx:Application xmlns:mx=/2006/mxml layout=absolute  /mx:Application  现在打开 Design 模式,从 Components 面板里拖几个 Button 出来，就拖 3 个吧。好，更改每 个 button 的 label，改为按钮 1、按钮 2、按钮 3  如图所示 我们可以看到,Flex 对中文的显示不是太好 我告诉大家，中文字体大小设置为  12px 最 好。我们现在选中按钮 1，然后在右边的属性面板里，调整它的字体大小： 改成  12，可以看到, 按钮  1 现在清晰多了。我们可 以加更多的样式上去，比如字体颜色、效果等等。 （问：请问一下，可以将 fontSize=12px ?答：不行，12 px 只能在 CSS 里定义） 嗯，我们可以看到，当调整 “按钮 1”的样式的时候，Source面板里的代码立即改变了，现 在就有个问题――如果按钮很少，就几个，我们可以一个一个的进行样式设计，但是，如果 按钮有 1 万个，或者更多呢？这个时候就得用到 CSS，方法如下： 在 Application标签下新建  mx:Style  Button { fontSize: 12px }  /mx:Style  这个代码一写完，我们可以看到，Design模式下，所有按钮全部变为 12 号字体。如果按钮 没有变成 12 号字体，那可能是没有刷新，请点刷新按钮 ，大家现在的按钮都是 12 号了 吧。我先解释一下 px 和 pt 的区别： 又拖一个 button进去，也是 12 号，自动的。px 是像素单位，它是矢量的，它会随着屏幕分 辨率的变化而变化；pt  则是表量单位，即使屏幕分辨率再大，pt  单位的字体不会改变代销 大小，我们尽量不要使用 pt，而应该使用 px。  CSS 里面，所有数值单位，默认都是 px 的，你不需要把 px 加到数字后面：  mx:Style  Button { fontSize: 12 }  /mx:Style  这样也是正确的，单位默认 px。 好，现在我具体讲讲 CSS 的用法：  CSS 分 2 大类型：Type Selector  和  Class Selector  Button { fontSize: 12 }  这个属于 Type Selector，它应用于所有的 Button组件  .myStyle { fontSize: 12 }  这个属于 Class Selector,它是专门用在指定组件上的 请将 CSS 改成这样的  mx:Style  Button { fontSize: 12px }  .myStyle { color: #FF0000; fontSize: 15px }  /mx:Style  现在选中“按钮 2” ，然后，在属性面板里更改 Style，如图： 观察 Design 面板的变化，大家看到，按钮 2 的代码也发生了变化  mx:Button x=10 y=51 label=按钮 2 styleName=myStyle/  注意，所有的组件，如果要应用 Class Selector 到它们身上，都要写在 styleName属性里，比 如 styleName=myStyle。 现在我讲讲优先级： 如果一个组件，它既有 Type Selector 又有 Class Selector，并且还有自己标签上的样式属性， 它们的优先级别是―― 自己标签上的样式属性 最高  Class Selector  第 2  Type Selector  第 3  ―― 但是按照作用范围划分的话 自己标签