3 Replies Latest reply on Aug 9, 2010 7:10 PM by Matt Le Fevre

    White background with White Text..?

    RockoFaith

      Hello,

       

      We have an application where there is an editable area of text in which the text is white because the canvas behind it is dark..

       

      However...when the user clicks to edit the text, a text box around the text shows up and the background of that box is white, which makes it impossible for the user to see what they are typing.

       

      Any help on how to change the color of the text box is greatly appreciated.

       

      Using Flex 3.

        • 1. Re: White background with White Text..?
          Matt Le Fevre Level 4

          keeping it quick and simple,you could set it up so that whilst editing the text area the font colour changes, for example:

           

          <mx:TextArea id="txtArea1" x="69" y="127" width="324" height="198" 
                  focusIn="txtArea1.setStyle('color', 'red')" 
                  focusOut="txtArea1.setStyle('color', 'black')"/>
          
          • 2. Re: White background with White Text..?
            RockoFaith Level 1

            Thank you Matt,

             

            Looking at the code, we currently have

             

             

             

            <mx:TextInput x="70" y="1" id="txtLat" textAlign="right" styleName="WhiteLabel" text="{Lat}" editable="true" fontWeight="normal" focusIn="{txtLat.setStyle('backgroundAlpha','1')}" focusOut="{txtLat.setStyle('backgroundAlpha','0')}" backgroundAlpha="0.0" height="15" borderStyle="none" fontSize="9" width="85"/>
            

             

            how would I add the color to the current parameters?

             

            Sorry, I'm a total new bee...we have developers doing this, but I thought I could do the small things :-/

             

            Thanks much!

            • 3. Re: White background with White Text..?
              Matt Le Fevre Level 4

              can be placed directly after the already existing commands focusIn/Out events, seperating them with a semi colon like such

               

              <mx:TextInput x="70" y="1" id="txtLat"
                  textAlign="right" styleName="WhiteLabel"
                   text="sjhsdjkfhsdjkfhsdjkhfjkshdjkfs" editable="true"
                    fontWeight="normal"
                    focusIn="txtLat.setStyle('backgroundAlpha','1'); txtLat.setStyle('color', 'red');"
                    focusOut="txtLat.setStyle('backgroundAlpha','0'); txtLat.setStyle('color', 'black');"
                    backgroundAlpha="0.0" height="15"
                    borderStyle="none" fontSize="9" width="85"/>
                   

               

              have highlighted the inclusion for you

               

              the colour values (red/black) will also accept Hex and uint values (0xFF0000 etc..). Might be an idea to move the style changes to a seperate function, just to keep the mxml tidier.

               

               

               

              any other issues, just let me know