如何根据列表项DriveItem.Publication.Level值动态切换XAML显示图标

实现方案 #

无需额外新增业务属性，有两种成熟的方案可以直接实现XAML侧的条件判断逻辑：

方案1：IValueConverter（你最终采用的方案，可复用性更高） #

首先补全IconValueConverter的实现代码：

using System;
using Xamarin.Forms;

namespace GraphTutorial.Models
{
    public class IconValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is string level)
            {
                // Segoe MDL2 Assets字体中 锁定图标编码为E701，解锁图标编码为E702
                return level switch
                {
                    "checkout" => "\uE701",
                    "published" => "\uE702",
                    _ => string.Empty
                };
            }
            return string.Empty;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
}

之后在XAML页面的资源节点注册转换器：

<ContentPage.Resources>
    <models:IconValueConverter x:Key="IconValueConverter" xmlns:models="clr-namespace:GraphTutorial.Models"/>
</ContentPage.Resources>

即可直接使用你最终编写的绑定代码正常渲染图标：

<Label Grid.Column="1" 
       Text="{Binding Path=DriveItem.Publication.Level,Converter={StaticResource IconValueConverter}}" 
       FontFamily="Segoe MDL2 Assets" />

方案2：DataTrigger（修复你之前的报错问题） #

你之前使用DataTrigger报错是因为Xamarin.Forms的Binding语法不支持RelativeSource={RelativeSource Self}写法，直接绑定数据源的Level字段即可，无需绕一层Tag属性，简化后的实现如下：

<ListView.Resources>
    <Style x:Key="PublicationStatus" TargetType="Label">
        <Setter Property="FontFamily" Value="Segoe MDL2 Assets" />
        <Style.Triggers>
            <DataTrigger Binding="{Binding DriveItem.Publication.Level}" Value="checkout">
                <Setter Property="Text" Value="\uE701"/>
            </DataTrigger>
            <DataTrigger Binding="{Binding DriveItem.Publication.Level}" Value="published">
                <Setter Property="Text" Value="\uE702"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</ListView.Resources>

调用时直接关联Style即可：

<Label Grid.Column="1" Style="{StaticResource PublicationStatus}" />

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