当前位置:网站首页>C# wpf borderless window add shadow effect
C# wpf borderless window add shadow effect
2022-07-30 18:35:00 【CodeOfCC】
前言
When making borderless windows,The system's own shadow will disappear,At this time, I need to add shadows to the window to prevent the window from blending into the background.The way to add shadows is simple,直接用effect就可以了,But there is still a subtle detail that needs to be dealt with,Window maximization after shadowing can be problematic.
一、如何实现?
1、去除边框
(1)方法一
使用WindowStyleWindow borders can be removed,AllowsTransparency+BackgroundMake a transparent window to leave a transparent margin for the shadow.
注:This method affects the rendering performance of the window more.
<Window WindowStyle="None" AllowsTransparency="True" Background="Transparent" >
(2)方法二
使用WindowChromeBorderless windows can also be implemented,.net4.5This component can then be used.WindowChromeUsually does not affect rendering performance.
<Window WindowStyle="None" Background="Transparent" ResizeMode="NoResize">
<WindowChrome.WindowChrome>
<WindowChrome GlassFrameThickness="-1" CaptionHeight="0" />
</WindowChrome.WindowChrome <Grid>
</Grid>
</Window>
2、添加阴影
使用DropShadowEffect 加Margin属性即可.After adding shadow effects,需要设置marginLeave a margin for the shadow,Otherwise, no shadow can be seen.Usually it ends at this point,Continue down if the window needs to be maximized.
<Window >
<Grid Margin="10" Background="White">
<Grid.Effect>
<DropShadowEffect ShadowDepth="0" BlurRadius="10" Opacity="0.8" Color="#AAAAAA"/>
</Grid.Effect>
</Grid>
</Window>
3、添加触发器
1、 Why add triggers?
根据上述2Steps after adding shadows,If you maximize the window you will find it,Margin依然生效,Fullscreen windows have a transparent margin,In order to solve this problem, we need to add triggers.
2、 具体实现
在style中使用触发器,bind window state,The margins are set to when maximized0,Otherwise set to the required margin for the shadow.在这里需要注意的是此时Grid不可以设置MarginAttributes can only be set in triggers,Because of assignment priority,在Grid中设置MarginPost-trigger assignments are invalidated.
<Grid Background="#1e1e1e">
<Grid.Style>
<Style TargetType="Grid"> <!--Leave a margin for the shadow--> <Style.Triggers> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Normal"> <Setter Property="Margin" Value="10" /> </DataTrigger> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Minimized"> <Setter Property="Margin" Value="10" /> </DataTrigger> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Maximized"> <Setter Property="Margin" Value="0" /> </DataTrigger> </Style.Triggers> </Style>
</Grid.Style>
</Grid>
二、示例代码
MainWindow.xaml
<Window x:Class="WpfApp8.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:WpfApp8" mc:Ignorable="d" Title="MainWindow" Height="450" Width="800" WindowStyle="None" Background="Transparent" ResizeMode="NoResize" >
<WindowChrome.WindowChrome>
<WindowChrome GlassFrameThickness="-1" CaptionHeight="0" />
</WindowChrome.WindowChrome>
<Grid Background="white">
<Grid.Effect>
<DropShadowEffect ShadowDepth="0" BlurRadius="10" Opacity="0.8" Color="#AAAAAA"/>
</Grid.Effect>
<Grid.Style>
<Style TargetType="Grid"> <!--Leave a margin for the shadow--> <Style.Triggers> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Normal"> <Setter Property="Margin" Value="10" /> </DataTrigger> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Minimized"> <Setter Property="Margin" Value="10" /> </DataTrigger> <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}" Value="Maximized"> <Setter Property="Margin" Value="0" /> </DataTrigger> </Style.Triggers> </Style>
</Grid.Style>
<!--标题栏-->
<Grid VerticalAlignment="Top" >
<StackPanel Margin="0,0,10,0" HorizontalAlignment="Right" Orientation="Horizontal">
<!--最小化按钮-->
<Button Width="50" Height="50" Focusable="False" VerticalAlignment="Center" Cursor="Hand" Click="Button_Click_1" >
<Button.Template>
<ControlTemplate TargetType="Button">
<Grid x:Name="grd" Background="Transparent">
<Rectangle Width="20" Height="3" Fill="#1e1e1e" ></Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="grd" Property="Background" Value="#666666"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
<!--最大化按钮-->
<Button Width="50" Height="50" Focusable="False" VerticalAlignment="Center" Cursor="Hand" Visibility="{DynamicResource MaximizeButtonVisibility}" Click="Button_Click">
<Button.Template>
<ControlTemplate>
<Grid x:Name="grd" Background="Transparent">
<Rectangle Width="20" Height="20" Stroke="#1e1e1e" StrokeThickness="3"></Rectangle>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="grd" Property="Background" Value="#666666"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
<!--关闭按钮-->
<Button Width="50" Height="50" Focusable="False" VerticalAlignment="Center" Cursor="Hand" Click="Button_Click_2">
<Button.Template>
<ControlTemplate>
<Grid x:Name="grd" Background="Transparent">
<Line Width="20" Height="20" X1="0" Y1="0" X2="20" Y2="20" StrokeThickness="3" Stroke="#1e1e1e" ></Line>
<Line Width="20" Height="20" X1="20" Y1="0" X2="0" Y2="20" StrokeThickness="3" Stroke="#1e1e1e" ></Line>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="grd" Property="Background" Value="#666666"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Button.Template>
</Button>
</StackPanel>
</Grid>
</Grid>
</Window>
MainWindow.xaml.cs
using System.Windows;
namespace WpfApp8
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
WindowState = WindowState== WindowState.Maximized? WindowState .Normal: WindowState.Maximized;
}
private void Button_Click_1(object sender, RoutedEventArgs e)
{
WindowState = WindowState.Minimized;
}
private void Button_Click_2(object sender, RoutedEventArgs e)
{
Close();
}
}
}
三、效果预览
总结
以上就是今天要讲的内容,The method of adding shadows to windows is relatively simple,Just need to pay attention to the case where the window is maximized.But in fact, window shadows have a relatively large impact on performance,Especially if you have rendered video,消耗更多的cpu.So shadows are only suitable for scenes with low performance requirements.
边栏推荐
- SwiftUI iOS Boutique Open Source Project Complete Baked Food Recipe App based on SQLite (tutorial including source code)
- AI基础:图解Transformer
- 还有三天忙完
- 博纳影通过IPO注册:阿里腾讯是股东 受疫情冲击明显
- Mysql执行原理剖析
- MySQL数据类型
- DevEco Studio3.0下载失败,提示An unknown error occurred
- requet.getHeader("token") is null
- OSPF详解(4)
- requet.getHeader(“token“) 为null
猜你喜欢
Web结题报告
【Pointing to Offer】Pointing to Offer 18. Delete the node of the linked list
ESP8266-Arduino编程实例-BMP180气压温度传感器驱动
6 yuan per catty, why do Japanese companies come to China to collect cigarette butts?
Does the satellite phone communicate directly with the satellite or through a ground station?
智慧中控屏
Deepen school-enterprise cooperation and build an "overpass" for the growth of technical and skilled talents
【Prometheus】Prometheus联邦的一次优化记录[续]
One year after graduation, I was engaged in software testing and won 11.5k. I didn't lose face to the post-98 generation...
【Pointing to Offer】Pointing to Offer 22. The kth node from the bottom in the linked list
随机推荐
Hello, my new name is "Bronze Lock/Tongsuo"
【剑指 Offe】剑指 Offer 18. 删除链表的节点
AI基础:图解Transformer
【AGC】构建服务1-云函数示例
【Swords Offer】Swords Offer 17. Print n digits from 1 to the largest
The Meta metaverse division lost 2.8 billion in the second quarter!Still want to keep betting?Metaverse development has yet to see a way out!
【Pointing to Offer】Pointing to Offer 22. The kth node from the bottom in the linked list
CCNA-ACL(访问控制列表)标准ACL 扩展ACL 命名ACL
Anaconda Navigator stuck on loading applications
Network Basics (3) 01-Basic Concepts of Networks - Protocols, Host Addresses, Paths and Parameters of URL Addresses & 127.0.0.1 Local Loopback Address & View URL IP Address and Access Ping Space + URL
尊重客观事实
中集世联达工业级成熟航运港口人工智能AI产品规模化应用,打造新一代高效能智慧港口和创新数字港口,全球港航人工智能能领军者中集飞瞳
Node encapsulates a console progress bar plugin
What kind of framework is friendly to developers?
NC | Tao Liang Group of West Lake University - TMPRSS2 "assists" virus infection and mediates the host invasion of Clostridium sothrix hemorrhagic toxin...
mysql的多实例
还有三天忙完
MySQL——基础知识
scrapy基本使用
猎豹移动终于递交年报:年营收7.85亿 腾讯持股16.6%