影响控制按钮样式的弹出窗口中的文本框

Question

我正在尝试为弹出窗口中的列表构建文本过滤器，并在过滤器处于活动状态时通过更改打开弹出窗口的按钮的颜色来通知用户。

我正在使用 MVVM lite 设置和 XAML 样式表来引用所需的样式。到目前为止，我已经创建了弹出窗口和控制按钮，并且我已经能够将鼠标悬停在按钮上并使其工作。但是，当我尝试将数据触发器设置为弹出窗口中文本框的值时，它根本没有响应。

这是按钮和弹出窗口视图中的 XAML 代码：

 <StackPanel Orientation="Horizontal" Grid.Column="1"  HorizontalAlignment="Center" >
                <TextBlock HorizontalAlignment="Center" Text="Filter Popup" />
                <Button x:Name="PopUpControl" Tag="popup" Style="{StaticResource FilterButtonStyle}" Command="{Binding OpenPopupCommand}" IsEnabled="{Binding IsFilterEnabled, UpdateSourceTrigger=PropertyChanged}" Margin="2,1,2,1" VerticalAlignment="Top"/>
            </StackPanel>
            <Popup x:Name="textPopup" IsOpen="{Binding IsFilterPopupOpen, Mode=TwoWay}" PlacementTarget="{Binding ElementName=PopUpControl}" Placement="Bottom" Width="Auto" StaysOpen="False" Margin="2 2 2 2">
       <TextBox x:Name="TextValue" Grid.Column="0" BorderThickness="1" Style="{StaticResource WatermarkedTextBox}" Margin="2,4" VerticalAlignment="Center" Tag="Text Filter" Text="{Binding FilterSearch, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" 
                    <Button Grid.Column="4" Style="{StaticResource SearchIconStyle}" IsEnabled="{Binding FilterEnabled, Mode=TwoWay}" Command="{Binding ApplyFilterCommand}" Margin="19,6" Grid.ColumnSpan="2" />
                </Grid>
            </Popup>

这是按钮的样式：

 <Style x:Key="SortButtonStyle" TargetType="{x:Type Button}">
    <Setter Property="Width" Value="15"/>
    <Setter Property="Height" Value="15"/>
    <Setter Property="VerticalAlignment" Value="Bottom"/>
    <Setter Property="Margin" Value="4,0,4,0" />
    <Setter Property="Tag" Value="Default" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Name="border" 
                        Padding="4,2" 
                        CornerRadius="3" 
                        Background="{DynamicResource PaleBlue}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    <Border.OpacityMask>
                        <VisualBrush Visual="{StaticResource appbar_filter}" />
                    </Border.OpacityMask>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="border" Property="Background" Value="{DynamicResource ColumnHeaderFilterColor}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我想要发生的是，当元素“TextValue”在文本字段中有一个值时，“边框”的主要背景颜色会改变颜色。任何帮助将不胜感激。

Answer 1

您可以使用DataTrigger 绑定到FilterSearch 源属性并在返回空string 或null 时设置属性：

<ControlTemplate TargetType="Button">
    <Border Name="border" 
            Padding="4,2"
            CornerRadius="3" 
            Background="Green">
        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
        <Border.OpacityMask>
            <VisualBrush Visual="{StaticResource appbar_filter}" />
        </Border.OpacityMask>
    </Border>
    <ControlTemplate.Triggers>
        <DataTrigger Binding="{Binding FilterSearch}" Value="">
            <Setter TargetName="border" Property="Background" Value="{DynamicResource PaleBlue}" />
        </DataTrigger>
        <DataTrigger Binding="{Binding FilterSearch}" Value="{x:null}">
            <Setter TargetName="border" Property="Background" Value="{DynamicResource PaleBlue}" />
        </DataTrigger>
    </ControlTemplate.Triggers>
</ControlTemplate>