根据模型值动态设置Style属性

Question

类

Question

代表一个问题及其答案。我的应用程序呈现

Question

对象的 ObservableCollection。每个

Question

都呈现为包含 TextBlock 和 TextBox 的 StackPanel。问题是使用 ItemsControl 呈现的，我使用 StaticResource 键设置问题 StackPanel 的样式

IncorrectQuestion

（在 UserControl.Resources 中定义）。

在 UserControl.Resources 部分中，我定义了一个键

CorrectQuestion

，当用户正确回答时，我需要将其应用于问题的 StackPanel。如何在 ViewModel 类的约束内动态更改 StackPanel 的样式（我不想将样式选择代码放在视图中）？

Question

类有一个

IsCorrect

属性，该属性在回答更正时设置。我想将

IsCorrect

值反映为样式选择。

Answer 1

使用值转换器是一个解决方案。

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.Resources>
        <local:BoolToStyleConverter x:Key="Correctness">
            <local:BoolToStyleConverter.FalseValue>
                <Style TargetType="TextBox">
                    <Setter Property="Background" Value="Salmon" />
                </Style>
            </local:BoolToStyleConverter.FalseValue>
            <local:BoolToStyleConverter.TrueValue>
                <Style TargetType="TextBox">
                    <Setter Property="Background" Value="AliceBlue" />
                </Style>
            </local:BoolToStyleConverter.TrueValue>
        </local:BoolToStyleConverter>
    </Grid.Resources>
    <ItemsControl ItemsSource="{Binding}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding Question}" />
                    <TextBox x:Name="Answer" Text="{Binding Answer, Mode=TwoWay}"
                       Style="{Binding IsCorrect, Converter={StaticResource Correctness}}" />
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>        
</Grid>

您可以找到

BoolToStyleConverter

的基础是基于这篇博客文章。 创建为：-

public class BoolToStyleConverter : BoolToValueConverter<Style> { }