昨天下载了flex 在网上看到几个例子,马上喜欢上了它,感觉开发flex就跟在DW里面或者可以说跟在vs里托控件,然后进行编程。这种感觉非常棒。
废话不多说,现来熟悉下其几个简单的控件。这次要学的三文本控件
1,text控件
text控件可以以多行的形式输出html源码格式的文本和html解释后的文本,如下比较,注意并不支持所有html代码,详细可以参考帮助文件
<mx:Text width="436" text="你看到的文字的文字将以html源代码的格式输出<br><img src >" height="87" fontFamily="Verdana" fontSize="24" x="20" y="22"/>
<mx:Text x="21" y="117" width="152" height="54" fontSize="16" themeColor="#0080ff">
<mx:htmlText>
<![CDATA[
<a href=’http://bbs.flasher.cn’ target=’_blank’><font color="#0080ff"><b>闪客天堂</b></font></a>
]]>
</mx:htmlText>
</mx:Text>
效果如下,你必须安装flash palyer 9才能看到效果 <mx:Text width="436" text="你看到的文字的文字将以html源代码的格式输出<br><img src >" height="87" fontFamily="Verdana" fontSize="24" x="20" y="22"/>
<mx:Text x="21" y="117" width="152" height="54" fontSize="16" themeColor="#0080ff">
<mx:htmlText>
<![CDATA[
<a href=’http://bbs.flasher.cn’ target=’_blank’><font color="#0080ff"><b>闪客天堂</b></font></a>
]]>
</mx:htmlText>
</mx:Text>
2.lable控件,TextInput控件,TextArea控件
这三个控件在flash 8组件中都是存在
下面以一个简单地例子,如果你以前学过asp/asp.net的话,你将发现flex里面的做法是如此的相似
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
private function btn_click():void {
if(sex.text=="男")
{
msg.text="boy你好"+myname.text.toString()+"你的个人介绍是"+mymessage.text;
} else
{
msg.text="girl你好"+myname.text.toString()+"你的个人介绍是"+mymessage.text;
}
}
]]>
</mx:Script>
<mx:Label x="151" y="10" text="flex学习示例" width="119" fontSize="19" color="#ff0000"/>
<mx:Label x="59" y="44" text="姓名:" fontSize="16" fontFamily="Times New Roman"/>
<mx:TextInput id="myname" x="136" y="47" width="106"/>
<mx:Label x="22" y="88" text="性别:(男或女)" fontSize="16" fontFamily="Times New Roman"/>
<mx:TextInput id="sex" x="136" y="91" width="106"/>
<mx:TextArea id="mymessage" x="136" y="145"/>
<mx:Label x="43" y="141" text="个人爱好:" fontSize="16" fontFamily="Times New Roman"/>
<mx:Button x="151" y="203" label="提交" fontSize="13" click="btn_click()"/>
<mx:TextArea id="msg" x="99" y="251" width="270" height="62"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
private function btn_click():void {
if(sex.text=="男")
{
msg.text="boy你好"+myname.text.toString()+"你的个人介绍是"+mymessage.text;
} else
{
msg.text="girl你好"+myname.text.toString()+"你的个人介绍是"+mymessage.text;
}
}
]]>
</mx:Script>
<mx:Label x="151" y="10" text="flex学习示例" width="119" fontSize="19" color="#ff0000"/>
<mx:Label x="59" y="44" text="姓名:" fontSize="16" fontFamily="Times New Roman"/>
<mx:TextInput id="myname" x="136" y="47" width="106"/>
<mx:Label x="22" y="88" text="性别:(男或女)" fontSize="16" fontFamily="Times New Roman"/>
<mx:TextInput id="sex" x="136" y="91" width="106"/>
<mx:TextArea id="mymessage" x="136" y="145"/>
<mx:Label x="43" y="141" text="个人爱好:" fontSize="16" fontFamily="Times New Roman"/>
<mx:Button x="151" y="203" label="提交" fontSize="13" click="btn_click()"/>
<mx:TextArea id="msg" x="99" y="251" width="270" height="62"/>
</mx:Application>
3.flex内置的文本编辑器RichTextEditor
我想这么多文本控件中,这个最强大,没什么好说的,文本支持html,虽然功能并不是很强大,但对于一般也够用了,大家可以测试一下
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="700"
height="400">
<!-- The HTML text string used to populate the RichTextEditor control’s
TextArea subcontrol. The text is on a single line. -->
<mx:Script>
<![CDATA[
[Bindable]
public var htmlData:String="<textformat leading=’2’><p align=’center’><b><font size=’20’>HTML Formatted Text</font></b></p></textformat><br><textformat leading=’2’><p align=’left’><font face=’_sans’ size=’12’ color=’#000000’>This paragraph contains<b>bold</b>, <i>italic</i>, <u>underlined</u>, and <b><i><u>bold italic underlined </u></i></b>
text.</font></p></textformat><br><p><u><font face=’arial’ size=’14’ color=’#ff0000’>This a red underlined 14-point arial font with no alignment set.</font></u></p><p align=’right’><font face=’verdana’ size=’12’ color=’#006666’><b>This a teal bold 12-pt.’ Verdana font with alignment set to right.</b></font></p><br><li>This is bulleted text.</li><li><font face=’arial’ size=’12’ color=’#0000ff’><u> <a href=’http://www.adobe.com’>This is a bulleted link with underline and blue color set.</a></u></font></li>";
]]>
</mx:Script>
<!-- The RichTextEditor control.
To reference a subcontrol prefix its ID with the RichTextEditor
control ID. -->
<mx:RichTextEditor id="rte1" backgroundColor="#ccffcc" width="605"
headerColors="[#88bb88, #bbeebb]"
footerColors="[#bbeebb, #88bb88]"
title="Rich Text Editor" htmlText="{htmlData}"
initialize="rte1.textArea.setStyle(’backgroundColor’, ’0xeeffee’)"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="700"
height="400">
<!-- The HTML text string used to populate the RichTextEditor control’s
TextArea subcontrol. The text is on a single line. -->
<mx:Script>
<![CDATA[
[Bindable]
public var htmlData:String="<textformat leading=’2’><p align=’center’><b><font size=’20’>HTML Formatted Text</font></b></p></textformat><br><textformat leading=’2’><p align=’left’><font face=’_sans’ size=’12’ color=’#000000’>This paragraph contains<b>bold</b>, <i>italic</i>, <u>underlined</u>, and <b><i><u>bold italic underlined </u></i></b>
text.</font></p></textformat><br><p><u><font face=’arial’ size=’14’ color=’#ff0000’>This a red underlined 14-point arial font with no alignment set.</font></u></p><p align=’right’><font face=’verdana’ size=’12’ color=’#006666’><b>This a teal bold 12-pt.’ Verdana font with alignment set to right.</b></font></p><br><li>This is bulleted text.</li><li><font face=’arial’ size=’12’ color=’#0000ff’><u> <a href=’http://www.adobe.com’>This is a bulleted link with underline and blue color set.</a></u></font></li>";
]]>
</mx:Script>
<!-- The RichTextEditor control.
To reference a subcontrol prefix its ID with the RichTextEditor
control ID. -->
<mx:RichTextEditor id="rte1" backgroundColor="#ccffcc" width="605"
headerColors="[#88bb88, #bbeebb]"
footerColors="[#bbeebb, #88bb88]"
title="Rich Text Editor" htmlText="{htmlData}"
initialize="rte1.textArea.setStyle(’backgroundColor’, ’0xeeffee’)"/>
</mx:Application>
