WPF Custom Panel/Control Creation -- "The Doughnut"

Question

I'm hoping to create a custom panel or control that creates a very particular type of item.

Basically, the intent is to have a control that you can give a list of objects to, and it will put each of those objects into a button. The catch is that the buttons should be laid out in a circle like a doughnut. Similar to the image below.

But now imagine, if you can, that each of those colored sections was a button. They would have all of the functionality of buttons too, like mouseovers and events.

So, the brunt of the question is: What sort of techniques should I be looking at to create this kind of control? Is there a way to do some sort of "curvature" transform on a button?

It really seems like I'm looking for two separate things here, right?

I mean, I could put each item in the list into an ItemsControl that had a button as its ItemTemplate. So all I would need is two things:

The first of which is a radial layout Panel (I've seen a few of those around).

The second of which is a way to have each button have some sort of rotation and curvature transform.

Any ideas?

Answer 1

I think you're looking at three distinct steps:

1. A Panel that lays out children around a circle. Importantly, the panel must update read-only attached dependency properties on its children, telling them where they've been laid out (starting position in degrees and ending position in degrees)
2. A Button template that renders in an arc shape according to some starting and ending positions.
3. Combining the two, binding the starting and ending positions for the buttons to the attached values exposed by the panel.