WPF 的Button怎么控制鼠标滑过和点击的样式

.Net技术 码拜 8年前 (2016-02-29) 2643次浏览
如题
迷茫脸
这么点分感觉高手粗现的几率很小。
解决方案

8

不开玩笑了,本人先看看
https://msdn.microsoft.com/zh-cn/library/ee230084(v=vs.110).aspx

4

先写好你要的样式(鼠标在按钮上的样式,鼠标点击按钮的样式),然后在button的样式里面使用触发器监听UIElement.IsMouseOver 和ButtonBase.IsPressed属性,设置对应的样式。

8

  <!--ButtonStyle-->
    <Style  TargetType="{x:Type Button}">
        <Setter Property="Height" Value="28"></Setter>
        <Setter Property="VerticalAlignment" Value="Center"></Setter>
        <Setter Property="HorizontalAlignment" Value="Center"></Setter>
        <Setter Property="VerticalContentAlignment" Value="Center"></Setter>
        <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate  TargetType="{x:Type Button}">
                    <Border x:Name="border"  BorderThickness="1" BorderBrush="#68B0E8"  CornerRadius="0.5" 
                            HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Padding="{TemplateBinding Padding}"
                            Width="{TemplateBinding Width}" Height="{TemplateBinding Height}">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                <GradientStop Color="#C8D1D0" Offset="0.5" />
                                <GradientStop Color="#C8D1D0" Offset="0.8" />
                                <GradientStop Color="#C8D1D0" Offset="1" />
                            </LinearGradientBrush>
                        </Border.Background>
                        <Label x:Name="lbContent" Content="{TemplateBinding Content}" Background="Transparent" Height="{TemplateBinding Height}"
                               VerticalAlignment="Center" HorizontalAlignment="Center"></Label>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" TargetName="border" Value="{DynamicResource window_Button_MouseOver}"></Setter>
                            <Setter Property="Foreground" TargetName="lbContent" Value="White"></Setter>
                            <!--<Setter Property="Opacity" TargetName="border" Value="0.6"></Setter>-->
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

本人修改border的Background值,增加点击trigger,不知道的话就去网上搜用法。

20

在 wpf 里,数据和界面是分开处理的,通过数据绑定的方式,也就是 binding 让二者发生联系。
为了让数据变化以后(如对象属性改变),界面也能随之响应(如字体改变),就有了通知 Notify 的概念。
系统提供了 INotifyPropertyChanged 接口,可以在本人写的类中实现这种通知。
window 中的控件是具有层次也就是父子关系的,
为了让父级控件接收到通知后层层传递下去,就有了路由 Route 的概念。
例如,点击按钮,但在 window 的 PreviewMouseLeftButtonDown 中也能处理改事件。
控件和数据绑定以后,数据因底层代码,或用户输入发生变化,
为了能让控件在数据满足某一特定条件时,做出反应,就有了触发器 trigger 的概念。
wpf 中的控件 uielement 有一个 样式 style 属性,这个属性能够让一组或全部控件按照其定义的属性或行为进行显示。
例如,界面上有30个按钮,分成3组,每组有各自的背景色、前景色、字体、字号、边框等特征。
此时,定义3个 不同名称的样式 style 分别应用到3组按钮上就可以了。
假设要求3组按钮都有各自的形状又该怎么办呢,这时就需要使用模板 template 了。
wpf 的控件模板 controltemplate 非常强大,可以将控件的显示,定义的面目全非。
版主给了你一个现成的 button 样式 style,其中也有模板 template 的定义,不过他没给全。
估计会原因是 {DynamicResource window_Button_MouseOver} 报错。
可以直接改成 Red,也可以在整个式前添加一行刷子 brush 的定义
<SolidColorBrush x:Key=”window_Button_MouseOver” Color=”Red” />
改过之后再试试。
下面这玩意儿就是触发器,当 IsMouseOver = true 时触发,
<ControlTemplate.Triggers>
<Trigger Property=”IsMouseOver” Value=”True”>
<Setter Property=”Background” TargetName=”border” Value=”Red“></Setter>
<Setter Property=”Foreground” TargetName=”lbContent” Value=”White”></Setter>
<!–<Setter Property=”Opacity” TargetName=”border” Value=”0.6″></Setter>–>
</Trigger>
</ControlTemplate.Triggers>
触发后会改变模板中名为 border 对象的背景色,lbContent 对象的前景色,注释掉的是用来改边框透明度的。
当鼠标离开控件 IsMouseOver = false 时,属性会被自动还原。
你可以本人尝试将 IsMouseOver 换掉,例如改为 IsPressed 鼠标按下,button 控件的哪些属性可以用于 trigger 呢
在 code 界面输入 new Button().Is 然后看成员列表,那里面的基本都是。
关于一个对象的具体帮助,可以在 xaml 界面输入标记,例如 <button ,然后双击标记,按 F1

CodeBye 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明WPF 的Button怎么控制鼠标滑过和点击的样式
喜欢 (1)
[1034331897@qq.com]
分享 (0)