Share via


How to: Create an Expander

This example shows how to create an Expander control. An Expander control enables users to view a header that expands to display more content or collapses to save space.

Example

The following example creates an Expander control that opens downward and displays text that is defined by the Content property. The Header property defines the Expander title, which in this example is My Expander.

The Expander control window is open when the application starts because the IsExpanded property is set to true.

<Expander Name="myExpander" Background="Tan" 
          HorizontalAlignment="Left" Header="My Expander" 
          ExpandDirection="Down" IsExpanded="True" Width="100">
  <TextBlock TextWrapping="Wrap">
    Lorem ipsum dolor sit amet, consectetur
    adipisicing elit, sed do eiusmod tempor incididunt ut
    labore et dolore magna aliqua
  </TextBlock>
</Expander>

For the complete sample, see Expander Sample.

See Also

Reference

Expander

Concepts

Expander Overview

Other Resources

Expander Samples
Expander How-to Topics