Question

我想根据ViewModel属性设置一个按钮的样式，该属性不属于该按钮。

所以我创建了以下

按钮XAML：

<Button Content="DisableButton" 
            Height="27" 
            HorizontalAlignment="Left" 
            Margin="95,197,0,0" 
            VerticalAlignment="Top" 
            Width="120" 
            Style="{DynamicResource ButtonOffline}"
            Click="ButtonDisableClick">
    </Button>

样式（Trigger with Property不起作用。也尝试过DataTrigger）

<Grid.Resources>
        <Style x:Key="ButtonOffline" TargetType="{x:Type Button}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsOnline}" Value="false">
                    <Setter Property="Background" Value="#FF808080"></Setter>
                    <Setter Property="BorderBrush" Value="Red"></Setter>
                    <Setter Property="BorderThickness" Value="5"></Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding IsOnline}" Value="true">
                    <Setter Property="Background" Value="#FF990000"></Setter>
                    <Setter Property="BorderBrush" Value="Blue"></Setter>
                    <Setter Property="BorderThickness" Value="2"></Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Grid.Resources>

属性

private bool isOnline;
        public bool IsOnline
        {
            get
            {
                return isOnline;
            }
            set
            {
                isOnline = value;
                NotifyPropertyChanged("IsOnline");
            }
        }

我的点击处理程序

private void ButtonDisableClick(object sender, RoutedEventArgs e)
        {
            var isOnline = (this.DataContext as ComboBoxSampleViewModel).IsOnline;
            (this.DataContext as ComboBoxSampleViewModel).IsOnline = !isOnline;
        }

现在，如果我点击按钮，就会开始像故事板一样按钮开始像动画一样改变颜色。

代码有什么问题？

更新在一个小样本中重现，该样本只有这里发布的按钮功能。没有（除了基本的INotifyPropertyChanged实现）否则这里没有发布。

Answer 1

您必须将Focusable属性设置为false，这将停止按钮闪烁。

<Button Content="DisableButton" 
        Focusable="False"
        Height="27"             
        HorizontalAlignment="Left" 
        Margin="95,197,0,0" 
        VerticalAlignment="Top" 
        Width="120" 
        Style="{DynamicResource ButtonOffline}"
        Click="ButtonDisableClick">
    </Button>

这是因为默认模板中必须有一些触发器正在更改背景属性。

第二个解决方案是创建自己的模板按钮。

<Grid.Resources>
    <Style x:Key="ButtonOffline" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid x:Name="Grid">
                        <Border CornerRadius="2" x:Name="Border" Background="{TemplateBinding Background}" 
                        BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
                        Padding="{TemplateBinding Padding}"/>
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                        Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                        RecognizesAccessKey="True"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <DataTrigger Binding="{Binding IsOnline}" Value="False">
                <Setter Property="Background" Value="#FF808080"></Setter>
                <Setter Property="BorderBrush" Value="Red"></Setter>
                <Setter Property="BorderThickness" Value="5"></Setter>
            </DataTrigger>
            <DataTrigger Binding="{Binding IsOnline}" Value="True">
                <Setter Property="Background" Value="#FF990000"></Setter>
                <Setter Property="BorderBrush" Value="Blue"></Setter>
                <Setter Property="BorderThickness" Value="2"></Setter>
            </DataTrigger>              
        </Style.Triggers>
    </Style>
</Grid.Resources>

奇怪的按钮样式行为，改变故事板等颜色

1 个答案: