WPF界面设计技巧（6）—玩玩数字墨水手绘涂鸦

<Window x:Class="数字墨迹.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="www.cnblogs.com" Closing="Window_Closing" Initialized="Window_Initialized" WindowStyle="ToolWindow" SizeToContent="WidthAndHeight">

<Grid>

<InkCanvas Background="{StaticResource back}" Width="435" Height="300" Name="ink">

<InkCanvas.DefaultDrawingAttributes>

<DrawingAttributes Color="#882F515B" IsHighlighter="True" StylusTip="Rectangle" Height="4" Width="2" IgnorePressure="True" FitToCurve="True">

<DrawingAttributes.StylusTipTransform>

<Matrix M11="1" M12="1.5" M21="2.2" M22="1"/>

</DrawingAttributes.StylusTipTransform>

</DrawingAttributes>

</InkCanvas.DefaultDrawingAttributes>

</InkCanvas>

</Grid>

</Window>

后台代码：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

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 数字墨迹

先看效果吧，编译运行：



可以用鼠标、手写笔或触摸屏在上面随意涂鸦，这感觉很好。

想像一下，这个软件对于囚犯来说，会是多么重要。



对于一些手写笔，还支持反转时转换为橡皮擦功能，很牛X。

关闭程序后，我们的艺术品还会被自动保存为 pic.ink 这个文件，这样在下次程序启动时，我们就可以继续创作了。

代码讲解：



先来讲个小技巧，为窗体设置 SizeToContent="WidthAndHeight" ，然后将其宽、高都改为 Auto ，可以让窗体根据其内容自适应大小，这在多数情况下非常好用，如果你在意界面的边距空间美感的话。



InkCanvas 是数字墨迹的容器，InkCanvas.DefaultDrawingAttributes 属性定义了其默认的绘制样式，我们在这里可以为其调整笔刷颜色、形状、等为数不多的样式，其中几项还不太好用，比如压感支持 IgnorePressure ，在我这设了也没用。

DrawingAttributes.StylusTipTransform 属性可以将普通且无辜的笔刷形状残忍地扭曲，它使用一个矩阵来来完成这一恶毒行径。



这里是一些简单的 IO 操作，很好理解。

嗯，不管你是否喜欢，我都将用一个操蛋的方式结束本篇：



源代码下载（包含 Design 设计文件）