您的位置:首页 > Web前端 > CSS

FLEX 定义组件样式的方法总结

2009-02-25 09:50 429 查看
FLEX的组件的确很不错,而且可以修改他的样式,让它看起来更舒服。在这个样式这问题上,感觉最麻烦的就是字体问题,同样是8PT的字体,ENGLISH很清楚,中文就惨不忍睹了。闪吧新社区^ v#J,`r8`
BZ
在FLEX里面,可以用几种方法修改:闪吧新社区M"{ d%T9h+h*R0?
1.在控制面板的直接设置闪吧新社区�x!WN}~1s
FLEX里style面板里都可以设置相关组件字体的样式,例如button、lable、checkbox等字体,直接在上面设置就行了。它自动生成的代码如
q WX K7u
~]0下:闪吧新社区&q0KqZ5S{

'dN%Ip&f0

<?xml version="1.0" encoding="utf-8"?>
$V$L�^3?6a x0<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
d"w4@^gf8O0 <mx:Button x="153" y="187" label="Button" fontSize="35"/>
ZiY-n1q/w,y6y0
B;__G_7Cxbm0</mx:Application>
闪吧新社区/j;k H;OT)m-L3W,p|r
闪吧新社区vl(Y3X9im0};p9W
闪吧新社区Iqy5d/dp6f.~
2.setStyle()方法
-O%c+U%L7]g0
0uWn0dh
Fr0

<?xml version="1.0" encoding="utf-8"?>闪吧新社区].}h:j&G7AS(fq
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
p9ghq2m-sw5j0 <mx:Script>
X3^
gJ"c|0 <![CDATA[
aCkJ/MPwl n0 public function initButton():void

KQ9q0i
}-@;Q"^)U0 {闪吧新社区U%A?$K2s$F!v$T
myButton.setStyle("fontSize",35);闪吧新社区{5]bY!~ u%q
}闪吧新社区1lp!}�v7m`s*w O
]]>闪吧新社区e+I'|H Cg
</mx:Script>
rx }U#c"d jQX0 <mx:Button x="153" y="187" label="Button" id="myButton" initialize="initButton()"/>闪吧新社区|"D7|/[R Qkbs

*euO.Xy:J0</mx:Application>
闪吧新社区 a meO`1Y%i
闪吧新社区v"cv;AH'Y)UQ4d:cI
3.使用CSS,在使用CSS这个方法种,可以提供两种选择,直接在MXML里面写,或者提供外部source的CSS。当然拉,直接写在MXML方便,外部CSS,方便统一样式。闪吧新社区9]7q/9z:Q3W P"U

+x.A_)[R0 直接内部定义所有Button的样式:闪吧新社区%XGDR
aG|a:w}.`

<?xml version="1.0" encoding="utf-8"?>
M5vm EY;d"z0<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
})Z6nMV J'~0<mx:Style>闪吧新社区~7?,n&h?G#yOzU
Button{fontSize:35}闪吧新社区4cj$nrzyt
</mx:Style>
/` EH&{0Q5_0 <mx:Button x="153" y="187" label="Button" id="myButton" />闪吧新社区+n*_~}"|Q(a*c%M

.d NXkli{!KV`"l0</mx:Application>
闪吧新社区0lL
|0Rd9r

fPY'R/0 直接内部定义某一个Button样式:闪吧新社区{-g
q
|-}u%A;M5v

<?xml version="1.0" encoding="utf-8"?>
Ujw5t7rv.@IM0<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">闪吧新社区#^#cT
AO3x
<mx:Style>
-jfoWA
A1[K9z6^0 .myStyle{fontSize:35}
v3[ `+xK&Y$KsZ0</mx:Style>
r;U/![(Gg9kM0 <mx:Button x="153" y="187" label="Button" id="myButton" styleName="myStyle"/>
c!ny@SP0
t'I5`/_3h0</mx:Application>
h9kB7t? ?-{ k0
3NRdq#DY1_0 外部定义CSS: ButtonStyle.css:
$Q;I/[ZbeR:I0

/* CSS file */闪吧新社区2ph"Y_Igj
.myStyle
7hw+A"u'iN;p0{
Zv$mYrxR!A^0 fontSize:35;
P4h RtQh*n.rI0}
~WG�T1b j0 连接使用CSS:
Z#wf [(i0

<?xml version="1.0" encoding="utf-8"?>闪吧新社区:rF�Yd)p2A8J
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">闪吧新社区,m ya)Y X&tRA
<mx:Style source="ButtonStyle.css" />
G8iP8g4o0 <mx:Button x="153" y="187" label="Button" id="myButton" styleName="myStyle"/>
4z!IK�_-V,]/S0
QjTQs.n0</mx:Application>
.tiod [S;o+lp0
zJY
A$]M}8W0也许在Button的样式应用问题不大,但是对于Alert这类型的组件来说,要改变默认的样式,方法1很明显是行不通的,只有通过方法2和3了。



本文转自:http://space.flash8.net/space/?479210/action_viewspace_itemid_319325.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: