如何防止 WPF 裁剪矢量图形
本文关键字:图形 裁剪 何防止 WPF | 更新日期: 2023-09-27 18:32:44
我有一个 SVG 图形,它是位于 400x400 视框中心的 264x264 正方形,正方形周围的 68 像素填充是图像的重要组成部分,我希望它显示在 WPF 中。我正在使用一个库将 SVG 绘图转换为 WPF 绘图图像,将其塞入页面以预览后的输出如下所示:
<Page x:Class="Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="400"
Title="Page1">
<Image>
<Image.Source>
<DrawingImage>
<DrawingImage.Drawing>
<DrawingGroup xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:svg="http://sharpvectors.codeplex.com/runtime/">
<DrawingGroup.Children>
<DrawingGroup>
<DrawingGroup.Children>
<DrawingGroup>
<DrawingGroup.Children>
<DrawingGroup>
<DrawingGroup.Children>
<GeometryDrawing Brush="#FFAAFFAA">
<GeometryDrawing.Pen>
<Pen Brush="#FF000000" Thickness="10" StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter" />
</GeometryDrawing.Pen>
<GeometryDrawing.Geometry>
<RectangleGeometry RadiusX="0" RadiusY="0" Rect="68,68,264,264" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup.Children>
<DrawingGroup.ClipGeometry>
<RectangleGeometry Rect="0,0,400,400" />
</DrawingGroup.ClipGeometry>
<DrawingGroup.Transform>
<TranslateTransform X="0" Y="0" />
</DrawingGroup.Transform>
</DrawingGroup>
</DrawingGroup.Children>
</DrawingGroup>
</DrawingGroup.Children>
<DrawingGroup.ClipGeometry>
<RectangleGeometry Rect="0,0,400,400" />
</DrawingGroup.ClipGeometry>
</DrawingGroup>
</DrawingGroup.Children>
</DrawingGroup>
</DrawingImage.Drawing>
</DrawingImage>
</Image.Source>
</Image>
</Page>
生成的图像是一个完全填满其容器的正方形,而不是像我想要的那样在其周围留下一些空白空间。如何让 WPF 保留该空间而不是裁剪它?
当你使用DrawingImage
时,渲染Image
时会忽略/裁剪空白空间。这篇文章讨论了同样的问题:为什么几何绘图显示在画布上,并带有裁剪的坐标?
您可以通过将空白区域绘制为绿色矩形后面的透明 400x400 矩形来实现您想要的内容:
...
<DrawingGroup>
<DrawingGroup.Children>
<!-- Added transparent "spacer": -->
<GeometryDrawing Brush="Transparent">
<GeometryDrawing.Geometry>
<RectangleGeometry RadiusX="0" RadiusY="0" Rect="0,0,400,400" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<!-- This was here before: -->
<GeometryDrawing Brush="#FFAAFFAA">
<GeometryDrawing.Pen>
<Pen Brush="#FF000000" Thickness="10"
StartLineCap="Flat" EndLineCap="Flat" LineJoin="Miter" />
</GeometryDrawing.Pen>
<GeometryDrawing.Geometry>
<RectangleGeometry RadiusX="0" RadiusY="0" Rect="68,68,264,264" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
...