如何基于ViewModel布尔属性条件设置WPF Image的Loaded触发器

要实现基于ViewModel布尔属性控制Image的Loaded触发动画，你需要利用MultiDataTrigger结合Style来组合条件（控件加载完成+属性为true）——因为元素的直接Triggers集合仅支持EventTrigger，数据绑定条件需要放在Style的Triggers中。具体实现如下：

完整XAML代码 #

<Image Source="{DynamicResource ico_spinnerDrawingImage}" Width="100">
    <Image.Style>
        <Style TargetType="Image">
            <Style.Triggers>
                <MultiDataTrigger>
                    <!-- 组合两个触发条件：控件已加载 + ViewModel布尔属性为true -->
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding IsLoaded, RelativeSource={RelativeSource Self}}" Value="True"/>
                        <Condition Binding="{Binding IsSpinEnabled}" Value="True"/>
                    </MultiDataTrigger.Conditions>
                    <!-- 满足条件时启动旋转动画 -->
                    <MultiDataTrigger.EnterActions>
                        <BeginStoryboard x:Name="SpinStoryboard">
                            <Storyboard>
                                <DoubleAnimation From="0" To="360" Duration="0:0:1"
                                                Storyboard.TargetProperty="Source.Drawing.Transform.Angle"
                                                RepeatBehavior="Forever"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </MultiDataTrigger.EnterActions>
                    <!-- 可选：当属性变为false时停止动画 -->
                    <MultiDataTrigger.ExitActions>
                        <StopStoryboard BeginStoryboardName="SpinStoryboard"/>
                    </MultiDataTrigger.ExitActions>
                </MultiDataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

关键说明 #

1. 请确保ViewModel中的布尔属性（示例中命名为IsSpinEnabled）已实现INotifyPropertyChanged，且Image的DataContext已正确绑定到ViewModel。
2. 你的ico_spinnerDrawingImage资源必须包含RotateTransform，否则动画无法生效，示例资源定义参考：

<DrawingImage x:Key="ico_spinnerDrawingImage">
    <DrawingImage.Drawing>
        <DrawingGroup>
            <DrawingGroup.Transform>
                <RotateTransform Angle="0"/>
            </DrawingGroup.Transform>
            <!-- 这里放置你的旋转图标绘制内容 -->
        </DrawingGroup>
    </DrawingImage.Drawing>
</DrawingImage>

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