Xamarin Forms中CollectionView绑定DataType时VisualStateManager失效问题

异常原因 #

1. 这是Xamarin Forms开启编译绑定后存在的已知兼容性问题：当你为DataTemplate指定x:DataType启用编译绑定时，DataTemplate根元素的IsEnabled属性变更通知不会被CollectionView的内置选中逻辑捕获，导致选中逻辑忽略元素禁用状态，仍然允许点击选中。
2. VisualStateManager的Disabled状态无法触发，是因为编译绑定模式下，布局元素的IsEnabled属性变更不会自动推送状态变更通知给VSM，VSM无法感知状态变化，也就不会触发对应样式。

解决方案 #

1. 解决禁用条目可被选中问题 #

• 方案A（视图层处理，无侵入）：自定义CollectionView Behavior，监听SelectionChanged事件，过滤掉IsEnabled = false的选中项：

public class CollectionViewDisabledSelectionBehavior : Behavior<CollectionView>
{
    protected override void OnAttachedTo(CollectionView bindable)
    {
        base.OnAttachedTo(bindable);
        bindable.SelectionChanged += OnSelectionChanged;
    }

    protected override void OnDetachingFrom(CollectionView bindable)
    {
        base.OnDetachingFrom(bindable);
        bindable.SelectionChanged -= OnSelectionChanged;
    }

    private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        if (sender is not CollectionView cv) return;
        if (e.CurrentSelection.FirstOrDefault() is SizeOption item && !item.IsEnabled)
        {
            cv.SelectedItem = e.PreviousSelection.FirstOrDefault();
        }
    }
}

完成后直接在CollectionView节点中引用该Behavior即可。

• 方案B（业务层处理，实现简单）：在你的SelectionChangedCommand执行逻辑最开头先判断选中的SelectedSizeOption的IsEnabled属性，如果为false直接终止逻辑，并且将SelectedSizeOption重置为之前的有效值。

2. 解决禁用样式不生效问题 #

优先使用DataTrigger实现，兼容性比VSM更好，开启编译绑定后也能稳定触发，示例代码如下：

<Label FontSize="14"
       HorizontalOptions="StartAndExpand"
       IsEnabled="{Binding IsEnabled}"
       Padding="10, 0"
       Text="{Binding Text}"
       Style="{StaticResource MediumFontFamily}"
       VerticalTextAlignment="Center"
       x:Name="RadioButtonLabel">
    <Label.Triggers>
        <DataTrigger TargetType="Label" Binding="{Binding IsEnabled}" Value="False">
            <Setter Property="TextColor" Value="Gray" />
            <Setter Property="FontAttributes" Value="Italic" />
        </DataTrigger>
    </Label.Triggers>
</Label>

<Image HeightRequest="20"
       IsEnabled="{Binding IsEnabled}"
       WidthRequest="20"
       x:Name="RadioButtonImage">
    <Image.Triggers>
        <DataTrigger TargetType="Image" Binding="{Binding IsEnabled}" Value="False">
            <Setter Property="Source" Value="disabled_radio.png" />
        </DataTrigger>
    </Image.Triggers>
</Image>

如果你一定要使用VisualStateManager实现，需要手动触发状态刷新：在DataTemplate的根StackLayout绑定PropertyChanged事件，在事件中手动调用VisualStateManager.GoToState切换状态即可。

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