我有一个案例，我正在动态添加tabNavigator标签，我无法弄清楚如何在某些单词中添加HTML样式。
我真的只需要几个单词就可以使用BOLD或UNDERLINE，但我无法在NavigatorContent标记内使用任何HTML格式。
任何人都可以帮我吗？我一直在寻找好几个小时而一无所获。
这是我到目前为止所拥有的。 （内容是从外部XML文件中提取的）。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="500" height="600" creationComplete="initApp()">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<s:HTTPService id="chatlist" result="resultHandler(event)"
url="http://localhost/FlexLiveChat/LiveChat2/chat.xml"/>
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
private function initApp():void
{
chatlist.send();
}
private function resultHandler(event:ResultEvent):void
{
var dp:ArrayCollection = event.result.chatsession.chat as ArrayCollection;
for(var i:int = 0; i < dp.length; i++) {
var t:TextField = new TextField( );
t.htmlText = "This field contains <B>HTML!</B>";
var label:Label = new Label();
label.text = dp.getItemAt(i).message;
var context:NavigatorContent = new NavigatorContent();
context.label = dp.getItemAt(i).chatperson;
context.addElement(label);
tn.addChild(context);
}
}
]]>
</fx:Script>
<s:BorderContainer left="10" right="10" top="10" bottom="10" height="100%" borderVisible="false">
<s:VGroup id="mainBG" x="0" y="0" width="100%" height="100%" textAlign="center">
<mx:TabNavigator id="tn" width="100%" height="100%" color="0x323232">
<!-- Define each panel using a VBox container. -->
<s:NavigatorContent label="Home">
<s:Label text="This panel is always available \n\n container panel 1"/>
<mx:Text text="This is a text control."/>
</s:NavigatorContent>
</mx:TabNavigator>
<s:TextArea width="100%" height="62" textAlign="left"/>
<s:Button label="Post Message"/>
</s:VGroup></s:BorderContainer>
</s:WindowedApplication>
答案 0 :(得分：0)
您可以使用文字流：
<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="100%"
height="100%"
gap="0">
<fx:Script>
<![CDATA[
import flashx.textLayout.conversion.TextConverter;
import flashx.textLayout.elements.TextFlow;
private const text:String =
"<b>bold text</b><br />" +
"<br />" +
"<u>underlined text</u><br />" +
"<br />" +
"<ul>" +
"<li>list item<br /></li>" +
"<li>list item<br /></li>" +
"<li>list item<br /></li>" +
"</ul>" +
"<a href='http://www.google.com'>a link</a><br />" +
"<br />";
]]>
</fx:Script>
<s:RichEditableText editable="false"
selectable="true"
textFlow="{TextConverter.importToFlow(text, TextConverter.TEXT_FIELD_HTML_FORMAT)}"
buttonMode="true"
width="100%"
height="100%" />
</s:VGroup>
根据您的评论，您应该将导航器内容视图抽象为组件。
根据你的例子：
您的主要应用
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="500"
height="600"
creationComplete="initApp()">
<fx:Declarations>
<s:HTTPService id="chatlist"
result="resultHandler(event)"
url="http://localhost/FlexLiveChat/LiveChat2/chat.xml" />
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
private function initApp():void
{
chatlist.send();
}
private function resultHandler(event:ResultEvent):void
{
var dp:ArrayCollection = event.result.chatsession.chat as ArrayCollection;
for (var i:int = 0; i < dp.length; i++)
{
var htmlNavigatorContent:HtmlNavigatorContent = new HtmlNavigatorContent();
// attach result you want in the html text,
// including other properties.
htmlNavigatorContent.htmlText = "This field contains <B>HTML!</B>";
tn.addChild(htmlNavigatorContent);
}
}
]]>
</fx:Script>
<s:BorderContainer left="10"
right="10"
top="10"
bottom="10"
height="100%"
borderVisible="false">
<s:VGroup id="mainBG"
x="0"
y="0"
width="100%"
height="100%"
textAlign="center">
<mx:TabNavigator id="tn"
width="100%"
height="100%"
color="0x323232">
<!-- Define each panel using a VBox container. -->
<s:NavigatorContent label="Home">
<s:Label text="This panel is always available \n\n container panel 1" />
<mx:Text text="This is a text control." />
</s:NavigatorContent>
</mx:TabNavigator>
<s:TextArea width="100%"
height="62"
textAlign="left" />
<s:Button label="Post Message" />
</s:VGroup>
</s:BorderContainer>
</s:WindowedApplication>
创建名为：HtmlNavigatorContent
的MXML组件<?xml version="1.0" encoding="utf-8"?>
<s:NavigatorContent xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="100%"
height="100%">
<fx:Script>
<![CDATA[
import flashx.textLayout.conversion.TextConverter;
import flashx.textLayout.elements.TextFlow;
[Bindable]
public var htmlText:String;
]]>
</fx:Script>
<s:RichEditableText editable="false"
selectable="true"
textFlow="{TextConverter.importToFlow(htmlText, TextConverter.TEXT_FIELD_HTML_FORMAT)}"
buttonMode="true"
width="100%"
height="100%" />
</s:NavigatorContent>