2015-01-20 4 views
1

Что я хочу сделать, установлен BorderBrush редактируемого ComboBox. Я использую слегка измененные шаблоны WPF по умолчанию. Они структурированы, как показано ниже:Установите цвет рамки редактируемого ComboBox на фокус

<ControlTemplate x:Key="ComboBoxEditableTemplate" TargetType="{x:Type ComboBox}"> 
    ... 
    <Grid x:Name="templateRoot" ...> 
     ... 
     <ToggleButton x:Name="toggleButton" ... /> 
     <Border x:Name="border" ...> 
      <TextBox x:Name="PART_EditableTextBox" ... /> 
      <!-- textbox with IsFocused property which should be focus trigger --> 
     </Border> 
    </Grid> 
    ... 
</ControlTemplate> 

ToggleButton шаблон:

<ControlTemplate TargetType="{x:Type ToggleButton}"> 
    <Border x:Name="templateRoot" ...> <!-- first border brush I want to set on focus --> 
     <Border x:Name="innerBorder" ...> <!-- second border brush I want to set on focus --> 
      <Border x:Name="splitBorder" ...> 
       <Path x:Name="arrow" ... /> 
      </Border> 
     </Border> 
    </Border> 
</ControlTemplate> 

И теперь, что должно произойти.

Когда PART_EditableTextBox.IsFocused равно true затем установить templateRoot.BorderBrush и innerBorder.BorderBrush на другой цвет (например, [удален: красный] красный и синий).

Это было бы очень просто, если бы было установлено только одно BorderBrush, так как я мог бы использовать TemplateBinding, чтобы связать это свойство с номером ToggleButton.

Для меня проблема заключается в вложенных шаблонах. Я не знаю, как обращаться к другому шаблону.

ответ

0

Наконец-то я нашел решение самостоятельно. Я продлил класс ToggleButton, поэтому он содержит дополнительные InnerBorderBrush.

Так что теперь, я могу установить как наружную и внутреннюю границу с Setter:

<Trigger SourceName="PART_EditableTextBox" Property="IsFocused" Value="True"> 
    <Setter Property="BorderBrush" Value="Red" TargetName="toggleButton"> 
    <Setter Property="InnerBorderBrush" Value="Blue" TargetName="toggleButton"></Setter> 
</Trigger> 

Это, как я продлил ToggleButton класс:

public class ComboBoxToggleButton : ToggleButton 
{ 
    // Dependency Property 
    public static readonly DependencyProperty InnerBorderBrushProperty = 
    DependencyProperty.Register("InnerBorderBrush", typeof(Brush), 
     typeof(ComboBoxToggleButton), new FrameworkPropertyMetadata(Brushes.Transparent)); 

    // .NET Property wrapper 
    public Brush InnerBorderBrush 
    { 
     get 
     { 
      return (Brush)GetValue(InnerBorderBrushProperty); 
     } 
     set 
     { 
      SetValue(InnerBorderBrushProperty, value); 
     } 
    } 
} 
0

Триггер может позаботиться об этом за вас

<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> 
2

Вы можете использовать TemplateBinding в частях ToggleButton и связать их с тем же свойством. а затем изменить его внутри триггера:

<ControlTemplate TargetType="{x:Type ToggleButton}"> 
         <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}" > 
          <!-- first border brush I want to set on focus --> 
          <Border x:Name="innerBorder" BorderBrush="{TemplateBinding BorderBrush}"> 
           <!-- second border brush I want to set on focus --> 
           <Border x:Name="splitBorder" > 
            <Path x:Name="arrow" /> 
           </Border> 
          </Border> 
         </Border> 
        </ControlTemplate> 

, а затем в вашем триггером внутри комбобоксе Установите BorderBrush в ToggleButton:

<ControlTemplate TargetType="{x:Type ComboBox}"> 
         <Grid x:Name="templateRoot" > 
          <ToggleButton x:Name="toggleButton" /> 
          <Border x:Name="border" > 
           <TextBox x:Name="PART_EditableTextBox" /> 
           <!-- textbox with IsFocused property which should be focus trigger --> 
          </Border> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger SourceName="PART_EditableTextBox" Property="IsFocused" Value="True"> 
           <Setter Property="BorderBrush" Value="Red" TargetName="toggleButton"></Setter> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 

UPDATE Вы можете изменить ControlTemplate в ToggleButton к выглядят так:

<ControlTemplate TargetType="{x:Type ToggleButton}"> 
        <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}" > 
         <!-- first border brush I want to set on focus --> 
         <Border x:Name="innerBorder" BorderBrush="{Binding ElementName=templateRoot, Path=BorderBrush, Converter={SomeColorConverter}}"> 
          <!-- second border brush I want to set on focus --> 
          <Border x:Name="splitBorder" > 
           <Path x:Name="arrow" /> 
          </Border> 
         </Border> 
        </Border> 
       </ControlTemplate> 

Таким образом, вы можете инициировать привязку, как только BorderBrush является cha через триггер и использовать конвертер для установки другого цвета.

+0

Почти, но мне нужно установить разные цвета для 'innerBorder' и' templateRoot' – stil

+0

@stil Я обновил свой ответ –

Смежные вопросы