当文本框焦点时更改容器的背景颜色

Question

我有一个简单的用户控件，使用TextBox。我想在TextBox获得焦点时更改用户控件的颜色。这是我有：

<UserControl x:Class="OutLookContactList.ContactSearchControl" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
x:Name="root" MinHeight="30" Loaded="UserControl_Loaded"> 

<UserControl.Resources> 

    <Style x:Key="searchTextBoxStyle" TargetType="{x:Type TextBox}"> 
     <Style.Triggers> 
      <Trigger Property="IsFocused" Value="true"> 
       <Setter TargetName="root" Property="Background" Value="{StaticResource OnMouseOverColor}" /> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
</UserControl.Resources> 

但我得到了errot“TargetName属性不能在风格设置器上设置”。如何在文本框获得焦点时设置用户控件的背景颜色？ 多谢

Answer 1

它是否会将UserControl的内容包装到Border对象中？如果是这样，你可以简单的样式像Border如此：

<UserControl x:Class="Sample2.ContactSearchControl" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Height="75" Width="300"> 
    <Border> 
     <Border.Style> 
      <Style TargetType="Border"> 
       <Setter Property="Background" Value="White" /> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding IsFocused, ElementName=txtSearch}" Value="true"> 
         <Setter Property="Background" Value="Black" /> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </Border.Style> 
     <StackPanel> 
      <TextBox x:Name="txtSearch" Text="Search" /> 
      <TextBox Text="Other" /> 
     </StackPanel> 
    </Border> 
</UserControl> 

更新：（回答Sheraz”问题）

我不知道为什么ElementName不为UserControl中访问儿童工作。这可能与构建可视化树的方式有关。

至于Trigger VS DataTrigger：Trigger为依赖属性和DataTrigger为数据绑定属性（数据或其它控制）。由于您试图对Border进行样式设计，因此将DataTrigger放置在那里并让它看TextBox比让TextBox更改Border的外观更有意义。

据我所知，Setter的TargetName属性只适用于DataTemplate或ControlTemplate。 （Info from Dr. WPF in this forum post）

Answer 2

如果你改变了你需要删除TargetName属性中的文本框的背景：

<Style x:Key="searchTextBoxStyle" TargetType="{x:Type TextBox}"> 
    <Style.Triggers> 
     <Trigger Property="IsFocused" Value="true"> 
      <Setter Property="Background" Value="{StaticResource OnMouseOverColor}" /> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

，并更改希望将TextBox这种风格是：

<TextBox Style="{StaticResource searchTextBoxStyle}" .... /> 

但是，由于您想要更改父级用户控件的值，因此不会给您想要的值。

你当然可以在后面的代码中添加一个GotFocus事件处理程序，并将代码更改为背景颜色。

Answer 3

下面是一些XAML，在Kaxaml工作：

<Page 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 

    <Page.Style> 
    <Style TargetType="Page"> 
     <Setter Property="Background" Value="#CCCCD0" /> 
     <Style.Triggers> 
     <DataTrigger Binding="{Binding ElementName=txtSearch, Path=IsFocused}" 
        Value="true"> 
      <Setter Property="Background" Value="Black" /> 
     </DataTrigger> 
     </Style.Triggers> 
    </Style> 
    </Page.Style> 

    <TextBox x:Name="txtSearch" Width="100" 
      HorizontalAlignment="Center" VerticalAlignment="Center" /> 

</Page> 

你会改变Page对象与你UserControl。我发现在编码起始号为UserControl的VS之前，在诸如Kaxaml之类的快速原型开发工具中测试这些事情要容易得多。

请注意，您必须通过属性设置器而不是通过Page本身的属性来设置默认颜色（本例中为#CCCCD0）。这是因为该属性会覆盖由触发器设置的值（因为它是一个样式触发器），所以即使触发器会触发，它总是会被本地属性规范所取代，这意味着它不会改变。我只指出这一点，因为这是一个相当普遍的问题。