我如何设置按钮样式

Question

我的UX设计师给了我这些,我不知道从哪里开始设计我的WPF应用程序.任何帮助,将不胜感激.也许是我可以为其他两个扩展的例子.

除了可视显示外,这些将是所有其他方面的标准按钮.我认为我不需要实现自定义控件.

Answer 1

关于按钮样式的MSDN文档可能对您有所帮助.它给出了一个WPF按钮模板的示例,您应该可以根据需要进行编辑.Windows.Resources如果仅在该表单上使用该样式,则可以将Xaml置于其中,或者您可以编辑Application.xaml文件并将样式信息放入该Application.Resources部分(如果它将用于整个应用程序).

修改上面的样式链接给你一个例子:

<Application x:Class="Application"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="MainWindow.xaml">
    <Application.Resources>
        <!--Control colors.-->
        <Color x:Key="ControlNormalColor">#FFC0C0CE</Color>
        <Color x:Key="ControlMouseOverColor">#FFAFA3B9</Color>
        <Color x:Key="DisabledControlColor">#FFF2F2F2</Color>
        <Color x:Key="DisabledForegroundColor">#FFBFBFBF</Color>
        <Color x:Key="ControlPressedColor">#FF211AA9</Color>

        <!-- FocusVisual -->

        <Style x:Key="ButtonFocusVisual">
            <Setter Property="Control.Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Border>
                            <Rectangle Margin="2" StrokeThickness="1" Stroke="#60000000" StrokeDashArray="1 2" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Button -->
        <Style TargetType="Button">
            <Setter Property="SnapsToDevicePixels" Value="true" />
            <Setter Property="OverridesDefaultStyle" Value="true" />
            <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}" />
            <Setter Property="MinHeight" Value="29px" />
            <Setter Property="MinWidth"  Value="103px" />
            <Setter Property="Foreground" Value="#FFFFFFFF" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border TextBlock.Foreground="{TemplateBinding Foreground}" x:Name="Border">
                            <Border.Background>
                                <SolidColorBrush  Color="{DynamicResource ControlNormalColor}" />
                            </Border.Background>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.5" />
                                        <VisualTransition GeneratedDuration="0" To="Pressed" />
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
                                                Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
                                                Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)"
                                                Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"
                                                Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <ContentPresenter Margin="2"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            RecognizesAccessKey="True" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Application.Resources>
</Application>