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 Level 1

      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