v1_09 介绍样式和皮肤

v1_09 Introducing styling and skinning 介绍flex样式和皮肤

 

1.对已有的控制抽取样式文件,点击转换为css

 

2.引入和使用样式 

    使用fx:style 引用样式文件,在控制中使用styleName来使用样式

<fx:Style source="style.css"/>
		
<s:Label x="74" y="64" text="我的文字我来控制" width="180" height="18" styleName="zhongyi"/>

 

样式文件:

/* CSS file */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";


.zhongyi
{
	color: #B41C1C;
	fontFamily: "中易黑体";
}
	

 

 

3.创建和使用皮肤

skin的创建  使用s:SparkSkin标签来创建皮肤

<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo">

 

 

在一般的skin中至少有两种状态  normal  和disabled

一些控制(如按钮)还会有up donw over

 

创建一个skin

 

mxml中引用该skin

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
skinClass="skins.YmkyveSkin">

 

 

同时会看到以下fx:Script,但这部分不是必须的

<fx:Script>
<![CDATA[
import skins.YmkyveSkin;
]]>
</fx:Script>

 

 

最后可以通过项目主题来改变整个应用的skin