C# 自动调整项目宽度的GridView

C# 自动调整项目宽度的GridView,c#,gridview,uwp,uwp-xaml,C#,Gridview,Uwp,Uwp Xaml,我有一个网格视图,项目源xbind指向一个可观察的集合。集合由用户控件组成,用户控件本质上是一个按钮。 我希望网格视图以以下方式容纳项目 1如果它可以在一行中显示两个项目,则继续 2如果只能显示一个项目,则需要将其拉伸以占用所有空间 如果不遵循第2点,一行中只有一个项目,因为第二个项目无法进入第一行。所有这些空白看起来非常糟糕 <GridView ItemsPanel="{StaticResource VariableSizedItemTemplate}" ItemContainerSty

我有一个网格视图,项目源xbind指向一个可观察的集合。集合由用户控件组成,用户控件本质上是一个按钮。 我希望网格视图以以下方式容纳项目

1如果它可以在一行中显示两个项目,则继续

2如果只能显示一个项目,则需要将其拉伸以占用所有空间

如果不遵循第2点,一行中只有一个项目,因为第二个项目无法进入第一行。所有这些空白看起来非常糟糕

<GridView ItemsPanel="{StaticResource VariableSizedItemTemplate}" ItemContainerStyleSelector="{StaticResource VariableSizedStyleSelector}" Name="ContentGrid" ItemsSource="{x:Bind projectsButtonCollection,Mode=OneWay}"></GridView>

 <ItemsPanelTemplate x:Key="VariableSizedItemTemplate">
   <VariableSizedWrapGrid Orientation="Horizontal"/>
 </ItemsPanelTemplate>
VariableSizedStyle选择器当前正在根据用户控件的属性分配样式。属性只是我们在创建用户控件时初始化的一个int。 样式具有行跨和列跨

 <Setter Property="VariableSizedWrapGrid.RowSpan"
           Value="2" />
 <Setter Property="VariableSizedWrapGrid.ColumnSpan"
           Value="2" />

我不认为当前的代码会有帮助,因为我想改变我现在正在做的事情,项目被完美地调整,直到每行只有一个用户控件的空间。然后我就有了所有剩余的空间。

实现您想要做的事情的一种方法是在GridView\u SizeChanged事件上获取触发器,并根据窗口的大小,您可以拥有1、2、3、4项等,以方便为准。在这段代码中,我在下面的代码中做了类似的事情

private async void GridView_SizeChanged(object sender, SizeChangedEventArgs e)
{
    try
    {
        ItemsWrapGrid itemsWPGrid = (ItemsWrapGrid)((GridView)sender).ItemsPanelRoot;
        double viewWidth = ApplicationView.GetForCurrentView().VisibleBounds.Width;
        int number = 2;
        //here 200 is the size if the item and number is the number of items in a row
        number = Convert.ToInt32(Math.Floor(viewWidth / 200));
        Debug.WriteLine("The current height is " + itemsWPGrid.ItemHeight + " and width " + itemsWPGrid.ItemWidth + "and view width " + viewWidth);
        {
            await Windows.ApplicationModel.Core.CoreApplication.MainView.CoreWindow.Dispatcher.RunAsync(CoreDispatcherPriority.Normal,
               () =>
               {
                    //Set the width of the items based on how many number of items that can fit
                   if (viewWidth < 350)
                   {
                       //Display 2 items in a row and the 45 is used for margin/padding
                       itemsWPGrid.ItemWidth = (viewWidth - 45) / 2;
                   }
                   else if (number >= 4 && viewWidth >= 500)
                   {
                       itemsWPGrid.ItemWidth = (viewWidth - 100) / (number - 1);
                   }
                   else if (number == 3 && viewWidth < 400)
                   {
                       if (viewWidth < 375)
                           itemsWPGrid.ItemWidth = (viewWidth - 10) / number;
                       else
                           itemsWPGrid.ItemWidth = (viewWidth - 30) / number;
                   }
                   else if (number == 3 && viewWidth > 400)
                   {
                       itemsWPGrid.ItemWidth = (viewWidth - 50) / number;
                   }


                   //Below takes care of the condition to make sure the aspect ratio is corrected.
                   if (!double.IsNaN(itemsWPGrid.ItemWidth) && viewWidth > 350)
                       itemsWPGrid.ItemHeight = itemsWPGrid.ItemWidth * 1.7;
                   else if (viewWidth == 360 && double.IsNaN(itemsWPGrid.ItemWidth))
                   {
                       itemsWPGrid.ItemHeight = viewWidth / 3 * 1.7;
                   }
                   else if (!double.IsNaN(itemsWPGrid.ItemWidth))
                   {
                       itemsWPGrid.ItemHeight = itemsWPGrid.ItemWidth * 1.5;
                   }
               });
        }
        Debug.WriteLine("The new height is " + itemsWPGrid.ItemHeight + " and width " + itemsWPGrid.ItemWidth + "and view width " + viewWidth);
    }
    catch
    {

    }
}

你能展示你的一些代码吗?添加了GridView面板和样式详细信息。如果你不想重新发明轮子,有一个,