4 Replies Latest reply on May 6, 2011 12:03 PM by Shongrunden

    How to Change The background colour of Textinput in flex4

    vineet osho

      Hi frnds

                   let me know if there any property in textinput class that change its background color from white to something else.

      i am using flex4(flash builder 4).in flex 3 there is a backgroundColor property which set its color but in  flex 4 there is no any property so let me know any substitute property for this.



      Thanks and Regards

        Vineet Osho

        • 1. Re: How to Change The background colour of Textinput in flex4
          EvyatarBH Level 3

          Like many other design related properties, when using Spark components you need to create a custom skin for such a change.

           

          Just ask Flash Builder to create a new MXML Skin (for TextInput Host Component) and ask it to be a copy of the default skin.

          Inside the generated file I believe you would find the background rectangle easily.

           

          Good luck!

          1 person found this helpful
          • 2. Re: How to Change The background colour of Textinput in flex4
            vineet osho Level 1

            Hi thanks for your quick reply.as directed i created a mxml skin by taking textinput as a host component name it Customskin.and apply in my demo code like this

             

            <?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" minWidth="955" minHeight="600">
                <s:TextArea id="txtDemo" skinClass="{CustomSkin}" width="100" height="100"/>
                <fx:Declarations>
                    <!-- Place non-visual elements (e.g., services, value objects) here -->
                </fx:Declarations>
               
            </s:Application>

             

             

            in this customskin code i got the property fill as a listed below.and i make its color red from white

            still i m not getting red background color.please tell me where i m wrong.

             

            <!-- fill -->
                <!--- Defines the appearance of the TextInput component's background. -->
                <s:Rect id="background" left="1" right="1" top="1" bottom="1">
                    <s:fill>
                        <!--- @private Defines the background fill color. -->
                        <s:SolidColor id="bgFill" color="0xFF0000" />
                    </s:fill>
                </s:Rect>

             

             


            Thanks and regards

              Vineet osho

            • 3. Re: How to Change The background colour of Textinput in flex4
              EvyatarBH Level 3

              I'm not sure that's the problem, but you defined a Skin for TextInput and used it for a TextArea component...

              • 4. Re: How to Change The background colour of Textinput in flex4
                Shongrunden Adobe Employee

                You should be able to use the contentBackgroundColor style:

                 

                <s:TextInput contentBackgroundColor="red" text="test" />

                1 person found this helpful