开发者

C#中的Drawing 类案例详解

开发者 https://www.devze.com 2025-08-09 10:35 出处:网络 作者: 工程师007
目录一、Drawing 是什么?二、典型用法三、案例:画一个“带阴影的圆角矩形按钮”四、WinForms(GDI+)对应写法一、Drawing 是什么?
目录
  • 一、Drawing 是什么?
  • 二、典型用法
  • 三、案例:画一个“带阴影的圆角矩形按钮”
  • 四、WinForms(GDI+)对应写法

一、Drawing 是什么?

命名空间

  • wpF:System.Windows.Media
  • WinForms:System.Drawing(GDI+)

继承链(WPF)

  • Object → DispatcherObject → DependencyObject → Freezable → Animatable → Drawing

常用派生类:

  • GeometryDrawing(用 Path 画形状)
  • ImageDrawing(贴位图)
  • VideoDrawing(播放视频)
  • GlyphRunDrawing(文字)
  •  DrawingGroup(容器,可组合其它 Drawing)

特点

  • 轻量级:只存“矢量指令”,不继承 UIElement,不参与布局/事件路由。
  • 可冻结(Freeze):变为只读后可跨线程使用。
  • 可序列化/导出为 XAML。

二、典型用法

  • 直接放在控件里
  • 用 DrawingBrush 或 DrawingImage 把 Drawing 变成 Brush/Image,再赋给控件的 Background、Source 等属性。
  • 在 DrawingVisual 里绘制
  • 适合自定义控件、命中测试、打印。
  • 在 DrawingGroup 里组合
  • 把多个 Drawing 套娃,实现复杂场景。

三、案例:画一个“带阴影的圆角矩形按钮”

目标:

  • 圆角矩形(填充线性渐变、描边)
  • 下方有一层模糊阴影(半透明黑圆角矩形)
  •  鼠标悬停时整体高亮(动画改变渐变)

WPF:

<Window x:Class="DemoDrawing.MainWindow"
        XMLns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Drawing 示例" Width="300" Height="200">
    <Grid>
        <!-- 使用 DrawingBrush 做背景 -->
        <Rectangle x:Name="btnRect" Width="180" Height="60"
                   MouseEnter="BtnRect_MouseEnter"
                   MouseLeave="BtnRect_MouseLeave">
            <Rectangle.Resources>
                <!-- 阴影 Drawing -->
                <GeometryDrawing x:Key="shadow"
                                 Geometry="M 5,5 175,5 175,55 5,55 Z"
                                 Brush="#80000000">
                    <GeometryDrawing.Pen>
                        <Pen Brush="Transparent" Thickness="1"/>
                    </GeometryDrawing.Pen>
                </GeometryDrawing编程客栈>
                <!-- 按钮主体 Drawing -->
                <GeometryDrawing x:Key="body" Geometry="M 0,0 170,0 170,50 0,50 Z">
                    <GeometryDrawing.Brush>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <GradientStop Offset="0"  Color="#FF4C9AFF"/>
                            <GradientStop Offset="1"  Color="#FF0050DD"/>
                        </LinearGradientBrush>
                    </GeometryDrawing.Brush>
                    <GeometryDrawing.Pen>
                        <Pen Brush="#FF003399" Thickness="2"/>
                    </GeometryDrawing.Pen>
                </GeometryDrawing>
                <!-- 组合 DrawingGroup -->
                <DrawingGroup x:Key="combined">
                    <!-- 先画阴影 -->
                    <DrawingGroup.Children>
                        <DrawingGroup>
                            <DrawingGroup.Children>
                                <StaticResource ResourceKey="shadow"/>
                            </DrawingGroup.Children>
                            <DrawingGroup.BitmapEffect>
                                <BlurBitmapEffect Radius="5"/>
                            </DrawingGroup.BitmapEffect>
                        </DrawingGroup>
                        <!-- 再画按钮主体 -->
                        <StaticResource ResourceKey="body"/>
                    </DrawingGroup.Children>
                </DrawingGroup>
                <!-- 把 DrawingGroup 变成 Brush -->
                <DrawingBrush x:Key="btnBrush" Drawing="{StaticResource combined}"/>
            </Rectangle.Resources>
            <Rectangle.Fill>
                <StaticResource ResourceKey="btnBrush"/>
            </Rectangle.Fill>
        </Rectangle>
    </Grid>
</Window>

后台代码

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }
    private void BtnRect_MouseEnter(object sender, MouseEventArgs e)
    {
        // 找到 Drawing 里的渐变刷
        var rect = (Rectangle)sender;
        var brush = (DrawingBrush)rect.Fill;
        var dg = (DrawingGrouprfcEgVVOr)brush.Drawing;
        var body = (GeometryDrawing)((DrawingGroup)dg.Children[1]).Children[0];
        var lg = (phpLinearGradientBrush)body.Brush;
        // 动画高亮
        var da = new ColorAnimation(Color.FromRgb(0x6F, 0xBA, 0xFF),
                                    TimeSpan.FromMilliseconds(300));
        lg.GradientStops[0].BeginAnimation(GradientStop.ColorProperty, da);
    }
    private void BtnRect_MouseLeave(object sender, MouseEventArgs e)
    {
   rfcEgVVOr     var rect = (Rectangle)sender;
        var brush = (DrawingBrush)rect.Fill;
        var dg = (DrawingGroup)brush.Drawing;
        var body = (GeometryDrawing)((DrawingGroup)dg.Chihttp://www.devze.comldren[1]).Children[0];
        var lg = (LinearGradientBrush)body.Brush;
        var da = new ColorAnimation(Color.FromRgb(0x4C, 0x9A, 0xFF),
                                    TimeSpan.FromMilliseconds(300));
        lg.GradientStops[0].BeginAnimation(GradientStop.ColorProperty, da);
    }
}

四、WinForms(GDI+)对应写法

WinForms 没有 Drawing 类,而是 GraphicsPath + LinearGradientBrush + Bitmap 的“即时模式”绘制。核心步骤:

protected override void OnPaint(PaintEventArgs e)
{
    var g = e.Graphics;
    g.SmoothingMode = SmoothingMode.AntiAlias;
    // 1. 阴影
    using (var path = CreateRoundRect(5, 5, 175, 55, 8))
    using (var brush = new SolidBrush(Color.FromArgb(128, 0, 0, 0)))
    using (var blur = new Bitmap(180, 60))
    {
        using (var g2 = Graphics.FromImage(blur))
        {
            g2.SmoothingMode = SmoothingMode.AntiAlias;
            g2.FillPath(brush, path);
        }
        // 手动高斯模糊(略)...
        g.DrawImage(blur, 0, 0);
    }
    // 2. 主体
    using (var path = CreateRoundRect(0, 0, 170, 50, 8))
    using (var brush = new LinearGradientBrush(
        new Point(0, 0), new Point(0, 50),
        Color.FromArgb(255, 0x4C, 0x9A, 0xFF),
        Color.FromArgb(255, 0x00, 0x50, 0xDD)))
    using (var pen = new Pen(Color.FromArgb(255, 0x00, 0x33, 0x99), 2))
    {
        g.FillPath(brush, path);
        g.DrawPath(pen, path);
    }
}
private GraphicsPath CreateRoundRect(float x, float y, float w, float h, float r)
{
    var gp = new GraphicsPath();
    gp.AddArc(x + w - r, y, r, r, 270, 90);
    gp.AddArc(x + w - r, y + h - r, r, r, 0, 90);
    gp.AddArc(x, y + h - r, r, r, 90, 90);
    gp.AddArc(x, y, r, r, 180, 90);
    gp.CloseFigure();
    return gp;
}
  •  WPF 的 Drawing 体系是“矢量指令树”,轻量、可缓存、可动画,适合高性能场景(千级图形)。
  •  常用套路:GeometryDrawing/DrawingGroup → DrawingBrush/DrawingImage → Shape 或 Image 控件。
  •  WinForms 没有 Drawing 类,用 Graphics 即时绘制;想缓存可用 Bitmap/ Metafile。

到此这篇关于C#Drawing 类详解的文章就介绍到这了,更多相关C# Drawing 类内容请搜索编程客栈(www.devze.com)以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程客栈(www.devze.com)!

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号