WPF——Expander控件（转)

　　标头通Header属性来设置，内容通过Conent属性设置，如下面一个简单的例子：

1. <Expander ExpandDirection="Down" Width="96"> 
2.     <Expander.Header> 
3.         <TextBlock Text="标题" FontWeight="Bold"/> 
4.     </Expander.Header> 
5.     <Expander.Content> 
6.         <TextBlock TextWrapping="Wrap"  Text="这里是内容。"/> 
7.     </Expander.Content> 
8. </Expander> 

　　Expander控件的Header和Content都可以为任何对象，只要能正常显示即可。

　　下面就是该控件运行时的截图。

　　这个控件最实用的地方，就是做导航栏。

1. <StackPanel Margin="20,20" Width="100" Height="460" HorizontalAlignment="Left" 
2.             VerticalAlignment="Top"> 
3.     <Expander VerticalAlignment="Stretch" ExpandDirection="Down" HorizontalContentAlignment="Left" SnapsToDevicePixels="True"> 
4.         <Expander.Header> 
5.             <TextBlock Text="用户管理" FontSize="14" FontWeight="Bold" /> 
6.         </Expander.Header> 
7.         <Expander.Content> 
8.             <Grid> 
9.                 <Grid.RowDefinitions> 
10.                     <RowDefinition Height="auto"/> 
11.                     <RowDefinition Height="auto"/> 
12.                 </Grid.RowDefinitions> 
13.                 <RadioButton Grid.Row="0">会员管理</RadioButton> 
14.                 <RadioButton Grid.Row="1">角色管理</RadioButton> 
15.             </Grid> 
16.         </Expander.Content> 
17.     </Expander> 
18.     <Expander VerticalAlignment="Stretch" ExpandDirection="Down" HorizontalContentAlignment="Left" SnapsToDevicePixels="True"> 
19.         <Expander.Header> 
20.             <TextBlock Text="文档管理" FontSize="14" FontWeight="Bold" /> 
21.         </Expander.Header> 
22.         <Expander.Content> 
23.             <Grid> 
24.                 <Grid.RowDefinitions> 
25.                     <RowDefinition Height="auto"/> 
26.                     <RowDefinition Height="auto"/> 
27.                     <RowDefinition Height="auto"/> 
28.                 </Grid.RowDefinitions> 
29.                 <RadioButton Grid.Row="0">部门资料</RadioButton> 
30.                 <RadioButton Grid.Row="1">员工资料</RadioButton> 
31.                 <RadioButton Grid.Row="2">职位资料</RadioButton> 
32.             </Grid> 
33.         </Expander.Content> 
34.     </Expander> 
35.     <Expander VerticalAlignment="Stretch" ExpandDirection="Down" HorizontalContentAlignment="Left" SnapsToDevicePixels="True"> 
36.         <Expander.Header> 
37.             <TextBlock Text="采购管理" FontSize="14" FontWeight="Bold" /> 
38.         </Expander.Header> 
39.         <Expander.Content> 
40.             <Grid> 
41.                 <Grid.RowDefinitions> 
42.                     <RowDefinition Height="auto"/> 
43.                     <RowDefinition Height="auto"/> 
44.                     <RowDefinition Height="auto"/> 
45.                     <RowDefinition Height="auto"/> 
46.                     <RowDefinition Height="auto"/> 
47.                 </Grid.RowDefinitions> 
48.                 <RadioButton Grid.Row="0">采购计划</RadioButton> 
49.                 <RadioButton Grid.Row="1">需求分析</RadioButton> 
50.                 <RadioButton Grid.Row="2">采购单</RadioButton> 
51.                 <RadioButton Grid.Row="3">入库验收</RadioButton> 
52.                 <RadioButton Grid.Row="4">入库退回</RadioButton> 
53.             </Grid> 
54.         </Expander.Content> 
55.     </Expander> 
56.     <Expander VerticalAlignment="Stretch" ExpandDirection="Down" HorizontalContentAlignment="Left" SnapsToDevicePixels="True"> 
57.         <Expander.Header> 
58.             <TextBlock Text="供应商" FontSize="14" FontWeight="Bold" /> 
59.         </Expander.Header> 
60.         <Expander.Content> 
61.             <Grid> 
62.                 <Grid.RowDefinitions> 
63.                     <RowDefinition Height="auto"/> 
64.                     <RowDefinition Height="auto"/> 
65.                     <RowDefinition Height="auto"/> 
66.                 </Grid.RowDefinitions> 
67.                 <RadioButton Grid.Row="0">基本资料</RadioButton> 
68.                 <RadioButton Grid.Row="1">往来单位</RadioButton> 
69.                 <RadioButton Grid.Row="2">上游供应商</RadioButton> 
70.             </Grid> 
71.         </Expander.Content> 
72.     </Expander> 
73. </StackPanel> 

　　另外，通过ExpandDirection属性可控其展开的方向。

1. <Expander VerticalAlignment="Stretch" ExpandDirection="Right" HorizontalContentAlignment="Left" SnapsToDevicePixels="True"> 
2.          ............ 
3.  
4. </Expander>