Button改变样式

1.效果图

默认效果

鼠标移上去

点击


2.样式

     <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}" />
            <Setter Property="BorderBrush" Value="red" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Foreground" Value="white" />
            <Setter Property="FontSize" Value="20" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="FontFamily" Value="Yahei" />
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="Padding" Value="2" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <!--	<Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome"
						BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}"
						RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RenderDefaulted="{TemplateBinding IsDefaulted}"					
						SnapsToDevicePixels="true">
							</Microsoft_Windows_Themes:ButtonChrome>
							-->
                        <Grid>
                            <Ellipse x:Name="border" Fill="lightYellow" Stroke="{TemplateBinding BorderBrush}">
                                <Ellipse.Effect>
                                    <DropShadowEffect />
                                </Ellipse.Effect>
                            </Ellipse>
                            <TextBlock Margin="{TemplateBinding Margin}"
                                       HorizontalAlignment="center"
                                       VerticalAlignment="Center"
                                       x:Name="tb"
                                       FontFamily="{TemplateBinding FontFamily}"
                                       FontSize="{TemplateBinding FontSize}"
                                       FontWeight="{TemplateBinding FontWeight}"
                                       Text="{TemplateBinding Content}" />
                        </Grid>

                        <ControlTemplate.Triggers>
                            <!--	<Trigger Property="IsKeyboardFocused" Value="true">
								<Setter Property="RenderDefaulted" TargetName="Chrome" Value="true"/>
							</Trigger>
							<Trigger Property="ToggleButton.IsChecked" Value="true">
								<Setter Property="RenderPressed" TargetName="Chrome" Value="true"/>
							</Trigger>
							-->
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Foreground" Value="#ADADAD" />
                            </Trigger>

                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter TargetName="border" Property="Stroke" Value="red" />
                                <Setter TargetName="tb" Property="Foreground" Value="red" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="false">
                                <Setter TargetName="border" Property="Stroke" Value="lightBlue" />
                                <Setter TargetName="tb" Property="Foreground" Value="black" />
                            </Trigger>
                            <Trigger Property="IsFocused" Value="true">
                                <Setter Property="Foreground" Value="red" />
                            </Trigger>
                            <Trigger Property="IsFocused" Value="false">
                                <Setter Property="Foreground" Value="Black" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="border" Property="Fill" Value="Orange" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


3.总结

 以前写trigger总是没有效果,比如IsMouseOver,现在才了解,其Setter里一般要制定特定的控件,这也是因为当父级与子级都有的属性时,必须要指定吧


   

阅读更多
个人分类: WPF Blend Button Style
想对作者说点什么? 我来说一句

Button按钮的样式

2010年08月26日 4KB 下载

WPF Button 鼠标移动改变样式

kllxyu kllxyu

2015-08-06 12:31:45

阅读数:1983

ASP.net开发经典button样式

2011年04月07日 4KB 下载

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭