Xamarin.Forms CollectionView分组：ItemTemplate绑定GroupName及条件显示

1. ItemTemplate中绑定GroupName不显示的解决方法 #

原XAML中直接绑定GroupName无效，是因为ItemTemplate的BindingContext是单个Animal实例，而GroupName属于AnimalGroup类，因此需要通过RelativeSource向上查找所属分组的BindingContext（即AnimalGroup）来获取该属性。

修改ItemTemplate中的GroupName标签：

<Label Grid.Row="0" Grid.Column="2" 
       Text="{Binding BindingContext.GroupName, 
              RelativeSource={RelativeSource Mode=FindAncestor, 
                                             AncestorType={x:Type VisualElement}, 
                                             AncestorLevel=2}}" />

• AncestorLevel=2：跳过ItemTemplate内部的Grid容器，定位到分组的容器元素，其BindingContext为AnimalGroup。

2. 针对特定GroupName隐藏Location标签的实现 #

通过DataTrigger绑定分组的GroupName，当值为"Cats"时设置Location标签的IsVisible为False，完全在XAML中实现：

修改Location标签的代码：

<Label Grid.Row="0" Grid.Column="1" Text="{Binding Location}">
    <Label.Triggers>
        <DataTrigger TargetType="Label" 
                     Binding="{Binding BindingContext.GroupName, 
                                       RelativeSource={RelativeSource Mode=FindAncestor, 
                                                                      AncestorType={x:Type VisualElement}, 
                                                                      AncestorLevel=2}}"
                     Value="Cats">
            <Setter Property="IsVisible" Value="False" />
        </DataTrigger>
    </Label.Triggers>
</Label>

完整修改后的XAML代码 #

<CollectionView x:Name="collectionView" IsGrouped="True">
    <CollectionView.GroupHeaderTemplate>
        <DataTemplate>
            <Label Text="{Binding GroupName}" FontAttributes="Bold" />
        </DataTemplate>
    </CollectionView.GroupHeaderTemplate>

    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid Padding="0,10,0,0">
                <Label Grid.Row="0" Text="{Binding Name}"/>
                <Label Grid.Row="0" Grid.Column="1"  Text="{Binding Location}">
                    <Label.Triggers>
                        <DataTrigger TargetType="Label" 
                                     Binding="{Binding BindingContext.GroupName, 
                                                       RelativeSource={RelativeSource Mode=FindAncestor, 
                                                                                      AncestorType={x:Type VisualElement}, 
                                                                                      AncestorLevel=2}}"
                                     Value="Cats">
                            <Setter Property="IsVisible" Value="False" />
                        </DataTrigger>
                    </Label.Triggers>
                </Label>
                <Label Grid.Row="0" Grid.Column="2" 
                       Text="{Binding BindingContext.GroupName, 
                              RelativeSource={RelativeSource Mode=FindAncestor, 
                                                             AncestorType={x:Type VisualElement}, 
                                                             AncestorLevel=2}}" />
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

测试提示 #

若要验证隐藏效果，需在后台代码中添加"Cats"分组：

Animals.Add(new AnimalGroup("Cats", new List<Animal>
{
    new Animal
    {
        Name = "Domestic Cat",
        Location = "Worldwide",
    },
    new Animal
    {
        Name = "Tiger",
        Location = "Asia",
    },
}));

内容的提问来源于stack exchange，提问作者Noah