.Net语言 APP开发平台——Smobiler学习日志：如何在手机上开发仪表盘控件

最前面的话：Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台，也许比Xamarin更方便

一、目标样式

我们要实现上图中的效果，需要如下的操作：

1.从工具栏上的“Smobiler Components”拖动一个GaugeView控件到窗体界面上

2.修改GaugeView控件的属性

a.AxisLines属性

设置仪表盘轴线段，打开集合编辑器，并点击"添加"，Color属性（仪表盘轴线段的颜色）和SplitNumRate属性（仪表盘轴线段占总线段的比例，取值0-1），如图1、图2；

b.AxisLineVisiable属性

设置是否显示仪表盘轴线，默认设置为“True”，如图3；

c.AxisLineWidth属性

设置仪表盘轴线宽度，将该属性设置为“4”，如图4；


图1	图2	图3	图4

d.AxisTickColor属性

设置仪表盘刻度线颜色，默认设置为“White”，如图5；

e.AxisTickLength属性

设置仪表盘刻度线长度，将该属性设置为“2”，如图6；

f.AxisTickSplitNum属性

设置仪表盘轴线内的分割刻度数，默认设置为“5”，如图7；

g.AxisTickVisiable属性

设置是否显示仪表盘刻度线，默认设置为“True”，如图8；


图5	图6	图7	图8

h.EndAngle属性

设置仪表盘结束角度，默认设置为“-45”，如图9；

i.Location属性

让控件显示在合适的位置（5, 37），如图10；

j.MaxValue属性

设置仪表盘最大值，将该属性设置为“150”，如图11；

k.MinValue属性

设置仪表盘最小值，默认设置为“0”，如图12；


图9	图10	图11	图12

l.PointerColor属性

设置指针颜色，将该属性设置为“255, 128, 128”，表示RGB颜色，如图13；

m.PointerLength属性

设置指针长度，将该属性设置为“40”，如图14；

n.PointerVisiable属性

设置是否显示仪表盘指针，默认设置为“True”，如图15；

o.PointerWidth属性

设置指针宽度，将该属性设置为“10”，如图16；


图13	图14	图15	图16

p.Size属性

设置控件的宽度和高度，将该属性设置为（108, 75），如图17；

q.SplitLineColor属性

设置仪表盘分割线颜色，默认设置为“White”，如图18；

r.SplitLineLength属性

设置仪表盘分割线长度，将该属性设置为“4”，如图19；

s.SplitLineVisiable属性

设置是否显示仪表盘分割线，默认设置为“True”，如图20；


图17	图18	图19	图20

t.SplitNum属性

设置仪表盘刻度的分割段数，默认设置为“10”，如图21；

u.StartAngle属性

设置仪表盘的起始角度，默认设置为“225”，如图22；

v.Text属性

设置仪表盘文本，将该属性设置为“2.3%”，如图23；

w.TextForeColor属性

设置仪表盘文本颜色，将该属性设置为“255, 128, 128”，表示RGB颜色，如图24；


图21	图22	图23	图24

s.Title属性

设置仪表盘标题，将该属性设置为“绩效完成率”，如图25；

y.TitleForeColor属性

设置仪表盘标题的文本颜色，默认设置为“Black”，如图26；

z.Value属性

设置仪表盘指针值，将该属性设置为“2.3”，如图27；


图25	图26	图27

二、手机效果显示