Show or hide an object in your application

  • Article

You have multiple options for hiding objects in your application. The option that you select depends on which of the following results you want:

  • To create an instantaneous change in visibility, use the Visibility property.

  • To animate a gradual change in visibility, use the Opacity property under Appearance, or use the Alpha property in the color picker under Brushes.

Note

Hiding an object in your application hides all its child objects, if any exist.

Note

Hiding an object on the artboard can make it easier to see other objects while you design your application. To hide a specific object, use the Hide/Show toggle. For more information, see Show or hide an object on the artboard.

To show or hide an object instantaneously

  1. In the Tools panel in Microsoft Expression Blend, click SelectionCc294548.2ff91340-477e-4efa-a0f7-af20851e4daa(en-us,Expression.30).png, and then select the object for which you want to change the visibility.

  2. Under Appearance in the Properties panel, click the arrow next to the drop-down list for the Visibility property, and then select one of the following options:

    • Visible   To show the object in your application.

    • Hidden   To hide the object in your application but let it maintain its layout proportions on the artboard.

    • Collapsed   To hide the object in your application in a minimized state so that it does not maintain its layout proportions. In other words, the parent object will reduce its size accordingly if the size of the parent object relies on the size of the collapsed child object.

To animate a gradual change in visibility

  1. In the Tools panel in Expression Blend, click SelectionCc294548.2ff91340-477e-4efa-a0f7-af20851e4daa(en-us,Expression.30).png, and then select the object for which you want to change the visibility.

  2. In an animation timeline, move the timeline playhead Cc294548.5626c9eb-40bb-450a-9ca1-3678e5abe429(en-us,Expression.30).png to the time where you want to change the visibility of your object. (For an example of creating an animation timeline, see Create a simple animation.)

  3. Select one of the following options that will create a keyframe on the animation timeline:

    • Opacity   Under Appearance in the Properties panel, adjust the value of the Opacity property. For example, an opacity value of 0 percent makes the object invisible.

    • Alpha   Under Brushes in the Properties panel, adjust the value of the Alpha property. For example, an alpha value of 0 percent makes the object invisible.

      Note

      You can adjust the Alpha value only for a Solid color brush or a Gradient brush. You cannot adjust the Alpha value of a brush resource, nor can you animate from No brush to a brush.

  4. Test your animation by clicking Play Cc294548.64ad8e84-1eec-4154-9d0c-11fef322c0bf(en-us,Expression.30).png. The timeline will animate a gradual change between the original value of the Opacity or Alpha property to the new value.