您可以让扩展器覆盖 WPF 中的其他可视化树元素吗?
Can you have an expander do an overlay overtop of other visual tree elements in WPF?
这个问题是表面问题,而不是数据问题。有没有一种简单的方法来放置
的元素
<Expander>(contents)</Expander>
在弹出窗口或其他内容中使其覆盖在其他元素之上?
XAML:(我只是做了一个简单的 For 循环来填充构造函数中 ViewModel 中 'Locs' 的绑定,否则大部分 VM 都是空白的)
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:MVVM"
mc:Ignorable="d"
Title="MainWindow" Height="600" Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Expander ExpandDirection="Down" IsExpanded="True" HorizontalAlignment="Stretch">
<Expander.Header>
<TextBlock TextAlignment="Left" HorizontalAlignment="Center" VerticalAlignment="Center" Text="LOCATIONS" FontWeight="Bold"/>
</Expander.Header>
<ScrollViewer ScrollViewer.VerticalScrollBarVisibility="Auto" Height="300" HorizontalAlignment="Stretch">
<ItemsControl ItemsSource="{Binding Locs}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<CheckBox Margin="5" Content="{Binding}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Expander>
</Grid>
<Label Grid.Row="1" Height="100" Content="Test Content" FontSize="32" />
</Grid>
</Window>
应用程序启动,看起来不错。
单击扩展器,现在它会折叠,但会向上跳转文本。我在可视化树中理解这是默认行为,但是 有没有一种简单的方法可以将它包裹在一些覆盖层中,就像弹出窗口一样,当它折叠时不会使其他文本跳转?
您可以将 Expander
的 Height
属性 设置为固定值以预先保留其垂直 space。
或者您可以将 ScrollViewer
放在 Popup
中,例如:
<Expander x:Name="expander" ExpandDirection="Down" IsExpanded="True" HorizontalAlignment="Stretch">
<Expander.Header>
<TextBlock TextAlignment="Left" HorizontalAlignment="Center" VerticalAlignment="Center" Text="LOCATIONS" FontWeight="Bold"/>
</Expander.Header>
<Popup PlacementTarget="{Binding ElementName=expander}"
Placement="Bottom"
IsOpen="{Binding IsExpanded, ElementName=expander}">
<ScrollViewer ScrollViewer.VerticalScrollBarVisibility="Auto" Height="300" HorizontalAlignment="Stretch"
Background="White">
<ItemsControl>
<CheckBox Margin="5" Content="1" />
<CheckBox Margin="5" Content="2" />
<CheckBox Margin="5" Content="3" />
<CheckBox Margin="5" Content="4" />
<CheckBox Margin="5" Content="5" />
</ItemsControl>
</ScrollViewer>
</Popup>
</Expander>
<Label Grid.Row="1" Height="100" Content="Test Content" FontSize="32" />
您可能希望阅读此内容以便能够在 Expander
移动时移动弹出窗口:
How can I move a WPF Popup when its anchor element moves?
这个问题是表面问题,而不是数据问题。有没有一种简单的方法来放置
的元素<Expander>(contents)</Expander>
在弹出窗口或其他内容中使其覆盖在其他元素之上?
XAML:(我只是做了一个简单的 For 循环来填充构造函数中 ViewModel 中 'Locs' 的绑定,否则大部分 VM 都是空白的)
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:MVVM"
mc:Ignorable="d"
Title="MainWindow" Height="600" Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Expander ExpandDirection="Down" IsExpanded="True" HorizontalAlignment="Stretch">
<Expander.Header>
<TextBlock TextAlignment="Left" HorizontalAlignment="Center" VerticalAlignment="Center" Text="LOCATIONS" FontWeight="Bold"/>
</Expander.Header>
<ScrollViewer ScrollViewer.VerticalScrollBarVisibility="Auto" Height="300" HorizontalAlignment="Stretch">
<ItemsControl ItemsSource="{Binding Locs}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<CheckBox Margin="5" Content="{Binding}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Expander>
</Grid>
<Label Grid.Row="1" Height="100" Content="Test Content" FontSize="32" />
</Grid>
</Window>
应用程序启动,看起来不错。
单击扩展器,现在它会折叠,但会向上跳转文本。我在可视化树中理解这是默认行为,但是 有没有一种简单的方法可以将它包裹在一些覆盖层中,就像弹出窗口一样,当它折叠时不会使其他文本跳转?
您可以将 Expander
的 Height
属性 设置为固定值以预先保留其垂直 space。
或者您可以将 ScrollViewer
放在 Popup
中,例如:
<Expander x:Name="expander" ExpandDirection="Down" IsExpanded="True" HorizontalAlignment="Stretch">
<Expander.Header>
<TextBlock TextAlignment="Left" HorizontalAlignment="Center" VerticalAlignment="Center" Text="LOCATIONS" FontWeight="Bold"/>
</Expander.Header>
<Popup PlacementTarget="{Binding ElementName=expander}"
Placement="Bottom"
IsOpen="{Binding IsExpanded, ElementName=expander}">
<ScrollViewer ScrollViewer.VerticalScrollBarVisibility="Auto" Height="300" HorizontalAlignment="Stretch"
Background="White">
<ItemsControl>
<CheckBox Margin="5" Content="1" />
<CheckBox Margin="5" Content="2" />
<CheckBox Margin="5" Content="3" />
<CheckBox Margin="5" Content="4" />
<CheckBox Margin="5" Content="5" />
</ItemsControl>
</ScrollViewer>
</Popup>
</Expander>
<Label Grid.Row="1" Height="100" Content="Test Content" FontSize="32" />
您可能希望阅读此内容以便能够在 Expander
移动时移动弹出窗口:
How can I move a WPF Popup when its anchor element moves?