Flex样式工作原理

系统启动初始化桌面

1. Flex 在 framework.swc 文件中包括了一个全局样式表 (default.css) 。这个文件包含全局样式类选择器的定义，以及大多数Flex 组件的类型选择器。

   Defaults.css文件定义了flex组件的默认样式，这里的每一个css选择符(selector)就对应下面的一个类。

   Flex编译器编译时会生成很多 有[Mixin]元标签的类，其中大部分类都与样式有关，如"_alertButtonStyleStyle", "_ScrollBarStyle", "_ButtonStyle.as"
   "_activeTabStyleStyle", "_textAreaHScrollBarStyleStyle"等等类，他们的作用就是把样式信息注册样式管理器里边，这样在组件生成时组件能得到自己的样式信息。比如_ButtonStyle.as类文件：如下图也就是说当类的 init(fbs:IFlexModuleFactory)方法执行完后，我们就可以通过方法获得在 defaluts.css文件中定义的样式信息。比如说我们的一个Test.mxml应用，系统在执行Test.mxml类的构造函数时会调用StyleManager.mx_internal::initProtoChainRoots()方法执行完后，StyleManager.stylesRoot属性就会指向一个Object，通过这 Object我们就可以访问到defaults.css文件中的选择符定义的样式信息。

2. 系统启动后用户改变风格
   看下面一个例子：

   当生成 MyButton 时　过程如下：
          首先调用addChild (testBtn), 在这个方法里面
          1、获得选择符中定义的样式的一份拷贝（过 StyleManager.stylesRoot）；
          2、查找 Button css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          3、查找 MyButton css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          查找完type selector后开始查找class selector
          4、查找 .myBtn css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          查找完 class selector 后开始查找inline style
          5、将 color="#ff0000" 样式添加到global拷贝中，同名的样式就覆盖；最后将这些样式信息存储到    UIComponent的inheritingStyles 和 nonInheritingStyles 属性中。这样调用       UIComponent.getStyle(styleProp:String)， 就可以得到正确的样式值了。
   每当组件需要重新设置自己的样式时（比如说调用了setStyle()方法或者设置了styleName属性），组件的styleChanged(styleProp:String)方法就会被调用，然后我们在styleChanged

     (styleProp:String)方法体里面根据参数styleProp的值的不同来对组件的样式做出相应的处理。

          1、setStyle()方法
          当我们调用setStyle()方法的时候，首先会调用该组件的styleChanged(styleProp)然后判断改变的样式是否是可继承样式，如果是，则调用该组件的所有子的styleChanged(styleProp)方法。

          2、addChild(chlid) 
          当我们使用addChild(chlid)时，首先会重新设置该组件和该组件的子的样式缓存，然后调用chlid.styleChanged(null) 和chlid的子的styleChanged(null)方法。

          3、设置 styleName
          当我们给一个组件（比如实例名是child）设置styleName属性时，首先会重新设置该组件和该组件的子的样式缓存，然后调用chlid.styleChanged("styleName")和chlid的子的  styleChanged("styleName")方法。

          4、行时载入样式表单
          运行时载入样式表单我们通常会使用StyleManager.loadStyleDeclarations(url:String,update:Boolean = true, trustContent:Boolean = false,     applicationDomain:ApplicationDomain= null, securityDomain:SecurityDomain = null)方法。当把参 数update设置为true时表示样式表单载入完成后马上更新样式.。其原理是：样式表单载入完成后程序中的所有组件会重新设置组件的样式缓存，并调用组件的styleChanged(null)方法。 

系统启动初始化桌面

1. Flex 在 framework.swc 文件中包括了一个全局样式表 (default.css) 。这个文件包含全局样式类选择器的定义，以及大多数Flex 组件的类型选择器。

   Defaults.css文件定义了flex组件的默认样式，这里的每一个css选择符(selector)就对应下面的一个类。

   Flex编译器编译时会生成很多 有[Mixin]元标签的类，其中大部分类都与样式有关，如"_alertButtonStyleStyle", "_ScrollBarStyle", "_ButtonStyle.as"
   "_activeTabStyleStyle", "_textAreaHScrollBarStyleStyle"等等类，他们的作用就是把样式信息注册样式管理器里边，这样在组件生成时组件能得到自己的样式信息。比如_ButtonStyle.as类文件：如下图也就是说当类的 init(fbs:IFlexModuleFactory)方法执行完后，我们就可以通过方法获得在 defaluts.css文件中定义的样式信息。比如说我们的一个Test.mxml应用，系统在执行Test.mxml类的构造函数时会调用StyleManager.mx_internal::initProtoChainRoots()方法执行完后，StyleManager.stylesRoot属性就会指向一个Object，通过这 Object我们就可以访问到defaults.css文件中的选择符定义的样式信息。

2. 系统启动后用户改变风格
   看下面一个例子：

   当生成 MyButton 时　过程如下：
          首先调用addChild (testBtn), 在这个方法里面
          1、获得选择符中定义的样式的一份拷贝（过 StyleManager.stylesRoot）；
          2、查找 Button css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          3、查找 MyButton css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          查找完type selector后开始查找class selector
          4、查找 .myBtn css 选择符,将里面的样式添加到global拷贝中，同名的样式就覆盖；
          查找完 class selector 后开始查找inline style
          5、将 color="#ff0000" 样式添加到global拷贝中，同名的样式就覆盖；最后将这些样式信息存储到    UIComponent的inheritingStyles 和 nonInheritingStyles 属性中。这样调用       UIComponent.getStyle(styleProp:String)， 就可以得到正确的样式值了。
   每当组件需要重新设置自己的样式时（比如说调用了setStyle()方法或者设置了styleName属性），组件的styleChanged(styleProp:String)方法就会被调用，然后我们在styleChanged

     (styleProp:String)方法体里面根据参数styleProp的值的不同来对组件的样式做出相应的处理。

          1、setStyle()方法
          当我们调用setStyle()方法的时候，首先会调用该组件的styleChanged(styleProp)然后判断改变的样式是否是可继承样式，如果是，则调用该组件的所有子的styleChanged(styleProp)方法。

          2、addChild(chlid) 
          当我们使用addChild(chlid)时，首先会重新设置该组件和该组件的子的样式缓存，然后调用chlid.styleChanged(null) 和chlid的子的styleChanged(null)方法。

          3、设置 styleName
          当我们给一个组件（比如实例名是child）设置styleName属性时，首先会重新设置该组件和该组件的子的样式缓存，然后调用chlid.styleChanged("styleName")和chlid的子的  styleChanged("styleName")方法。

          4、行时载入样式表单
          运行时载入样式表单我们通常会使用StyleManager.loadStyleDeclarations(url:String,update:Boolean = true, trustContent:Boolean = false,     applicationDomain:ApplicationDomain= null, securityDomain:SecurityDomain = null)方法。当把参 数update设置为true时表示样式表单载入完成后马上更新样式.。其原理是：样式表单载入完成后程序中的所有组件会重新设置组件的样式缓存，并调用组件的styleChanged(null)方法。