用Windows 8.1的童鞋应该知道OneNote里面有一个RadialMenu。如下图，下图是WIn10应用Drawboard PDF的RadialMenu，Win8.1的机器欠好找了。哈哈，由于整个文章对照长，大家可以放《给我一首歌的时间》 边听边看。<风趣>
从设计到开发包孕修复一些bug，，概略用了不持续的2个月，想看源代码的童鞋可以先到 RadialMenu 检察效果和代码。
先放上项目里面的最终效果
下面说下整个的过程
1.构造
首先，可以看到这个控件一个圆盘形状的东东，在点击子菜单的时候，菜单变革，并且带有duangduangduang的特效。
先来看看RadialMenu的ControlTemplate
<ControlTemplate TargetType="local:RadialMenu"> <!--<Popup x:Name="Popup" IsLightDismissEnabled="False" IsOpen="{TemplateBinding IsOpen}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">--> <Grid x:Name="Root" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"> <Grid x:Name="ContentGrid"> <Ellipse Fill="{TemplateBinding Background}" StrokeThickness="{TemplateBinding ExpandAreaThickness}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/> <local:RadialMenuItemsPresenter x:Name="CurrentItemPresenter" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ItemsSource="{Binding CurrentItem.Items,RelativeSource={RelativeSource TemplatedParent}}" > <local:RadialMenuItemsPresenter.ItemsPanel> <ItemsPanelTemplate> <local:RadialMenuPanel/> </ItemsPanelTemplate> </local:RadialMenuItemsPresenter.ItemsPanel> </local:RadialMenuItemsPresenter> </Grid> <local:RadialMenuNavigationButton x:Name="NavigationButton" Width="{TemplateBinding RadialMenuNavigationButtonSize}" Height="{TemplateBinding RadialMenuNavigationButtonSize}" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Grid> <!--</Popup>--> </ControlTemplate>
View Code一共三个对象，
1）Ellipse -整个RadialMenu的外形以及配景
2）RadialMenuItemsPresenter-用来展示各个菜单
3）RadialMenuNavigationButton-中间阿谁导航的按钮
1，3应该对照好理解，大家看看代码就能大白。
我着重讲下2，这个也是开发一个自界说控件对照重要的操纵，就是知道怎么按本身的想法去构造。
RadialMenuItemsPresenter 担任ItemsControl，它的ItemsPanel是RadialMenuPanel。
<local:RadialMenuItemsPresenter x:Name="CurrentItemPresenter" ItemsSource="{Binding CurrentItem.Items,RelativeSource={RelativeSource TemplatedParent}}" > <local:RadialMenuItemsPresenter.ItemsPanel> <ItemsPanelTemplate> <local:RadialMenuPanel/> </ItemsPanelTemplate> </local:RadialMenuItemsPresenter.ItemsPanel> </local:RadialMenuItemsPresenter>
RadialMenuPanel 就是我们最重要控制怎么展示RadialMenuItemsPresenter 的Items。
重写过的Panel 同学必然知道MeasureOverride ,ArrangeOverride 这2个对象。如果不清楚的必然要去看看葡萄城控件技术团队的2篇文章 Measure,Arrange。看过之后你将对这2个要领有新的了解，对控件的构造越发清晰。
下面请看我优(丑)美(陋)的手画图
A菜单将它Arrange到图中位置，B菜单也放到同样的位置，但是给它做必然的旋转。按做这种道理，把全部的菜单都Arrange到控件的中上位置，并且给他们都做必然的旋转，这样就构成了整个的圆弧，这个递增的角度就是 360°除以菜单的个数。
具体的代码，请看ArrangeChildren要领。
2.每个菜单的设计
RadialMenuItem -最根本的显示文字，图片等等
RadialColorMenuItem-用于显示颜色
RadialNumericMenuItem-用于显示数字，它的子集是RadialNumericMenuChildrenItem，是一个内部的类。
下来还是从我优(丑)美(陋)的手画图开始介绍布局吧
蓝色的线是整个item的最外边，黄色是展开子菜单的按钮的中线。