环形进度条
本节的内容可以参考CaseStudy目录下的文件GaugeEvents.Table。
本节的任务是设计三个环形进度条：
你可能觉得，设计这种环境进度条应该很简单啊，你的感觉没错，如果不追求美观，确实是很简单的。
这个示例为了美观多做了很多工作，我们以其中一个进度条为例，讲述一下其设计过程。
设计步骤
1、首先在MorePointers集合中增加三个指针，Visible属性都设置为False，且都设置一个合适的Value值，方便测试。
2、增加一个共享ValueColors设置，名称为"MyValueColors"，包含四条valueColor：
<colorMap
name="MyValueColors">
<valueColors>
<valueColor value="0" color="OrangeRed"/>
<valueColor value="40" color="DarkOrange"/>
<valueColor value="70" color="Gold"/>
<valueColor value="100" color="LimeGreen"/>
</valueColors>
</colorMap>
如果忘记了如何设置，可以参考：共享ValueColors设置
2、增加一个Range，属性设置如下：
得到进度条的轮廓：
3、再增加一个Range，绑定到MorePointers中的第1个指针，属性设置如下:
<range location="90" colorMapName="MyValueColors" toPointerIndex="0">
<border color="DarkGray"/>
</range>
得到：
如果要求不高的话，这个进度条就算设计完成了。
4、接下来的任务是美化，将进度条的首尾弧形化，增加一个SingleMark，属性设置如下：
<singleMark
location="90"
colorMapName="MyValueColors"
value="0"
length="7"
shapeAngle="-90" orthogonalOffset="-3" shape="Custom">
<customShape startRadius="6" startWidth="12" endRadius="6"
endWidth="12"/>
<border lineStyle="None"/>
</singleMark>
得到：
5、再增加一个SingleMark，属性设置如下：
得到：
如果你隐藏第二个Range，你会发现我们刚刚增加的两个SingleMark是两个半圆，通过这两个半圆让进度条的首尾弧形化：
这里还使用了OrthogonalOffset属性，对于前后移动SingleMark，第一个OrthogonalOffset往后移动了3，第二个OrthogonalOffset往前移动了3。
6、最后一步将进度条轮廓末端弧形化，增加一个SingleMark，属性设置为：
<singleMark location="90" value="100" length="6" shapeAngle="90" orthogonalOffset="3" shape="Custom">
<customShape startRadius="6" startWidth="12" endRadius="6" endWidth="12"/>
<border lineStyle="None"/>
<filling color="160, 176, 208, 231"/>
</singleMark>
得到：
