隐藏 GridViewItem 并在 GridView 中重新定位项目

Question

正如你在上面看到的，我需要它重新调整自己以对齐。明明物品还存在，有没有办法完全忽略它们？

我有一个 ObservableCollection：

 public static volatile ObservableCollection<MyVideo> MyVideoModels = new ObservableCollection<MyVideo>();

这里填充了 MyVideo 对象。

像这样将它绑定到我的 GridView：

public VideosFoundView()
        {
            this.InitializeComponent();
            this.AddVideoFolderGridView.ItemsSource = VideosFoundView.MyVideoModels;
        }

我为 GridView 使用的 DataTemplate。

<GridView Grid.Row="2" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" x:Name="AddVideoFolderGridView">
            <GridView.ItemTemplate>
                <DataTemplate>
                    <Border BorderThickness="5">
                        <Image Source="{Binding FullImageLocationOnDisk}"  MaxHeight="300" MaxWidth="200" DoubleTapped="gridViewItem_DoubleTapped" Loaded="gridViewItem_Loaded" Loading="gridViewItem_Loading">
                        </Image>
                    </Border>
                </DataTemplate>
            </GridView.ItemTemplate>
        </GridView>

我在这个 GridView 上方有一个静态 ToggleSwitch，如下所示：

 <Grid Grid.Row="1">
                <Grid>
                    <TextBlock Text="Ingore Image Not Found"/>
                    <ToggleSwitch x:Name="ToggleSwitchIgnoreImages" Toggled="ignoreImages_Toggled"/>
                </Grid>
            </Grid>

其中：

 private void ignoreImages_Toggled(object sender, RoutedEventArgs e)
        {
            ToggleSwitch tSwitch = (ToggleSwitch)(sender as ToggleSwitch);
            if (tSwitch.IsOn)
            {
                for(int i = 0; i < VideosFoundView.MyVideoModels.Count; i++)
                {
                    if(VideosFoundView.MyVideoModels[i].FullImageLocationOnDisk == "ms-appx:///Assets/image-not-found.gif")
                    {
                        var gridViewItem = (GridViewItem)this.AddVideoFolderGridView.ContainerFromIndex(i);
                        gridViewItem.Visibility = Visibility.Collapsed;
                    }
                }
            }
            else
            {
                for (int i = 0; i < VideosFoundView.MyVideoModels.Count; i++)
                {
                    //VideosFoundView.MyVideoModels[i].Visibility = "Auto";         
                    var gridViewItem = (GridViewItem)this.AddVideoFolderGridView.ContainerFromIndex(i);
                    gridViewItem.Visibility = Visibility.Visible;
                }
            }
        }

但问题是这些项目仍在我的 GridView 上占据 space，而其他项目没有相应地重新定位。

Answer 1

当 GridViewItem 折叠时，这些项目仍在 GridView 上占用 space。可能是因为ItemTemplate还没有刷新，space还是保留的。

作为解决方法，项目中有一个用于 UWP 的工具包 WrapPanel 端口 WinRTXamlToolkit。

您可以从 NuGet.

获取

然后在您的页面中添加此前缀：

xmlns:toolkit="using:WinRTXamlToolkit.Controls"

现在您可以像以前一样使用 <toolkit:WrapPanel Orientation="Horizontal" ></toolkit:WrapPanel>。

例如：

<GridView x:Name="AddVideoFolderGridView">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <toolkit:WrapPanel Orientation="Horizontal"  >
            </toolkit:WrapPanel>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <GridView.ItemTemplate>
        <DataTemplate>
            <Border BorderThickness="5">
                <Image Source="{Binding FullImageLocationOnDisk}"  MaxHeight="300" MaxWidth="200" DoubleTapped="gridViewItem_DoubleTapped" Loaded="gridViewItem_Loaded" Loading="gridViewItem_Loading">
                </Image>
            </Border>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

Answer 2

这里的解决方案：Not showing items with Visibility=Collapsed in Windows 8.1 GridView

tldr: 编辑 GridView 的模板，并将 ItemsPanelTemplate 中的 ItemsWrapGrid 替换为可以在此处找到的 WrapPanel http://codepaste.net/8gr5go

隐藏 GridViewItem 并在 GridView 中重新定位项目

Hide GridViewItem and reposition items in GridView

c#

asp.net

xaml

gridview

win-universal-app