如何编写在GridView(XAML-Win8)组中流动项目的
代码,如下图所示?
我目前有一个自定义TemplateSELEctor,为第一个项目选择一个不同的(更大)模板,但是这里指定的流程:
@H_
502_4@<GroupStyle.Panel>
<ItemsPanelTemplate>
<q42:WrapPanel Orientation="Horizontal" Width="440" Margin="0,80,0"/>
<!-- also tried VariableSizedWrapGrid -->
</ItemsPanelTemplate>
</GroupStyle.Panel>
类似地包装项目1到3,但是然后将项目4放置在项目6的位置,而不填写项目4和5.
问题变成;我如何编写类似于css的代码:
@H_
502_4@.item
{ display: inline-block; }
.item1
{ float: left; }
,这将使物品像我想要的那样流动?
Andreas H
AMMar将我联系到
一个有效的
解决方案:
@H_
502_4@using Sy
stem.Collection
s.Generi
c;
using Application1.Data;
using Window
s.Foundation;
using Window
S.UI.Xaml;
using Window
S.UI.Xam
l.Controls;
namespace Application1
{
public class MyGridView : GridView
{
int _rowVal;
int _colVal;
readonly List<Size> _sequence;
public MyGridView()
{
_sequence = new List<Size>
{
LayoutSize
s.Pri
MaryItem,LayoutSize
s.Secondary
smallItem,LayoutSize
s.Other
smallItem,// 5
LayoutSize
s.Other
smallItem,LayoutSize
s.SecondaryTallItem,// 7
LayoutSize
s.Other
smallItem,// 9
LayoutSize
s.Other
smallItem,// 11
LayoutSize
s.Secondary
smallItem,LayoutSize
s.Other
smallItem
};
}
protected override void PrepareContainerForItemOverride(DependencyOb
ject element,ob
ject item)
{
base.PrepareContainerForItemOverride(element,item
);
var dataItem = item as SampleDataItem;
var index = -1;
if (dataItem
!= null)
{
index = dataIte
m.Group.Item
s.IndexOf(dataItem
);
}
if (index >= 0 && index < _sequence.Count)
{
_colVal = (
int) _sequence[index].Width;
_rowVal = (
int) _sequence[index].Height;
}
else
{
_colVal = (
int) LayoutSize
s.Other
smallIte
m.Width;
_rowVal = (
int) LayoutSize
s.Other
smallIte
m.Height;
}
VariableSizedWrapGrid.SetRowSpan(element as UIElement,_rowVal
);
VariableSizedWrapGrid.Set
columnSpan(element as UIElement,_colVal
);
}
}
public static class LayoutSizes
{
public static Size Pri
MaryItem = new Size(6,2
);
public static Size Secondary
smallItem = new Size(3,1
);
public static Size SecondaryTallItem = new Size(2,2
);
public static Size Other
smallItem = new Size(2,1
);
}
}
@H_
502_4@<local:MyGridView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</local:MyGridView.ItemsPanel>
<local:MyGridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Margin="1,6">
<Button
AutomationPropertie
s.Name="Group
title"
Content="
{Binding
titlE}"
Click="Header_Click"
Style="
{Static
resource TextButtonStyl
E}"/>
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid ItemWidth="80" ItemHeight="160" Orientation="Vertical" Margin="0,0" MaximumRowsOr
columns="3"/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</local:MyGridView.GroupStyle>
</local:MyGridView>