WPF Web Based

R4R^®

WPF with C#

WPF Web Based Tutorials

WPF Examples

WPF

WPF Projects

WPF Project

WPF Interview Materials

WPF subjective question

WPF Interview question

WPF Objective question

WPF FAQS

Expander Control in WPF WEB BASED

Home

The Expander Control is like GroupBox. We will use StackPanel control and RadioButton in this example. An Expander control provides a way to provide content in an expandable area that resembles a window and includes a header. The Expander Control is the simple control.

Output:

Code For this is given below:

<Page x:Class="WpfBrowserApplication3.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1">
<Grid Width="276" Height="283">
<StackPanel Background="DarkSalmon" Margin="0,0,117,0">
<Expander Header="Friends List">
<StackPanel>
<RadioButton GroupName="One" IsChecked="True">Option 1</RadioButton>
<RadioButton GroupName="One" IsChecked = "False">Option 2</RadioButton>
</StackPanel>
</Expander>
<Expander Header="Girls Friend List">
<StackPanel>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >Radhika Awasthi  
</Hyperlink></RadioButton>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >Archana Gupta
</Hyperlink></RadioButton>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >
bharti Pathak</Hyperlink>
</RadioButton>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >Anshu Rana</Hyperlink>
</RadioButton>
</StackPanel>
</Expander>
<Expander Header="College Friends">
<StackPanel>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >kamal Mishra</Hyperlink>
</RadioButton>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >Dinesh Gupta</Hyperlink>
</RadioButton>
<RadioButton GroupName="One" IsChecked="True">
<Hyperlink NavigateUri="http://www.google.com" >Aditya </Hyperlink>
</RadioButton>
</StackPanel>
</Expander>
</StackPanel>
</Grid>
</Page>

The Expander can only contain one thing: its contents. If we want to add multiple items, we have to put something inside the Expander that can hold some number of other things. The StackPanel, as with all the other layout panels, can hold multiple items, so we can add another StackPanel.

The StackPanel itself solves some specific layout scenarios, but it’s quite flexible. It could be used, for example, to build a calculator. You should be able to see how this would work—one vertical StackPanel containing a number of vertical StackPanels for the buttons. It wouldn’t be easy, but it would be possible.

In the next section, we will talk about the DockPanel. The DockPanel can be used to solve some of the same problems but in a different way. As with the StackPanel, the DockPanel, while flexible, is designed to handle a different set of scenarios.