Flex, как сделать разноцветные поля в textArea с помощью colorPicker? - PullRequest
Новая
       296

Flex, как сделать разноцветные поля в textArea с помощью colorPicker?

0 голосов
/ 08 февраля 2012

Я пытаюсь создать чат, используя Flash Builder. У меня есть область чата (компонент textArea), поле для ввода текста (компонент textInput) и colorPicker для изменения цвета текста. Проблема в том, что невозможно изменить цвет каждого сообщения в textArea (если я наберу одно сообщение красным цветом, другое синее и т. Д.), Я смогу изменить их все вместе, используя: 

txtHistory.setStyle("color",cp.selectedColor);

полный код: 

<?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" applicationComplete="init()">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            private const SERVER:String = "rtmfp://stratus.adobe.com/";
            private const DEVKEY:String = "YOUR-DEVKEY";

            [Bindable]
            private var userName:String;

            [Bindable]
            private var connected:Boolean = false;

            private var netConnection:NetConnection;
            private var netGroup:NetGroup;

            private function init():void{
                userName = "user"+Math.round(Math.random()*1000);

                connect();

            }

            private function connect():void{
                netConnection = new NetConnection();
                netConnection.addEventListener(NetStatusEvent.NET_STATUS,netStatus);                
                netConnection.connect(SERVER+DEVKEY);
            }

            private function netStatus(event:NetStatusEvent):void{
                writeText(event.info.code);

                switch(event.info.code){
                    case "NetConnection.Connect.Success":
                        setupGroup();
                        break;

                    case "NetGroup.Posting.Notify":
                        receiveMessage(event.info.message);
                        break;

                    case "NetGroup.Connect.Success":
                        connected = true;
                        break;
                }
            }

            private function setupGroup():void{
                var spec:GroupSpecifier = new GroupSpecifier("myGroup");
                spec.postingEnabled = true;
                spec.serverChannelEnabled = true;

                netGroup = new NetGroup(netConnection,spec.groupspecWithAuthorizations());
                netGroup.addEventListener(NetStatusEvent.NET_STATUS,netStatus);

            }

            private function sendMessage(txt:String):void{
                var message:Object = new Object();
                message.text = txt;
                message.userName = txtUser.text;
                message.sender = netGroup.convertPeerIDToGroupAddress(netConnection.nearID);

                netGroup.post(message);
                receiveMessage(message);
            }

            private function receiveMessage(message:Object):void{
                writeText(message.userName +": "+message.text);

            }

            private function writeText(txt:String):void{
                txtHistory.appendText(txt+"\n");
    txtHistory.setStyle("color",cp.selectedColor);
            }



            protected function sendNow():void
            {
                sendMessage(txtMessage.text);
            }

        ]]>
    </fx:Script>

    <s:TextInput text="{userName}" x="10" bottom="10" id="txtUser"/>
    <s:TextInput left="146" right="88" bottom="10" id="txtMessage" enter="sendNow()"/>
    <s:TextArea left="10" right="10" top="10" bottom="40" id="txtHistory"/>
    <s:Button enabled="{connected}" label="Send" bottom="10" right="10" click="sendNow()" id="btnSend"/>
<mx:ColorPicker id="cp" x="10" y="221" width="29" height="29" selectedColor="#CCCCCC"/>
</s:Application>

Вторая проблема заключается в том, что даже полное изменение цвета (txtHistory.setStyle("color",cp.selectedColor);

работает только в том случае, если строка txtHistory.appendText(txt+"\n"); изменяется на txtHistory.text += txt+"\n";

Как это можно решить? Я слышал о htmlText, но я совсем новичок во Flex и не знаю точно, как он работает. Код с примером будет лучшим ответом для меня!

Заранее спасибо!

...