10 Replies Latest reply on Jul 5, 2011 11:30 PM by sohilr

    add drop shadow with css?

    john isaacks Level 1
      is there a way to add a dropshadow with css? (specifically to a label component)


      Thanks!
        • 1. Re: add drop shadow with css?
          matthew horn Level 3
          No, drop shadows are implemented as filters, not styles. They cannot be set via CSS in Flex 3.

          matt horn
          flex docs
          • 2. Re: add drop shadow with css?
            john isaacks Level 1
            Thank you for answering!
            • 3. Re: add drop shadow with css?
              Level 7

              "danger42" <webforumsuser@macromedia.com> wrote in message
              news:gi8m68$i9s$1@forums.macromedia.com...
              > No, drop shadows are implemented as filters, not styles. They cannot be
              > set via CSS in Flex 3.

              You could, however, extend whatever component it is you're wanting to apply
              the style to to add the capability of a CSS drop shadow.


              • 4. add drop shadow with css?
                AllenCobb Level 2
                quote:

                Originally posted by: danger42
                No, drop shadows are implemented as filters, not styles. They cannot be set via CSS in Flex 3.

                matt horn
                flex docs


                Although Matt's reply is true with respect to label components, which is what the original question addressed, it's worth pointing out that MXML Styles can set dropshadows on components which happen to expose the dropShadowEnabled property. Perhaps this is new to Flex 3.2.

                For example, CSS can apply dropshadows to TextArea, Canvas, DataGrid, AdvancedDataGrid, and other list-based containers, but not to Buttons, Labels, ComboBoxes, Images, etc. The rationale for exposing or not exposing the dropShadowEnabled (and dropShadowColor) property is not clear, so you have to refer to the docs.

                I would recommend updating this Answer with a bit more detail.

                Thanks,

                Allen
                • 5. Re: add drop shadow with css?
                  Phrankie Level 1
                  quote:

                  Originally posted by: ashtangakasha
                  quote:

                  Originally posted by: danger42
                  No, drop shadows are implemented as filters, not styles. They cannot be set via CSS in Flex 3.

                  matt horn
                  flex docs


                  Although Matt's reply is true with respect to label components, which is what the original question addressed, it's worth pointing out that MXML Styles can set dropshadows on components which happen to expose the dropShadowEnabled property. Perhaps this is new to Flex 3.2.

                  For example, CSS can apply dropshadows to TextArea, Canvas, DataGrid, AdvancedDataGrid, and other list-based containers, but not to Buttons, Labels, ComboBoxes, Images, etc. The rationale for exposing or not exposing the dropShadowEnabled (and dropShadowColor) property is not clear, so you have to refer to the docs.

                  I would recommend updating this Answer with a bit more detail.

                  Thanks,

                  Allen


                  I use CSS to add drop shadows; alternately I declare them as an MXML attribute. There's peculiar an unexpected hitch with either approach. It seems that you must set also set a borderStyle or dropShadowEnabled has no effect.

                  Phrankie
                  • 6. Re: add drop shadow with css?
                    AllenCobb Level 2
                    Phrankie,

                    Yes, I noticed that too. I found that a plain border seemed to work most consistently, but I didn't test thoroughly. If I don't want a border, I have to leave it set to flat and then set the thickness to zero.

                    I hope Matt notices these replies. I'd feel better if the Answer were updated to be more accurate. Or, if setting dropshadows via CSS is not supposed to work, then it would be good to know that.
                    • 7. Re: add drop shadow with css?
                      Phrankie Level 1
                      quote:

                      Originally posted by: ashtangakasha
                      Phrankie,

                      Yes, I noticed that too. ... If I don't want a border, I have to leave it set to flat and then set the thickness to zero.


                      Thanks for confirming this peculiar behavior. In this case it seems odd that one attribute would be dependent upon another.

                      I hope Matt notices these replies. I'd feel better if the Answer were updated to be more accurate. Or, if setting dropshadows via CSS is not supposed to work, then it would be good to know that.


                      Agreed,

                      Phrankie

                      • 8. Re: add drop shadow with css?
                        Level 7

                        "Phrankie" <webforumsuser@macromedia.com> wrote in message
                        news:gop31l$24j$1@forums.macromedia.com...
                        >
                        quote:

                        Originally posted by: ashtangakasha
                        >
                        quote:

                        Originally posted by: danger42
                        > No, drop shadows are implemented as filters, not styles. They cannot be
                        > set
                        > via CSS in Flex 3.
                        >
                        > matt horn
                        > flex docs

                        >
                        > Although Matt's reply is true with respect to label components, which is
                        > what
                        > the original question addressed, it's worth pointing out that MXML Styles
                        > can set dropshadows on components which happen to expose the
                        > dropShadowEnabled property. Perhaps this is new to Flex 3.2.
                        >
                        > For example, CSS can apply dropshadows to TextArea, Canvas, DataGrid,
                        > AdvancedDataGrid, and other list-based containers, but not to Buttons,
                        > Labels,
                        > ComboBoxes, Images, etc. The rationale for exposing or not exposing the
                        > dropShadowEnabled (and dropShadowColor) property is not clear, so you have
                        > to
                        > refer to the docs.

                        I think it depends on whether the component has a HaloBorder or not.


                        • 9. Re: add drop shadow with css?
                          AllenCobb Level 2
                          Ah, yes. That makes sense. I haven't poked into the source, but it sounds like the dropshadow may be a method of the border itself.
                          • 10. Re: add drop shadow with css?
                            sohilr Level 1

                            Hi ,

                            I  m using Flex 4. I would like to know now if this feature is avalaible for labels .

                             

                            Thanks,

                            Sohil