TabNavigator 내부의 HTML 콘텐츠

Question

나는 tabNavigator 탭을 동적으로 추가하고 있는데 일부 단어에 HTML 스타일을 추가하는 방법을 알 수 없습니다.

정말 몇 단어 만 굵게 또는 줄여서 만 필요하지만 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> 

Answer 1

당신은 텍스트 흐름 사용할 수 있습니다 귀하의 코멘트 당

<?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> 

는 MXML 구성 요소라는 만들기

귀하의 주요 응용 프로그램 : HtmlNavigatorContent

<?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>