Expander 概觀
Expander控制項提供一種方式，在類似視窗且包含標頭的可展開區域中提供內容。
建立簡單的展開器
下列範例示範如何建立簡單的 Expander 控制項。 此範例會 Expander 建立看起來像上一個圖例的 。
<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>
的 Content 和 HeaderExpander 也可以包含複雜的內容，例如 RadioButton 和 Image 物件。
設定展開內容區域的方向
您可以使用 屬性，設定控制項的內容區域 Expander ，以四個方向之一（ Down 、、 UpLeft 或 Right ） ExpandDirection 展開。 當內容區域折迭時，只會 ExpanderHeader 顯示 和 其切換按鈕。 Button顯示方向箭號的控制項會當做切換按鈕來展開或折迭內容區域。 展開時，會 Expander 嘗試在類似視窗的區域顯示其所有內容。
控制面板中展開器的大小
Expander如果控制項位於繼承自 Panel 的配置控制項內，例如 StackPanel ，當 屬性設定為 Down 或 Up 時 ExpandDirection ，請勿在 上 Expander 指定 Height 。 同樣地，當 屬性設定為 Left 或 Right 時 ExpandDirection ，請勿在 上 Expander 指定 Width 。
當您在顯示展開內容的方向設定 Expander 控制項的大小維度時， Expander 會控制內容所使用的區域，並顯示其周圍的框線。 該框線即使在內容摺疊時也會顯示。 若要設定展開的內容區域大小，請在 括住內容的 Expander 上 ScrollViewer 設定大小維度，或如果您想要捲動功能。
Expander當控制項是 中的最後一個專案 DockPanel 時，Windows Presentation Foundation （WPF） 會自動將 Expander 維度設定為等於 的 DockPanel 剩餘區域。 若要避免此預設行為，請將 LastChildFill 物件上的 DockPanel 屬性設定為 false ，或確定 Expander 不是 中的最後一個專案 DockPanel 。
建立可捲動的內容
如果內容太大而無法容納內容區域的大小，您可以包裝 的內容， ScrollViewer 以提供可捲動的內容 Expander 。 控制項 Expander 不會自動提供捲動功能。 下圖顯示 Expander 包含 控制項的 ScrollViewer 控制項。
ScrollViewer 中的展開器
當您將控制項放在 Expander 中 ScrollViewer 時，請設定 ScrollViewer 對應至內容開啟至內容區域大小方向 Expander 的 Expander 維度屬性。 例如，如果您將 ExpandDirection 上的 Expander 屬性設定為 Down （內容區域已關閉），請將 控制項上的 ScrollViewer 屬性設定 Height 為內容區域所需的高度。 如果您改為在內容本身設定高度維度， ScrollViewer 則無法辨識此設定，因此不會提供可捲動的內容。
下列範例示範如何建立 Expander 具有複雜內容的控制項，以及包含 ScrollViewer 控制項。 本範例會建立 ， Expander 就像本節開頭的圖例一樣。
void MakeExpander()
{
//Create containing stack panel and assign to Grid row/col
StackPanel sp = new StackPanel();
Grid.SetRow(sp, 0);
Grid.SetColumn(sp, 1);
sp.Background = Brushes.LightSalmon;
//Create column title
TextBlock colTitle = new TextBlock();
colTitle.Text = "EXPANDER CREATED FROM CODE";
colTitle.HorizontalAlignment= HorizontalAlignment.Center;
colTitle.Margin.Bottom.Equals(20);
sp.Children.Add(colTitle);
//Create Expander object
Expander exp = new Expander();
//Create Bullet Panel for Expander Header
BulletDecorator bp = new BulletDecorator();
Image i = new Image();
BitmapImage bi= new BitmapImage();
bi.UriSource = new Uri(@"pack://application:,,/images/icon.jpg");
i.Source = bi;
i.Width = 10;
bp.Bullet = i;
TextBlock tb = new TextBlock();
tb.Text = "My Expander";
tb.Margin = new Thickness(20,0,0,0);
bp.Child = tb;
exp.Header = bp;
//Create TextBlock with ScrollViewer for Expander Content
StackPanel spScroll = new StackPanel();
TextBlock tbc = new TextBlock();
tbc.Text =
"Lorem ipsum dolor sit amet, consectetur adipisicing elit," +
"sed do eiusmod tempor incididunt ut labore et dolore magna" +
"aliqua. Ut enim ad minim veniam, quis nostrud exercitation" +
"ullamco laboris nisi ut aliquip ex ea commodo consequat." +
"Duis aute irure dolor in reprehenderit in voluptate velit" +
"esse cillum dolore eu fugiat nulla pariatur. Excepteur sint" +
"occaecat cupidatat non proident, sunt in culpa qui officia" +
"deserunt mollit anim id est laborum.";
tbc.TextWrapping = TextWrapping.Wrap;
spScroll.Children.Add(tbc);
ScrollViewer scr = new ScrollViewer();
scr.Content = spScroll;
scr.Height = 50;
exp.Content = scr;
exp.Width=200;
exp.HorizontalContentAlignment= HorizontalAlignment.Stretch;
//Insert Expander into the StackPanel and add it to the
//Grid
sp.Children.Add(exp);
myGrid.Children.Add(sp);
}
Sub MakeExpander()
'Create containing stack panel and assign to Grid row/col
Dim sp As StackPanel = New StackPanel()
Grid.SetRow(sp, 0)
Grid.SetColumn(sp, 1)
sp.Background = Brushes.LightSalmon
'Create column title
Dim colTitle As TextBlock = New TextBlock()
colTitle.Text = "EXPANDER CREATED FROM CODE"
colTitle.HorizontalAlignment = HorizontalAlignment.Center
colTitle.Margin.Bottom.Equals(20)
sp.Children.Add(colTitle)
'Create Expander object
Dim exp As Expander = New Expander()
'Create Bullet Panel for Expander Header
Dim bp As BulletDecorator = New BulletDecorator()
Dim i As Image = New Image()
Dim bi As BitmapImage = New BitmapImage()
bi.UriSource = New Uri("pack://application:,,./images/icon.jpg")
i.Source = bi
i.Width = 10
bp.Bullet = i
Dim tb As TextBlock = New TextBlock()
tb.Text = "My Expander"
tb.Margin = New Thickness(20, 0, 0, 0)
bp.Child = tb
exp.Header = bp
'Create TextBlock with ScrollViewer for Expander Content
Dim spScroll As StackPanel = New StackPanel()
Dim tbc As TextBlock = New TextBlock()
tbc.Text = _
"Lorem ipsum dolor sit amet, consectetur adipisicing elit," + _
"sed do eiusmod tempor incididunt ut labore et dolore magna" + _
"aliqua. Ut enim ad minim veniam, quis nostrud exercitation" + _
"ullamco laboris nisi ut aliquip ex ea commodo consequat." + _
"Duis aute irure dolor in reprehenderit in voluptate velit" + _
"esse cillum dolore eu fugiat nulla pariatur. Excepteur sint" + _
"occaecat cupidatat non proident, sunt in culpa qui officia" + _
"deserunt mollit anim id est laborum."
tbc.TextWrapping = TextWrapping.Wrap
spScroll.Children.Add(tbc)
Dim scr As ScrollViewer = New ScrollViewer()
scr.Content = spScroll
scr.Height = 50
exp.Content = scr
'Insert Expander into the StackPanel and add it to the
'Grid
exp.Width = 200
exp.HorizontalContentAlignment = HorizontalAlignment.Stretch
sp.Children.Add(exp)
myGrid.Children.Add(sp)
End Sub
<Expander Width="200" HorizontalContentAlignment="Stretch">
<Expander.Header>
<BulletDecorator>
<BulletDecorator.Bullet>
<Image Width="10" Source="images\icon.jpg"/>
</BulletDecorator.Bullet>
<TextBlock Margin="20,0,0,0">My Expander</TextBlock>
</BulletDecorator>
</Expander.Header>
<Expander.Content>
<ScrollViewer Height="50">
<TextBlock TextWrapping="Wrap">
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum.
</TextBlock>
</ScrollViewer>
</Expander.Content>
</Expander>
使用對齊屬性
您可以在 控制項上 Expander 設定 和 VerticalContentAlignment 屬性， HorizontalContentAlignment 以對齊內容。 當您設定這些屬性時，對齊方式會套用到標頭，也會套用到所展開的內容。
另請參閱
意見反應
即將登場：在 2024 年，我們將逐步淘汰 GitHub 問題作為內容的意見反應機制，並將它取代為新的意見反應系統。 如需詳細資訊，請參閱：https://aka.ms/ContentUserFeedback。
提交並檢視相關的意見反應