Question

我正在尝试创建一个原型，用户可以通过选择菜单项来显示或显示项目。我需要删除项目/折叠，因为我需要空白空间被WrapPanel中的其他项目占用。 wrapPanel中的内容是使用XMLDataProvider动态生成的。我试图为菜单项分配命令，但无法使其工作。

XAML：

<Grid Margin="20">  
    <Menu x:Name="Manage_Menu" HorizontalAlignment="Left" Background="{x:Null}" ScrollViewer.VerticalScrollBarVisibility="Auto" Foreground="#FF2A2A2A" Margin="0,0,0,5" >
        <MenuItem Header="Show/Hide">
                  <MenuItem Header="1" Command="{x:Static local:MainWindow.FirstThumbVisibilityWindowCommand}" IsCheckable="true" IsChecked="True"/>
                  <MenuItem Header="2" Command="{x:Static local:MainWindow.FirstThumbVisibilityWindowCommand}" IsCheckable="true" />
                  <MenuItem Header="3" Command="{x:Static local:MainWindow.FirstThumbVisibilityWindowCommand}" IsCheckable="true" />
                  <MenuItem Header="4" Command="{x:Static local:MainWindow.FirstThumbVisibilityWindowCommand}" IsCheckable="true" />
                  <MenuItem Header="5" Command="{x:Static local:MainWindow.FirstThumbVisibilityWindowCommand}" IsCheckable="true" />
        </MenuItem>
    </Menu>
    <Frame Content="Frame" Source="../tiles.xaml" NavigationUIVisibility="Hidden" />
</Grid>

我希望有人能够提供帮助。整个解决方案可从此处获得：

http://cid-0c29483cf3a6a14d.office.live.com/self.aspx/WPF%5E_Tests/DragDropWrapPanel%5E_3.rar

请看一下。您将在左上角找到用于隐藏/显示wrapPanel内项目的菜单。提前谢谢。

Answer 1

从包装面板添加或删除项目的一种方法是使用ListBox，并将ItemsPanel配置为WrapPanel

<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <WrapPanel />
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>

将ListBox绑定到ObservableCollection，然后从绑定集合中添加和删除视图模型。

Answer 2

以下是从代码更改WrapPanel项目的可见性的示例。

一些示例XAML：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0" Orientation="Horizontal">
        <Button Content="0" Click="Button_Click"/>
        <Button Content="1" Click="Button_Click"/>
        <Button Content="2" Click="Button_Click"/>
    </StackPanel>
    <WrapPanel Grid.Row="1" x:Name="wrapPanel">
        <Rectangle Fill="Red" Width="100" Height="100"/>
        <Rectangle Fill="Green" Width="100" Height="100"/>
        <Rectangle Fill="Blue" Width="100" Height="100"/>
    </WrapPanel>
</Grid>

和按钮事件处理程序：

private void Button_Click(object sender, RoutedEventArgs e)
{
    int index = int.Parse((string)((sender as Button).Content));
    var child = this.wrapPanel.Children[index];
    child.Visibility = child.Visibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible;
}

只是切换与按钮上的文本对应的子项的可见性。

Answer 3

这是一个仅限XAML的quick-n-dirty版本。它使用内置的BooleanToVisibilityConverter和Element绑定。

<Window x:Class="WrapPanelHideItems.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="WrapPanelHideItems" Height="300" Width="300">

    <Window.Resources>
        <BooleanToVisibilityConverter x:Key="boolToVis" />
    </Window.Resources>

    <StackPanel>
        <Menu>
            <MenuItem Header="Show/Hide">
                <MenuItem x:Name="mnuItemOne"
                          IsCheckable="True"
                          IsChecked="True"
                          Header="Show Item One" />
                <MenuItem x:Name="mnuItemTwo"
                          IsCheckable="True"
                          IsChecked="True"
                          Header="Show Item Two" />
                <MenuItem x:Name="mnuItemThree"
                          IsCheckable="True"
                          IsChecked="True"
                          Header="Show Item Three" />
                <MenuItem x:Name="mnuItemFour"
                          IsCheckable="True"
                          IsChecked="True"
                          Header="Show Item Four" />
                <MenuItem x:Name="mnuItemFive"
                          IsCheckable="True"
                          IsChecked="True"
                          Header="Show Item Five" />
            </MenuItem>
        </Menu>

        <WrapPanel Orientation="Horizontal"
                   HorizontalAlignment="Stretch"
                   VerticalAlignment="Stretch"
                   Background="Gray">
            <TextBlock Text="Item One"
                       Margin="5"
                       FontSize="25"
                       Foreground="Red"
                       Visibility="{Binding ElementName=mnuItemOne, Path=IsChecked,
                                            Converter={StaticResource boolToVis}}"/>
            <TextBlock Text="Item Two"
                       Margin="5"
                       FontSize="25"
                       Foreground="Blue"
                       Visibility="{Binding ElementName=mnuItemTwo, Path=IsChecked,
                                            Converter={StaticResource boolToVis}}"/>
            <TextBlock Text="Item Three"
                       Margin="5"
                       FontSize="25"
                       Foreground="Green"
                       Visibility="{Binding ElementName=mnuItemThree, Path=IsChecked,
                                            Converter={StaticResource boolToVis}}"/>
            <TextBlock Text="Item Four"
                       Margin="5"
                       FontSize="25"
                       Foreground="Yellow"
                       Visibility="{Binding ElementName=mnuItemFour, Path=IsChecked,
                                            Converter={StaticResource boolToVis}}"/>
            <TextBlock Text="Item Five"
                       Margin="5"
                       FontSize="25"
                       Foreground="Violet"
                       Visibility="{Binding ElementName=mnuItemFive, Path=IsChecked,
                                            Converter={StaticResource boolToVis}}"/>
        </WrapPanel>
    </StackPanel>
</Window>

当然，在真实世界的应用程序中，您需要使用Styles和DataBinding之类的东西，但这表明您无需复杂即可获得所需的结果。更简单通常更好。

如何从WrapPanel中删除或添加项目？

3 个答案: