wpf组合框样式

时间:2012-04-03 17:54:01

标签: wpf combobox styles

任何人都可以通过查看此样式来判断是否会将其应用于弹出与屏幕一样宽的组合框,除非您给它一个明确的宽度?

<Style x:Key="ThemedComboBox" TargetType="{x:Type ComboBox}">
    <Setter Property="Padding" Value="6,2,25,2"/>
    <Setter Property="Background" Value="#FF1F3B53"/>
    <Setter Property="Foreground" Value="#FFFFFFFF"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="BorderBrush">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFA3AEB9" Offset="0"/>
                <GradientStop Color="#FF8399A9" Offset="0.375"/>
                <GradientStop Color="#FF718597" Offset="0.375"/>
                <GradientStop Color="#FF617584" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBox}">
                <Grid>
                    <Grid.Resources>
                        <Style TargetType="ToggleButton" x:Name="comboToggleStyle">
                            <Setter Property="Foreground" Value="#FF333333"/>
                            <Setter Property="Background" Value="#FF1F3B53"/>
                            <Setter Property="BorderBrush">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FFA3AEB9" Offset="0"/>
                                        <GradientStop Color="#FF8399A9" Offset="0.375"/>
                                        <GradientStop Color="#FF718597" Offset="0.375"/>
                                        <GradientStop Color="#FF617584" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="BorderThickness" Value="1"/>
                            <Setter Property="Padding" Value="3"/>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="ToggleButton">
                                        <Grid>
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualStateGroup.Transitions>
                                                        <VisualTransition GeneratedDuration="00:00:00.1" To="MouseOver"/>
                                                        <VisualTransition GeneratedDuration="00:00:00.1" To="Pressed"/>
                                                    </VisualStateGroup.Transitions>
                                                    <VisualState x:Name="Normal"/>
                                                    <VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="MouseOverState" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Pressed">
                                                        <Storyboard>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="PressedState" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="DisabledState" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="gloss" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="CheckStates">
                                                    <VisualState x:Name="Checked">
                                                        <Storyboard>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="PressedState" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Unchecked"/>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="FocusStates">
                                                    <VisualState x:Name="Focused">
                                                        <Storyboard>
                                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="MouseOverState" Storyboard.TargetProperty="(UIElement.Opacity)">
                                                                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                                            </DoubleAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="Unfocused"/>
                                                </VisualStateGroup>
                                            </VisualStateManager.VisualStateGroups>
                                            <Grid HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Width="Auto" Height="Auto" x:Name="NormalState">
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_BackgroundGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Stroke="{StaticResource GlossyBlack_StrokeGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_HighlightGradient}"/>
                                            </Grid>
                                            <Grid HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Width="Auto" Height="Auto" x:Name="MouseOverState" Opacity="0">
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_BackgroundGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Stroke="{StaticResource GlossyBlack_StrokeGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_MouseOverBackgroundGradient}"/>
                                            </Grid>
                                            <Grid HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Width="Auto" Height="Auto" x:Name="PressedState" Opacity="0">
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_PressedBackgroundGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Stroke="{StaticResource GlossyBlack_StrokeGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_PressedHighlightGradient}"/>
                                            </Grid>
                                            <Grid HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Width="Auto" Height="Auto" x:Name="DisabledState" Opacity="0">
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Fill="{StaticResource GlossyBlack_DisabledBackgroundGradient}"/>
                                                <Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="0" RadiusY="0" Stroke="{StaticResource GlossyBlack_StrokeGradient}"/>
                                            </Grid>
                                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" x:Name="contentPresenter" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                                            <Path Height="Auto" HorizontalAlignment="Stretch" Margin="0,0,0,6" VerticalAlignment="Stretch" Stretch="Fill" Data="M100,12.903966 C59.117226,15.115555 23.108757,29.203354 -1.2437163E-14,60 L-3.2684966E-13,0 C12,-2.8610229E-06 100,0 100,0" x:Name="gloss" Fill="{StaticResource GlossyBlack_GlossGradient}"/>
                                        </Grid>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </Grid.Resources>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition GeneratedDuration="00:00:00.1"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)">
                                        <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused">
                                <Storyboard/>
                            </VisualState>
                            <VisualState x:Name="Unfocused"/>
                            <VisualState x:Name="FocusedDropDown">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Duration="00:00:00" Storyboard.TargetName="PopupBorder" Storyboard.TargetProperty="(UIElement.Visibility)">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="ContentPresenterBorder">
                        <Grid>
                            <ToggleButton BorderThickness="{TemplateBinding BorderThickness}" HorizontalContentAlignment="Right" HorizontalAlignment="Stretch" Margin="-1" x:Name="DropDownToggle" VerticalAlignment="Stretch" Foreground="{StaticResource GlossyBlack_GreyStateBackground}" BorderBrush="{StaticResource GlossyBlack_StrokeGradient}" Background="{StaticResource GlossyBlack_BackgroundGradient}" IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press">
                                <Path Height="4" HorizontalAlignment="Right" Margin="0,0,6,0" x:Name="BtnArrow" Width="8" Stretch="Uniform" Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z " Fill="{StaticResource GlossyBlack_GreyStateBackground}"/>
                            </ToggleButton>
                            <ContentPresenter HorizontalAlignment="Left" Margin="3,3,23,3" x:Name="ContentSite" VerticalAlignment="Center" Content="{TemplateBinding SelectionBoxItem}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" IsHitTestVisible="False"/>
                        </Grid>
                    </Border>
                    <Rectangle x:Name="DisabledVisualElement" IsHitTestVisible="false" Opacity="0" Fill="#A5000000" RadiusX="3" RadiusY="3"/>
                    <Popup IsOpen="{TemplateBinding IsDropDownOpen}" Placement="Bottom" x:Name="Popup" Focusable="False" AllowsTransparency="True" PopupAnimation="Slide">
                        <Grid MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{TemplateBinding ActualWidth}" x:Name="DropDown" SnapsToDevicePixels="True">
                            <Border Height="Auto" HorizontalAlignment="Stretch" x:Name="PopupBorder" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0,0,0,0" Background="{StaticResource GlossyBlack_PopupBackgroundGradient}" BorderBrush="{StaticResource GlossyBlack_StrokeGradient}">
                                <ScrollViewer BorderThickness="0" Padding="1" Foreground="{StaticResource GlossyBlack_Selected}" BorderBrush="{x:Null}" SnapsToDevicePixels="True" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
                                    <ItemsPresenter/>
                                </ScrollViewer>
                            </Border>
                        </Grid>
                    </Popup>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

2 个答案:

答案 0 :(得分:1)

我尝试了一些事情,问题是路径。

 <Path Height="Auto" HorizontalAlignment="Stretch" Margin="0,0,0,6" VerticalAlignment="Stretch" Stretch="Fill" Data="M100,12.903966 C59.117226,15.115555 23.108757,29.203354 -1.2437163E-14,60 L-3.2684966E-13,0 C12,-2.8610229E-06 100,0 100,0" x:Name="gloss" Fill="{StaticResource GlossyBlack_GlossGradient}"/> 

我删除了Stretch =“Fill”并解决了问题

答案 1 :(得分:0)

默认的FrameworkElement.Horizo​​ntalAlignment属性(上面未设置)是Stretch。您需要将其设置为LeftCenterRight,以防止拉伸。

通常,像这样的问题的真正解决方案不是更改控件的Horizo​​ntalAlignment属性,而是将包含ComboBox的元素的宽度设置为Auto,或者将它的Horizo​​ntalAlignment属性修改为除{之外的其他属性。 {1}}。