如何使用ListViewRenderer在Xamarin UWP中使用ListView的GroupHeader模板

时间:2016-09-28 09:01:25

标签: uwp xamarin.uwp

我在HeaderTemplate中定义了以下App.xaml

<DataTemplate x:Key="ListViewGroupHeaderTemplate">
    <TextBlock Foreground="Black" Text="Something" />
</DataTemplate>

我在ListViewRenderer

中以这种方式使用它
listView.ItemTemplate = App.Current.Resources["ListViewItemTemplate"] as Windows.UI.Xaml.DataTemplate;
var gs = new GroupStyle();
gs.HeaderTemplate = App.Current.Resources["ListViewGroupHeaderTemplate"] as Windows.UI.Xaml.DataTemplate;
listView.GroupStyle.Add(gs);

ListView的来源是CollectionViewSource

CollectionViewSource cvs = new CollectionViewSource();
cvs.IsSourceGrouped = true;

cvs.Source = ((SourceListView)Element).Items;
if (listView.ItemsSource == null)
  listView.ItemsSource = cvs.View;

ItemTemplate效果很好。

这是ListView看起来的样子(白色部分是组头):

enter image description here

我应该设置什么才能使标题生效?

更新

我根据答案修改了我的来源(应用分组到一个简单的List):

    CollectionViewSource cvs = new CollectionViewSource();
    cvs.IsSourceGrouped = true;
    var items = ((MyListView)Element).Items;
    var itemsAsOC = items as ObservableCollection<GroupListItem>;
    List<ListItem> list = new List<ListItem>();
    foreach (var item in itemsAsOC)
    {
      list.AddRange(item);
    }
    var group = from item in list group item by item.Value into grp orderby grp.Key select grp;                
    cvs.Source = group;

标题没有任何变化,所以我猜数据源是正确的,但模板处理中存在一些严重的Xamarin UWP错误:

enter image description here

更新2:

我在没有Xamarin渲染器的情况下测试了 ,它显示了标题项。

enter image description here

但是,当我使用Xamarin渲染器时, 标题已消失

enter image description here

您可以download并对其进行测试。

2 个答案:

答案 0 :(得分:0)

基本上我在代码中找不到任何明显的问题,以下是我将GroupHeader模板添加到ListView的方式。

在App.xaml中:

<Application.Resources>
    <DataTemplate x:Key="ListViewGroupHeaderTemplate">
        <TextBlock Foreground="Red" Text="{Binding Key}" />
    </DataTemplate>
    <DataTemplate x:Key="ListViewTemplate">
        <TextBlock Foreground="Black" Text="{Binding DateTimeProperty}" />
    </DataTemplate>
</Application.Resources>

这是我的项目类和我的SourceListView

public class ListItem
{
    public DateTime DateTimeProperty { get; set; }
}

public class SourceListView
{
    public SourceListView()
    {
        Element = from x in Collection group x by x.DateTimeProperty.Year into grp orderby grp.Key select grp;
    }

    public IList<ListItem> Collection { get; set; } = new List<ListItem>()
    {
        new ListItem() {DateTimeProperty = DateTime.Parse("2011-08-01") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2011-08-21") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2012-04-03") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2012-04-01") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2013-05-15") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2013-05-06") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2013-05-01") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2013-06-01") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2013-06-09") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2014-10-02") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2014-10-11") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2015-12-03") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2016-07-01") },
        new ListItem() {DateTimeProperty = DateTime.Parse("2016-07-06") },
    };

    public IEnumerable<object> Element { get; }
}

以下是此分组ListView的实施代码:

ListView listView = new ListView();
listView.ItemTemplate = App.Current.Resources["ListViewTemplate"] as Windows.UI.Xaml.DataTemplate;
var gs = new GroupStyle();
gs.HeaderTemplate = App.Current.Resources["ListViewGroupHeaderTemplate"] as Windows.UI.Xaml.DataTemplate;
listView.GroupStyle.Add(gs);

CollectionViewSource cvs = new CollectionViewSource();
cvs.IsSourceGrouped = true;
cvs.Source = new SourceListView().Element;
if (listView.ItemsSource == null)
    listView.ItemsSource = cvs.View;
rootGrid.Children.Add(listView);

这是渲染图像:

enter image description here

答案 1 :(得分:0)

好的,最后经过一天半的努力解决这个问题,我找到了解决方案。如果有一天某人遇到与我相同的问题,我会在这里发布。实际上这是一个非常奇怪的问题,我不知道这是一个错误,未实现的功能还是什么......

解决方案:

在您的UWP自定义渲染器中,您需要执行以下操作:

 protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ListView> e)
    {
        base.OnElementChanged(e);

        if (e.NewElement != null)
        {
            e.NewElement.GroupHeaderTemplate = new Xamarin.Forms.DataTemplate(() =>
            {
                var label = new Label();

                label.SetBinding(Label.TextProperty, "Country");

                return new ViewCell { View = label };
            });
        }
    }

哪里&#34;国家&#34;是表示您的Group / Header的类的属性名称。