將最后一行中的 GridView 項目居中對齊

Question

我想實現一個 GridView，它連續接受 3 個項目，如果最后一行的項目數是 2，那么最后一行項目應該居中對齊而不是左對齊。 這里有幾張圖片來解釋我想要實現的目標。

目前我的實現看起來像

.

這就是我想要實現的目標。

任何幫助將不勝感激。

Answer 1

有很多方法可以實現您提到的功能。

總之，你需要繼承GridView和重寫MeasureOverride ArrangeOverride方法重新計算每個Rect面板的孩子。 這種方式很復雜。 有關更多信息，您可以參考XAML 自定義面板概述。

您也可以使用PrepareContainerForItemOverride方法直接重新布局項目。

<local:VariableGrid 
           x:Name="MyGridView" 
           SelectionMode="Single"       
         IsSwipeEnabled="False">
    <local:VariableGrid.ItemTemplate >
        <DataTemplate>
            <StackPanel BorderBrush="Red" BorderThickness="3" Height="200" Width="200" Margin="20">
            </StackPanel>
        </DataTemplate>
    </local:VariableGrid.ItemTemplate>
    <local:VariableGrid.ItemsPanel>
        <ItemsPanelTemplate>
            <VariableSizedWrapGrid 
                Orientation="Horizontal"
                VerticalAlignment="Top"
                ScrollViewer.HorizontalScrollMode="Enabled"
                ScrollViewer.VerticalScrollMode="Disabled"
                MaximumRowsOrColumns="4">
            </VariableSizedWrapGrid>
        </ItemsPanelTemplate>
    </local:VariableGrid.ItemsPanel>
</local:VariableGrid>

變量網格.cs

public sealed class VariableGrid : GridView
{
    public VariableGrid()
    {
        this.DefaultStyleKey = typeof(VariableGrid);
    }
    protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
    {
        var list = this.ItemsSource as List<string>;      
        var griditem = element as GridViewItem;          
        for (var t = ((list.Count - list.Count % 4)); t < list.Count; t++)
        {
            if (item as string == list[t])
            {
                if (griditem != null)
                {
                    VariableSizedWrapGrid.SetColumnSpan(griditem, 2);
                }
            }
        }
        base.PrepareContainerForItemOverride(element, item);
    }
}

然而，這種簡單的方式並不能適應所有的場景。