我正在为 WPF 中的 AR 无人机四轴飞行器制作一个界面。
我需要在我的 HUD 上添加一些东西以使其可用。
HUD 上更先进的控制之一是人工地平线,它告诉飞行员飞行器当前与地平线的对齐情况。
我有这 3 个 PNG
我将移动(飞行器的当前俯仰角)和旋转(飞行器的当前滚动)的第一个图像。
我会将第二张图片放在第一张图片上,这张图片只会围绕中心轴旋转,它在一定程度上有刻度,这将更加形象化飞船的滚动。
我将把最后一个放在第二个之上,这个图像只是一个视觉改进。
然后我想屏蔽第一张图像,以便您只能看到图像 2 中圆圈内的内容。
最后但并非最不重要的是,我想向其中添加一个文本块并显示当前高度
结果看起来像这样
我知道如何旋转和移动图像,但如何将图像相互叠加,以及如何 mask 第一张图像?
编辑:感谢本,我已经走到了这一步:
但我还需要平移图像 Y 位置(飞机的俯仰角)
当我添加翻译变换时,我也翻译了剪辑(蒙版)如何在不移动蒙版的情况下翻译图像?
最佳答案
一个关于如何使用的小示例 DrawingGroups
和一个 ClipGeometry
在里面。
<Grid>
<Image Source="Images\Background.jpg" />
<Image>
<Image.Source>
<DrawingImage>
<DrawingImage.Drawing>
<DrawingGroup>
<DrawingGroup>
<!-- You can rotate a DrawingGroup -->
<DrawingGroup.Transform>
<RotateTransform Angle="-15" CenterX="50" CenterY="50" />
</DrawingGroup.Transform>
<ImageDrawing ImageSource="Images\last.png" Rect="0,0,100,100" />
<DrawingGroup.ClipGeometry>
<EllipseGeometry Center="50,50" RadiusX="25" RadiusY="25" />
</DrawingGroup.ClipGeometry>
</DrawingGroup>
<DrawingGroup>
<ImageDrawing ImageSource="Images\middle.png" Rect="0,0,100,100" />
<ImageDrawing ImageSource="Images\outer.png" Rect="0,0,100,100" />
</DrawingGroup>
</DrawingGroup>
</DrawingImage.Drawing>
</DrawingImage>
</Image.Source>
</Image>
</Grid>
关于wpf - 创建高级 HUD,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6161351/