WPF之自定义"消息框式"的窗体

以你之姓@ 2022-03-31 02:12 323阅读 0赞

原文 [http://www.cnblogs.com/ListenFly/archive/2013/02/19/2917744.html][http_www.cnblogs.com_ListenFly_archive_2013_02_19_2917744.html]

<Window x:Class="mumu_nonRectangularwindow.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" SizeToContent="WidthAndHeight"
        MouseLeftButtonDown="Window_MouseLeftButtonDown">
        
        <Canvas Width="200" Height="200" >
            
            <Path Stroke="DarkGray" StrokeThickness="2">
                <Path.Fill>
                    <LinearGradientBrush StartPoint="0.2,0" EndPoint="0.8,1" >
                        <GradientStop Color="White"  Offset="0"></GradientStop>
                        <GradientStop Color="White"  Offset="0.45"></GradientStop>
                        <GradientStop Color="LightBlue" Offset="0.9"></GradientStop>
                        <GradientStop Color="Gray" Offset="1"></GradientStop>
                    </LinearGradientBrush>
                </Path.Fill>
                <Path.Data>
                    <PathGeometry>
                        <PathFigure StartPoint="40,20" IsClosed="True">
                            <LineSegment Point="160,20"></LineSegment>
                            <ArcSegment Point="180,40" Size="20,20" SweepDirection="Clockwise"></ArcSegment>
                            <LineSegment Point="180,80"></LineSegment>
                            <ArcSegment Point="160,100" Size="20,20" SweepDirection="Clockwise"></ArcSegment>
                            <LineSegment Point="90,100"></LineSegment>
                            <LineSegment Point="90,150"></LineSegment>
                            <LineSegment Point="60,100"></LineSegment>
                            <LineSegment Point="40,100"></LineSegment>
                            <ArcSegment Point="20,80" Size="20,20" SweepDirection="Clockwise"></ArcSegment>
                            <LineSegment Point="20,40"></LineSegment>
                            <ArcSegment Point="40,20" Size="20,20" SweepDirection="Clockwise"></ArcSegment>
                        </PathFigure>
                    </PathGeometry>
                </Path.Data>
            </Path>
            
            <Label Width="200" Height="120" FontSize="15" HorizontalContentAlignment="Center" VerticalContentAlignment="Center">Drag Me</Label>
            
            <Button Canvas.Left="155" Canvas.Top="30" Click="Button_Click">
                <Button.Template>
                    <ControlTemplate>
                        <Canvas>
                            <Rectangle Width="15" Height="15" Stroke="Black" RadiusX="3" RadiusY="3">
                                <Rectangle.Fill>
                                    <SolidColorBrush x:Name="myAnimatedBrush" Color="Red" />
                                </Rectangle.Fill>
                            </Rectangle>
                            <Line X1="3" Y1="3" X2="12" Y2="12" Stroke="White" StrokeThickness="2"></Line>
                            <Line X1="12" Y1="3" X2="3" Y2="12" Stroke="White" StrokeThickness="2"></Line>
                        </Canvas>
                    </ControlTemplate>
                </Button.Template>
            </Button>
        </Canvas>
    </Window>

![复制代码][copycode.gif]

界面代码如上,后台代码如下:

![复制代码][copycode.gif]

private void Window_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
            {
                this.DragMove();
            }
    
            private void Button_Click(object sender, RoutedEventArgs e)
            {
                this.Close();
            }

![复制代码][copycode.gif]

后台代码比较简单,一个是自定义关闭按钮的事件,一个为鼠标左键按下事件(按下后可拖动窗体)。  
效果图如下：  
![19205958-5ae9226257d64d60ab47a55b5bf17ddc.png][]  
可是会发现,可预期的效果有点不一样,因为预期的是自定义的窗体,而不是依赖于窗体的自定义图形,所以还需要如下的设置

Background="Transparent" AllowsTransparency="True" WindowStyle="None"

设置窗体背景色为透明;同时设置AllowsTransparency为true，表示窗口的客户区支持透明色;同时删除最小化最大化和关闭按钮，所以设置WindowsStyle为None,最终的效果  
如下：  
![19212708-cbc48d3581cf4f90bb76d0de0855f2a8.jpg][]  
可以拖动窗体,同时也可以按下红叉关闭窗体,最重要是他的确是一个不规则的自定义窗体.  
  
其实自定义窗体的实现原理很简单,由一个Path和一个Button(通过模板绘制出红叉),Path绘制出了消息框的图形，Button实现了关闭功能。

[http_www.cnblogs.com_ListenFly_archive_2013_02_19_2917744.html]: http://www.cnblogs.com/ListenFly/archive/2013/02/19/2917744.html
[copycode.gif]: /images/20220331/fe8e8c2875c340f39cc3702ea0df511f.png
[19205958-5ae9226257d64d60ab47a55b5bf17ddc.png]: /images/20220331/5ec94664e1d24f9da33870d643a7e58e.png
[19212708-cbc48d3581cf4f90bb76d0de0855f2a8.jpg]: /images/20220331/a4f94acff88446df9a3b85cff79d7218.png

发表评论取消回复

表情：

评论列表（有 0 条评论，323人围观）

还没有评论，来说两句吧...

相关阅读

相关 C#窗体应用自定义CheckBox

一.创建窗体控件库MyCheckBox 1.新建窗体控件库 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shad

不念不忘少年蓝@/ 2023年01月16日 13:28/ 0 赞/ 341 阅读

相关 WPF窗体自适应分辨率

WPF窗体使用Viewbox自适应分辨率使用WPF创建一个窗体(Window)时，如果设置了固定的高度(Height)和宽度（Width），一旦用户的电脑分辨率过低，就

古城微笑少年丶/ 2022年12月11日 12:18/ 0 赞/ 216 阅读

相关 WPF系列（1）----简单窗体

<Window x:Class="T

比眉伴天荒/ 2022年09月04日 13:51/ 0 赞/ 192 阅读

相关【WPF无边框窗体】

WPF是Windows操作系统中一次重大变革，与早期的GDI+/GDI不同。 WPF是基于DirectX引擎的，支持GPU硬件加速，在不支持硬件加速时也可以使用软件绘制。

短命女/ 2022年08月21日 05:59/ 0 赞/ 203 阅读

相关 Qt学习之路之自定义消息框

Qt自己也有很多的消息框，这时，如果这些消息框都不能满足开发的需求， Qt还允许自定义消息框。包括消息框的图标，按钮和消息框显示的内容都可以根据需求设定。不废话了，下面给

心已赠人/ 2022年08月06日 06:06/ 0 赞/ 242 阅读

相关 WPF自适应窗体实现小结

这几天，因工作需要，要对一个小软件进行UI调整。主要内容就是让其能够实现自适应窗体（包括文字和图标），做成像WIN7下的Media Center一样的UI。自适应窗体，顾名思义

r囧r小猫/ 2022年08月06日 02:23/ 0 赞/ 209 阅读

相关弹窗消息框

<!DOCTYPE html>  <html>

偏执的太偏执、/ 2022年05月14日 01:56/ 0 赞/ 462 阅读

相关自定义AlertDialog消息提示框

自定义AlertDialog消息提示框，大家根据我的代码自行扩展。下图是威哥做的demo消息提示效果图： ![70][] 威哥不喜欢废话，直接上代码。 1、消息提示jav

川长思鸟来/ 2022年05月12日 02:50/ 0 赞/ 348 阅读

相关 WPF之自定义"消息框式"的窗体

原文 [http://www.cnblogs.com/ListenFly/archive/2013/02/19/2917744.html][http_www.cnblogs.c

以你之姓@/ 2022年03月31日 02:12/ 0 赞/ 324 阅读

相关【WPF】无边框窗体

之前写了一个支持尺寸变换的无边框窗体的一个基窗体，代码如下： public class LBaseWindow : Window {

迈不过友情╰/ 2022年03月27日 14:40/ 0 赞/ 270 阅读