MobileForm控件的使用方式-用.NET(C#)开发APP的学习日志

今天继续Smobiler开发APP的学习日志,这次是做一个title、toolbar、侧边栏三种效果

样式一

一、          Toolbar

1.       目标样式

c1e19962dda44ffb8175910ac3a92f73.png

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

2.       修改属性

a.         修改Mobile Form的Toolbar属性

获取窗体底部工具栏,打开集合编辑器,并点击“添加”,分别填写数据,如图 1、图 2;

67c712f867894255b8413c268af83ffc.png

图 1设置界面1

1edbea1e05924cec8a462f148077a093.png

图 2设置界面2

b.         修改Mobile Form的ToolbarStyle属性

其中包括SelectStyle属性(是否选择默认样式)、BackColor属性(控件背景色)、ForeColor属性(控件文本颜色)、SelectBackColor属性(控件选择状态背景色)和SelectForeColor属性(控件选择状态文本颜色)。

SelectStyle属性默认设置为“Select”,表示不选择默认样式,如图 3;

b288d881ee254c85a364c00fa8d13adc.png

图 3设置界面

将BackColor属性设置为“White”,如图 4;

44be3b90b6a54db89bdb7d9b575873fd.png

图 4设置界面

将ForeColor属性设置为“155, 157, 177”,如图 5;

329e31acd9654b74b366a8a7dcc95c31.png

图 5设置界面

将SelectBackColor属性设置为“White”,如图 6;

0c33bcfe6fe9486f8714013b5664ec9c.png

图 6设置界面

将SelectForeColor属性设置为“0, 183, 250”,如图 7;

6bffd2ac87c84459b9eee9845c205b2b.png

图 7设置界面

3.     手机效果显示

f5474a3443fe497d92c04ed7b9e79743.jpg

二、          Title

1.       修改属性

a.         修改Mobile Form的TitleText的属性

输入需要显示标题,如图 1;

2850b86d8bfe40bdbbc73e1e7b88c48e.png

图 8设置界面

b.         修改Mobile Form的TitleStyle属性

其中包括Image属性(窗体图标)、BackColor属性(窗口标题栏背景色)、TextColor属性(窗口标题栏文本颜色)和TextAlign属性(窗体标题栏文本水平方向)。

若将Image属性设置为“coms”如图 2、图 3;

b069ee8ca02140d4849a777bc333da5a.png

图 9设置界面

e92bd8f4c7194e7dbee3bfbf78b55173.jpg

图 10显示界面

若将BackColor属性设置为“DeepSkyBlue”,如图 11、图 1;

a3ab7bcd908a4515aa090aab26cfd53e.png

图 11设置界面

671120784bcb4df49ef0c51f4e953cd6.jpg

图 12显示界面

若将TextColor属性设置为“Red”,如图13、图 14;

8789da1b0d1d4953b5579c0b9be528ab.png

图 13设置界面

8f4c37eb62b7432fb3bf2cd6f45d4a59.jpg

图 14显示界面

若将TextAlign属性设置为“Left”,如图 15、图 16;

96c62b2fabe646d09f50655be7c11af5.png

图 15设置界面

d53d162ce2b94ca986f67f7aeda57965.jpg

图 16显示界面

2.       手机效果显示

340e0b337f924ed3a651f861dc69ece3.jpg

三、          LeftForm

1.       目标样式

b4a726afc0cd4c17bcf804a501528047.jpg

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

2.       修改属性

a.         修改Mobile Form的LeftFormLayout属性

获取和设置左侧边栏对应的布局名称,首先新建MobileForm项,并命名为MessageShow,设计界面,如图 1;

005620b967eb45449b8bee6de6cd4492.png

图 1设计界面

再将Mobile Form的LeftFormLayout属性,绑定新建的窗体MessageShow,如图 2;

13707c75bffc4f39a0d985d93f56521c.png

图 2设置界面2

b.         修改Mobile Form的LayoutMode属性

获取和设置侧边栏显示样式。默认设置为“NORMAL”,如图 3;

b971e4b0889a4eaabec2958719d48f6d.jpg

图 3设置界面

将该属性设置为“EFFACT3D”,如图 4;

182afd4d71c34d4d8eaa45180acb1596.jpg

图 4设置界面

将该属性设置为“FLOATUP”,如图 5;

95e8882ed1e74a7b9d2a83fa7b463ba3.jpg

图 5设置界面

3.       手机效果显示

f183edaaf6604c2e8ab6b60149c1b801.jpg

猜你喜欢

转载自www.cnblogs.com/amanda112/p/10711818.html