Skip to main content
Cherryblossom36
Cherryblossom36
New Participant
February 13, 2024
Solved

Show/hide drop shadow in component

  • February 13, 2024
  • 5 replies
  • 1953 views

Hello,
I have created a Button component. Now I would like to optionally add a drop shadow.

With the Boolean Properties it’s possible to show or hide elements. I would like to show or hide the drop shadow. The background of my button is not a separate element, it just the colored background of the text. I have no option to set the Boolean setting on the layer with the shadow.

Does anyone have a tip?

This topic has been closed for replies.
Best answer by Pavel_Kiselev

Well, just make a background as a separate layer, place it absolutely, set constraints to take the whole space and bind boolean prop to it. Done 😉

5 replies

Pavel_Kiselev
Pavel_KiselevAnswer
Power Member
February 13, 2024

Well, just make a background as a separate layer, place it absolutely, set constraints to take the whole space and bind boolean prop to it. Done 😉

    Figmate
    Junko3
    Figmate
    February 15, 2024

    Hi @Cherryblossom36, Thank you for reaching out about Boolean Properties. I understand how handy that the drop shadow in a component has a boolean property.

    I completely agree with the @Pavel_Kiselev method (Thank you so much!) so please give it a try!
    Below is a visual supplement for you, and you can check the details for Absolute position here:Explore auto layout properties

    Screenshot 2024-02-15 at 12.48.40

    I hope this information sheds some additional light for you! Please let us know if we are missing any additional points!

    Thanks,

      Cherryblossom36
      Cherryblossom36Author
      New Participant
      February 20, 2024

      Thank you so much! I didn’t know about the absolute position in auto layout! That’s the solution. 🙂

        Hector_Jaime
        Hector_Jaime
        May 2, 2024

        Thanks for the background tip! I, however don’t think this is a long-term solution. We build our components to better align with code and have as few layers as possible. Buttons, don’t have separate backgrounds in CSS; the color is set as a box (aka the Frame) style, as is the drop shadow. So, at some point, including effects for booleans (along with a number of other things) would be better than having to create separate background, particularly for components more complex than a button.

          Hector_Jaime
          Hector_Jaime
          May 2, 2024

          edit: booleans for effects.

          Terms & ConditionsAccessibility statement