当前位置：文江博客话题详情

WPF 线条、路径..等自定义绘图样式

发布于 2024-08-09 02:23:41 字数 137 浏览 9 评论 0原文

在 WPF 中，有没有一种方法可以修改与 Dash-Dot 序列分开绘制任何路径的方式？假设我想为我正在绘制的任何路径或绘图路径本身上的小三角形、波浪等绘制一条三重线。我已经尝试过画笔，但它不会遵循路径。请帮忙，

谢谢

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

古镇旧梦 2024-08-16 02:23:42

WPF 中不支持执行此操作的方法。该解决方案将涉及复合 Path 对象或花哨的代码隐藏体操。您是否正在专门寻找三线路径实施？

回复收藏 0 原文

平生欢 2024-08-16 02:23:41

WPF 的 Geometry 类具有轻松完成此操作所需的所有基元，但您需要在代码中完成此操作。当我需要进行自定义线条时，我通常会根据 Geometry 构建一个 Drawing，但在您的情况下，您可以简单地构建一个具有以下内容的 Geometry：三条平行线并划线。

从 PathGeometry.CreateFromGeometry() 开始获取输入路径的 PathGeometry
使用 GetWidenedPathGeometry()，传入所需的间距，以获取边缘对应于侧线的新几何体
（可选）如果需要，删除加宽几何体末端的线段
使用 CombinedGeometry 将侧线几何体与原始几何体组合起来
描边组合的几何体以获得三元组线

有关步骤 3 的更多说明：加宽的几何图形在原始线的末端有线段。这会导致在线条末端画一条线，这在许多情况下实际上看起来很美观。如果没有它您的情况看起来会更好，请通过迭代边线几何图形并删除穿过原始路径端点的所有线段来删除它。

如果不删除末端，上面大约需要 8 行代码，如果删除则需要 15 行代码。

使此方便的一个技巧是创建一个附加属性，该属性可以有效地强制其附加到的 Path 控件的 Data 属性。有了这样的附加属性，您需要编写的就是：

<Path TripleStroke.Enable="true" Data="..." />

如果您知道如何实现附加属性并在其中注册处理程序，那么这就是小菜一碟。如果没有，请计划在实现附加属性方法之前花几个小时学习如何编码附加属性以模拟值强制。

更新

我上面描述的基本技术也可以扩展以允许沿路径应用任意模式。有关示例，请参阅表达式设计工具中的自定义画笔。然而，WPF 中没有内置任何内容可以为您执行此操作，因此您需要自己创建它，并且我可以根据经验告诉您，这是一项艰巨的工作。以下是基本步骤：

首先创建一个方法，该方法采用现有绘图的几何以及端盖等的一些参数，并创建一个新的绘图沿着 Geometry 给定的路径重复给定的 Drawing。然后绘制描边路径就很容易了：创建一个 Drawing 来描述自定义描边，然后使用包含 Binding 的 DrawingVisual 显示描边> 使用调用您的转换方法的转换器。

实际实现转换方法：

将源绘图转换为一组 GeometryDrawing 对象（我也支持 ImageDrawing 但那更复杂，因为你需要使用 3D 系统来拉伸图像）。这是通过递归 DrawingGroup 对象、跟踪变换并使用适当的变换构造 GeometryDrawings 来完成的。
删除原始图形“端盖”区域中的几何部分并将其放在一边。
沿着路径迭代，重复复制 GeometryDrawing 对象，并将适当的坐标变换应用于几何中的所有坐标。
使用相同的过程处理几何形状的“端盖”部分。

另请注意，在步骤 1 中，任何 GlyphRunDrawings 均使用 FormattedText.BuildGeometry 进行处理，以创建等效的 GeometryDrawing。

WPF's Geometry classes have all the primitives you need to accomplish this easily, but you will need to do it in code. When I need to do custom lines I usually construct a Drawing based on the Geometry, but in your case you can simply build a Geometry that has three lines in parallel and stroke that.

Start with PathGeometry.CreateFromGeometry() to get a PathGeometry for the input path
Use GetWidenedPathGeometry(), passing in the desired spacing, to get a new geometry whose edges correspond to the side lines
(optional) Remove segments at the end of the widened geometry, if desired
Combine the side line geomerty with original geometry using a CombinedGeometry
Stroke the combined geometry to get a triple line

More explanation on step 3: The widened geometry has line segments at the end of the original line. This causes a line to be drawn across the end of your line, which actually looks aesthetically pleasing in many situations. If your situation would look better without it, remove it by iterating the side line geometry and removing all line segments that pass through the endpoints of the original path.

The above takes about 8 lines of code if you don't strike off the ends, or 15 if you do.

A trick to make this convenient is to create an attached property which effectively coerces the Data property of the Path control it is attached to. With such an attached property, all you need to write is:

<Path TripleStroke.Enable="true" Data="..." />

If you know how to implement attached properties and register handlers in them, this is a piece of cake. If not, plan on spending several hours learning how to code attached properties to simulate value coercion before implementing the attached property approach.

Update

The basic technique I describe above can also be extended to allow an arbitrary pattern to be applied along a path. For an example, see custom brushes in the Expression Design tool. There is nothing built into WPF to do this for you, however, so you'll need to create it yourself, and I can tell you from experience that it is a lot of work. Here are the basic steps:

First create a method that takes a Geometry an existing Drawing, and some parameters for end caps, etc and creates a new Drawing that repeats the given Drawing along the path given by the Geometry. Then it is easy to draw a stroked path: Create a Drawing to describe the custom stroke, then display the stroke using a DrawingVisual that contains a Binding with a converter that calls your conversion method.

To actually implement the conversion method:

Convert the source drawing into a set of GeometryDrawing objects (I also supported ImageDrawing but that is more complicated since you need to use the 3D system to stretch the images). This is done by recursing through DrawingGroup objects, keeping track of transforms as you go, and constructing GeometryDrawings with appropriate transform.
Remove portions of geometry in the "end cap" areas of the original drawing and set them aside.
Iterate along the path, duplicating the GeometryDrawing objects repeatedly with appropriate coordinate transformations applied to all coordinates in the geometry.
Process the "end cap" sections of the geometry using the same procedure.

Also note in step 1 that any GlyphRunDrawings are handled using FormattedText.BuildGeometry to create an equivalent GeometryDrawing.

回复收藏 0 原文

~没有更多了~