在画布上创建透明对象以通过 z-index 覆盖上一个对象答案

【问题标题】：Create transparent object on canvas to overlay previous object by z-index在画布上创建透明对象以通过 z-index 覆盖上一个对象
【发布时间】：2020-06-30 08:16:59
【问题描述】：

用增强现实的东西创建 WPF 应用程序，有一个麻烦。我有几个 Z 层的用户控件，第一个是实时视频（用于用户控制的简单图像），第二个是 Canvas。我已经映射了骨骼关节以在画布上绘制它和骨骼。但我需要绘制与关节偏移的骨骼。由于任务的技术要求，我需要在没有代码隐藏的情况下创建它。最简单的解决方案是在画布上绘制映射到关节位置的透明椭圆，这将覆盖线条以表示骨骼。由于视频，透明度是必要的。

所以，主要问题是如何在 WPF Canvas 上设计透明对象，通过 XAML 的 Z-index 覆盖画布上的对象？

【问题讨论】：

<Ellipse Fill="Transparent" Panel.ZIndex="1000" .../> - 你到底尝试了什么？
@Clemens，感谢您的回复。我需要对背景图像透明的椭圆，但会覆盖画布上的其他对象。

标签： wpf xaml canvas transparency

【解决方案1】：

通过设置附加属性Canvas.ZIndex 控制Canvas 上的对象分层。默认值为 0，即最底层。
将UIElement.Opacity 设置为 0 和 1 之间的值可控制不透明度从透明变为实心：

<Canvas>
  <Ellipse Height="50" Width="50" Fill="Blue" 
           Canvas.ZIndex="1" Canvas.Left="25" />
  <Ellipse Height="50" Width="50" Fill="Yellow" />
  <Ellipse Height="50" Width="50" Fill="Red" 
           Canvas.ZIndex="2" Canvas.Left="50" 
           Opacity="0.7" />
</Canvas>

【讨论】：