如何构建以下视觉效果

Question

我不是真正的设计师，我想知道是否有人知道如何构建以下视觉效果：

我的想法是获得2个环，在里面我将绘制表示为“交互式形状或按钮”的特定数量的饼图。根据形状的数量，它们应覆盖整个圆圈。

除此之外，我需要能够与每个饼形状相互作用，并且这些形状的内部和外部边缘应该是基于圆直径的完美弧形。

由于我不是一个完美的设计师，我怎么能代表这种视觉效果？ 我正在考虑使用自定义面板，但是如何绘制每个面板形状，以便它们在内部和外部弧形中完美并提供与它们中的每一个的交互性？

感谢您的帮助  我也很欣赏样品

Answer 1

我建议您查看WPF Geometry以及如何使用所述几何图形创建自定义控件（例如CodeProject上的Circular Gauge Custom Control）。

我从来没有像你建议的那样创建一个控件，但是我会想象你会定义某种形式的区域，它可以包含孩子并设计它，使它形成你想要的圆形。然后，添加交互式区域应该像向标准容器添加控件一样简单。

Answer 2

Theres实际上是一个关于制作完全类似内容的Silverlight教程。

如果您不想使用它，您可以随时在javascript中执行此操作。以下是使用Rapheal js

的示例

Answer 3

这是一个link到“通用径向面板，可用于托管任何项目”，其子类为Panel。