Xamarin Forms：根据字符串值控制ListView项图标与Switch的显隐

嘿，我来帮你搞定这个ListView项的显示控制问题！咱们直接上最实用的解决方案，两种方式任你选～

这种方式最直接，不用写额外的转换器类，直接在XAML里通过DataTrigger根据type的值来切换控件的可见性。

修改后的完整ListView代码结构如下：

<ListView ItemsSource="{Binding YourItemsSource}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <!-- 这里是你原有列表项的布局，我用水平StackLayout来包裹左右内容 -->
                <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
                    <!-- 左侧内容：替换成你自己的文本/图标等 -->
                    <Label Text="{Binding YourItemText}" VerticalOptions="Center"/>
                    
                    <!-- 右侧容器：放置More图标和Switch -->
                    <StackLayout Orientation="Horizontal" HorizontalOptions="EndAndExpand" VerticalOptions="Center">
                        <!-- More图标 -->
                        <Image Source="more_icon" VerticalOptions="Center">
                            <Image.Triggers>
                                <!-- 当type为"switch"时，隐藏More图标 -->
                                <DataTrigger TargetType="Image" Binding="{Binding type}" Value="switch">
                                    <Setter Property="IsVisible" Value="False"/>
                                </DataTrigger>
                            </Image.Triggers>
                        </Image>
                        
                        <!-- Switch组件 -->
                        <Switch VerticalOptions="Center">
                            <Switch.Triggers>
                                <!-- 当type为"more"时，隐藏Switch -->
                                <DataTrigger TargetType="Switch" Binding="{Binding type}" Value="more">
                                    <Setter Property="IsVisible" Value="False"/>
                                </DataTrigger>
                            </Switch.Triggers>
                        </Switch>
                    </StackLayout>
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

为啥这么写？ #

• 给More图标加了个触发规则：只要绑定的type等于"switch"，就把它设为不可见，只留Switch显示。
• 给Switch也加了个触发规则：当type是"more"时，就把Switch藏起来，只显示More图标。
• 完全贴合你要的逻辑，而且不用动后台代码，纯XAML就能搞定！

如果之后你要加更多type值（比如新增"none"之类的），用值转换器会更灵活。

第一步：写转换器类（后台代码） #

public class TypeToVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        // 把传入的type和参数对比，匹配就显示，不匹配就隐藏
        if (value is string itemType && parameter is string targetType)
        {
            return itemType == targetType;
        }
        return false;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        // 这里不需要反向转换，直接抛异常就行
        throw new NotImplementedException();
    }
}

第二步：在XAML里声明转换器 #

先在页面的Resources里注册这个转换器：

<ContentPage.Resources>
    <!-- 注意替换local为你的命名空间 -->
    <local:TypeToVisibilityConverter x:Key="TypeToVisibility"/>
</ContentPage.Resources>

第三步：绑定控件的IsVisible属性 #

<!-- More图标：只有当type为"more"时显示 -->
<Image Source="more_icon" 
       IsVisible="{Binding type, Converter={StaticResource TypeToVisibility}, ConverterParameter='more'}"
       VerticalOptions="Center"/>

<!-- Switch组件：只有当type为"switch"时显示 -->
<Switch IsVisible="{Binding type, Converter={StaticResource TypeToVisibility}, ConverterParameter='switch'}"
        VerticalOptions="Center"/>

这种方式扩展性更强，以后加新的type值，只要调整转换器逻辑或者绑定参数就行，不用改一堆触发器～

两种方案都能完美解决你的需求，选哪个就看你当前的场景啦！

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