2017-09-29 66 views
1

我想要实现一个GridView,它将一行中的3个项目,并且如果最后一行中的项目数量是2,那么最后一行项目应该对齐中心而不是左对齐,对齐。这里有几张图片来解释我想实现的目标。中心对齐最后一行中的GridView项目

目前我的实现看起来像

this

这就是我想要实现的。

this

任何帮助,将不胜感激。

回答

0

有许多方法可以实现您提到的功能。总而言之,您需要继承GridView并覆盖MeasureOverrideArrangeOverride方法来重新计算Panel的子项的每个Rect。这种方式很复杂。欲了解更多信息,你可以参考 XAML custom panels overview

而且您还可以使用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> 

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); 
    } 
} 

enter image description here

然而,这个简单的方法不能适合所有的情况。

+0

谢谢。你能否提供你在这个运行示例中使用的代码? – aadilp

+0

是的,[this](https://github.com/ZhuMingHao/GridViewFlowTest.git)是代码示例。 –