为我的组合框样式指定一个键名

时间:2018-03-21 15:54:48

标签: wpf xaml wpf-controls

我修改了一个组合框样式,风格如下所示。它工作正常,但是,该风格适用于我项目中的所有组合框。换句话说,当我从工具箱中拉出一个组合框时,它会自动设置样式。我想做的只是设计风格的某些组合框 - 不是全部。当然,我必须使用键名将样式应用于每个控件。我的问题是,如何修改样式,以便我可以通过键名“myComboBox”来引用它。谢谢你的帮助。

我的资源字典中的风格:

    <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition Width="10" />
        </Grid.ColumnDefinitions>
        <Border
                x:Name="Border" 
                Grid.ColumnSpan="2"
                CornerRadius="0"
                Background="Black" 
                BorderBrush="Black"
                BorderThickness="0" />
        <Border 
                Grid.Column="0"
                CornerRadius="0,0,0,0" 
                Margin="1" 
                Background="Black" 
                BorderBrush="Black"
                BorderThickness="0,0,0,0" />
        <Path 
              x:Name="Arrow"
              Grid.Column="1"     
              Fill="#404040"
              HorizontalAlignment="Center"
              VerticalAlignment="Center"
              Data="M 0 0 L 4 4 L 8 0 Z"/>
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="ToggleButton.IsMouseOver" Value="true">
            <Setter TargetName="Border" Property="Background" Value="#808080" />
        </Trigger>
        <Trigger Property="ToggleButton.IsChecked" Value="true">
            <Setter TargetName="Border" Property="Background" Value="#E0E0E0" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="Border" Property="Background" Value="#EEEEEE" />
            <Setter TargetName="Border" Property="BorderBrush" Value="#AAAAAA" />
            <Setter Property="Foreground" Value="#888888"/>
            <Setter TargetName="Arrow" Property="Fill" Value="#888888" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

<ControlTemplate x:Key="ComboBoxTextBox" TargetType="{x:Type TextBox}">
    <Border x:Name="PART_ContentHost" Focusable="False" Background="{TemplateBinding Background}" />
</ControlTemplate>

<Style x:Key="{x:Type ComboBox}" TargetType="{x:Type ComboBox}">
    <Setter Property="SnapsToDevicePixels" Value="true"/>
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
    <Setter Property="MinWidth" Value="0"/>
    <Setter Property="MinHeight" Value="20"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBox}">
                <Grid>
                    <ToggleButton 
                            Name="ToggleButton" 
                            Template="{StaticResource ComboBoxToggleButton}" 
                            Grid.Column="2" 
                            Focusable="false"
                            IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                            ClickMode="Press">
                    </ToggleButton>
                    <ContentPresenter
                            Name="ContentSite"
                            IsHitTestVisible="False" 
                            Content="{TemplateBinding SelectionBoxItem}"
                            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                            ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                            Margin="1,0,11,0" 
                            VerticalAlignment="Stretch"
                            HorizontalAlignment="Left" />
                    <TextBox x:Name="PART_EditableTextBox"
                            Style="{x:Null}" 
                            Template="{StaticResource ComboBoxTextBox}" 
                            HorizontalAlignment="Left" 
                            VerticalAlignment="Center" 
                            Margin="1,0,11,0"
                            Focusable="True" 
                            Background="Transparent"
                            Visibility="Hidden"
                            IsReadOnly="{TemplateBinding IsReadOnly}"/>
                    <Popup 
                            Name="Popup"
                            Placement="Bottom"
                            IsOpen="{TemplateBinding IsDropDownOpen}"
                            AllowsTransparency="True" 
                            Focusable="False"
                            PopupAnimation="Slide">
                        <Grid 
                                  Name="DropDown"
                                  SnapsToDevicePixels="True"                
                                  MinWidth="{TemplateBinding ActualWidth}"
                                  MaxHeight="{TemplateBinding MaxDropDownHeight}">
                            <Border 
                                    x:Name="DropDownBorder"
                                    Background="Black"
                                    BorderThickness="1"
                                    BorderBrush="#888888"/>
                            <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
                                <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="HasItems" Value="false">
                        <Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="#888888"/>
                    </Trigger>
                    <Trigger Property="IsGrouping" Value="true">
                        <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                    </Trigger>
                    <Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
                        <Setter TargetName="DropDownBorder" Property="CornerRadius" Value="0"/>
                        <Setter TargetName="DropDownBorder" Property="Margin" Value="0,0,0,0"/>
                    </Trigger>
                    <Trigger Property="IsEditable"
                                Value="true">
                        <Setter Property="IsTabStop" Value="false"/>
                        <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/>
                        <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
    </Style.Triggers>
</Style>

<!-- SimpleStyles: ComboBoxItem -->

<Style x:Key="{x:Type ComboBoxItem}" TargetType="{x:Type ComboBoxItem}">
    <Setter Property="SnapsToDevicePixels" Value="true"/>
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                <Border Name="Border" Padding="0" SnapsToDevicePixels="true">
                    <ContentPresenter />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsHighlighted" Value="true">
                        <Setter TargetName="Border" Property="Background" Value="#888888"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="#888888"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

3 个答案:

答案 0 :(得分:2)

如果您指定x:Key,则会创建implicit style。你想要的是一种明确的风格。 你需要做的是改变这一行

<Style x:Key="{x:Type ComboBox}" TargetType="{x:Type ComboBox}">

<Style x:Key="myComboBoxStyle" TargetType="{x:Type ComboBox}">

此外,您在ComboBoxItem上也有一个隐式样式。你会想要改变这个:     

是:

<Style x:Key="myComboBoxItem" TargetType="{x:Type ComboBoxItem}">

最后,您需要将ComboBoxItem样式设置为ComboBox的项样式。 将其添加到ComboBox样式。

<Setter Property="ItemContainerStyle" Value="{StaticResource myComboBoxItem}"/>

答案 1 :(得分:0)

Style提供唯一的x:Key

<Style x:Key="myComboBoxStyle" TargetType="{x:Type ComboBoxItem}">

然后,您可以使用ComboBox标记扩展名将其应用于StaticResource

<ComboBox Style="{StaticResource myComboBoxStyle}">        
</ComboBox>

答案 2 :(得分:0)

您的问题是您正在使用的密钥。 这个:     x:Key =&#34; {x:Type ComboBox}&#34; 将其更改为其他不涉及任何花括号或x:type。

的字符串