wpf之lable右下角放关闭图标

效果如下：

看右下角的关闭图标，丑一点就丑一点吧。

我的需求如下：

鼠标移动上去，背景颜色改变为蓝色，关闭图标出现。鼠标移动走，背景变成黑色，关闭图标隐藏。

为了实现这样一个简单的功能，我居然研究了2天，心累。。

现在把遇到的坑记录一下，留作纪念。

第一个坑

lable控件默认的坑不为0，需要把Padding="0" 设置为0 不然的话grid不会和lable

<Label Grid.Row="0" Padding="0" Focusable="False" Width="80" Height="80" Style="{StaticResource TriggerStyle}">

第二个坑：

button控件，默认会有个鼠标移动上去的悬浮操作，需要去掉，这里重新一个style，

<Style x:Key="NoMouseOverButtonStyle" TargetType="{x:Type Button}"><Setter Property="BorderThickness" Value="1"/><Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/><Setter Property="HorizontalContentAlignment" Value="Center"/><Setter Property="VerticalContentAlignment" Value="Center"/><Setter Property="Padding" Value="1"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type Button}"><Border x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"><ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/></Border></ControlTemplate></Setter.Value></Setter></Style>

第三个坑：默认的button控件，会有个边框需要设置如下

 BorderBrush="{x:Null}"

但是后来发现用了第二个style之后，边框也没有了。

第四个坑：如何在lable控件中，找到文字和button控件？

这里上一下代码

            foreach (var va in ((Grid)lb.Content).Children){if (va is Button){((Button)va).Visibility = Visibility.Collapsed;}}

最后上一下完整的代码

xaml里面的代码：

<Window x:Class="WpfPictureClick.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:WpfPictureClick"xmlns:sys="clr-namespace:System;assembly=mscorlib"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Window.Resources><Style x:Key="EventStyle"><EventSetter Event="Label.MouseEnter" Handler="FrameworkElement_MouseEnter"></EventSetter><EventSetter Event="Label.MouseLeave" Handler="FrameworkElement_MouseLeave"></EventSetter></Style><Style x:Key="TriggerStyle" ><Style.Triggers><Trigger Property="Label.IsMouseOver" Value="True"><Setter Property="Label.Background" Value="#1F31A5"></Setter></Trigger><Trigger Property="Label.IsMouseOver" Value="false"><Setter Property="Label.Background" Value="Black"></Setter></Trigger></Style.Triggers><EventSetter Event="Label.MouseEnter" Handler="FrameworkElement_MouseEnter"></EventSetter><EventSetter Event="Label.MouseLeave" Handler="FrameworkElement_MouseLeave"></EventSetter></Style><Style x:Key="NoMouseOverButtonStyle" TargetType="{x:Type Button}"><Setter Property="BorderThickness" Value="1"/><Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/><Setter Property="HorizontalContentAlignment" Value="Center"/><Setter Property="VerticalContentAlignment" Value="Center"/><Setter Property="Padding" Value="1"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type Button}"><Border x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"><ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/></Border></ControlTemplate></Setter.Value></Setter></Style></Window.Resources><Grid><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Label Grid.Row="0" Padding="0" Focusable="False" Width="80" Height="80" Style="{StaticResource TriggerStyle}"><Grid Width="80" Height="80"><Label Background="Transparent" Foreground="#C9C9C9" VerticalAlignment="Center" HorizontalAlignment="Center">33333</Label><Button Style="{StaticResource NoMouseOverButtonStyle}"  Click="Button_Click"Visibility="Collapsed" Padding="0" Width="22" Height="22" HorizontalAlignment="Right" VerticalAlignment="Bottom"><Button.Background><ImageBrush  ImageSource="OFF_GRAY.PNG" ></ImageBrush></Button.Background></Button></Grid></Label><Button Grid.Row="1" Width="80" Height="80" Content="3333"></Button></Grid>
</Window>

cs代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;namespace WpfPictureClick
{/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();}public void FrameworkElement_MouseEnter(object sender, MouseEventArgs e){var lb = ((Label)sender);foreach(var va in ((Grid)lb.Content).Children){if(va is Button){((Button)va).Visibility =  Visibility.Visible;}}//((Button)sender).Background = new SolidColorBrush(Color.FromArgb(0xFF, 0x2c, 0x2c, 0x2c));}private void FrameworkElement_MouseLeave(object sender, MouseEventArgs e){//((Button)sender).Background = new SolidColorBrush(Color.FromArgb(0xFF, 0x12, 0x57, 0x90));var lb = ((Label)sender);foreach (var va in ((Grid)lb.Content).Children){if (va is Button){((Button)va).Visibility = Visibility.Collapsed;}}}private void Button_Click(object sender, RoutedEventArgs e){int a = 0;}}
}

wpf之lable右下角放关闭图标相关推荐

win7右下角的网络图标不显示
背景桌面右下角自定义图标里的网络图标是灰色的,但是可以正常上网... 亲测有效解决办法任务栏点三角号----自定义----在弹出的窗口下点打开或关闭系统图标----在窗口行为下选择网络图标打开或者 ...
linux网络连接红叉号,win10能上网,但右下角宽带连接图标显示红叉的解决方法
原创内容,转载请注明出处: https://www.myzhenai.com.cn/post/2196.html https://www.myzhenai.com/thread-17859-1-1.h ...
服务器右下角的tomcat图标不显示了——解决方法
参考:https://blog.csdn.net/zhangkang65/article/details/85548002 引起现象: 远程桌面给服务器上传文件,点击取消或关闭上传时,一直没有反应,关 ...
win8右下角网络图标不见了_win8系统右下角的音量图标不见了的具体办法
有关win10系统右下角的音量图标不见了的操作方法想必大家有所耳闻.但是能够对win10系统右下角的音量图标不见了进行实际操作的人却不多.其实解决win10系统右下角的音量图标不见了的问题也不是难事, ...
win10右下角显示桌面图标消失并且点击左下角Windows按钮或者打开任意文件夹直接全屏无法缩小
记录一次糟心的经历问题: win10右下角显示桌面图标消失并且点击左下角Windows按钮或者打开任意文件夹直接全屏无法缩小方法: 问题: win10右下角显示桌面图标消失并且点击左下角Windo ...
电脑右下角搜狗拼音输入法图标如何隐藏
电脑右下角搜狗拼音输入法图标如何隐藏右键点击语言栏,设置,删除除了搜狗以外的中文输入法,确定.也就是说中文输入法只保留搜狗,不要删除外文输入法.
计算机桌面右下角网络连接的图标不见了,电脑右下角本地连接图标不见了这种找回方法既简单有轻松...
原标题:电脑右下角本地连接图标不见了这种找回方法既简单有轻松电脑在使用过程中经常出现这样或那样的问题,有些小问题对于那些略知一二的人来说是可以解决的,但遇到棘手的问题,只能请专业IT运维工程师来解 ...
window10右下角天气关闭
window10右下角天气关闭 window10右下角天气关闭 window10右下角天气关闭更新完很不习惯多了个广告推荐,影响工作学习专注,关闭的方法:右键任务栏–>资讯和兴趣( ...
计算机语言输入不见了,win7右下角的输入法图标不见_右下角的输入法没了_右下角的语言栏不见了的解决方法...
最近有很多同事说在工作中有时候电脑用着用着右下角的输入法图标却没有了,让人觉得很不习惯.对于这种情况要怎么把右下角的语言栏调出来呢?一般是重新启动一下电脑,但是大部分电脑重启了还是一样没有显示右下角的 ...

wpf之lable右下角放关闭图标

wpf之lable右下角放关闭图标相关推荐

最新文章

热门文章