欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-03-04 13:26:21
今天继续Smobiler开发APP的学习日志,这次是做一个title、toolbar、侧边栏三种效果 样式一 一、 Toolbar 1. 目标样式 我们要实现上图中的效果,需要如下的操作: 2. 修改属性 a. 修改Mobile Form的Toolbar属性 获取窗体底部工具栏,打开集合编辑器,并点 ......

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

 

样式一

一、          toolbar

1.       目标样式

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

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

2.       修改属性

a.         修改mobile form的toolbar属性

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

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

图 1设置界面1

 

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

图 2设置界面2

 

b.         修改mobile form的toolbarstyle属性

其中包括selectstyle属性(是否选择默认样式)、backcolor属性(控件背景色)、forecolor属性(控件文本颜色)、selectbackcolor属性(控件选择状态背景色)和selectforecolor属性(控件选择状态文本颜色)。

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

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

图 3设置界面

 

将backcolor属性设置为“white”,如图 4;

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

图 4设置界面

 

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

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

图 5设置界面

 

将selectbackcolor属性设置为“white”,如图 6;

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

图 6设置界面

 

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

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

图 7设置界面

 

3.     手机效果显示

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

 

二、          title

1.       修改属性

a.         修改mobile form的titletext的属性

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

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

图 8设置界面

 

b.         修改mobile form的titlestyle属性

其中包括image属性(窗体图标)、backcolor属性(窗口标题栏背景色)、textcolor属性(窗口标题栏文本颜色)和textalign属性(窗体标题栏文本水平方向)。

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

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

图 9设置界面

 

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

图 10显示界面

 

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

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

图 11设置界面

 

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

图 12显示界面

 

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

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

图 13设置界面

 

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

图 14显示界面

 

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

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

图 15设置界面

 

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

图 16显示界面

 

2.       手机效果显示

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

 

三、          leftform

1.       目标样式

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

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

2.       修改属性

a.         修改mobile form的leftformlayout属性

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

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

图 1设计界面

 

再将mobile form的leftformlayout属性,绑定新建的窗体messageshow,如图 2;

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

图 2设置界面2

 

b.         修改mobile form的layoutmode属性

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

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

图 3设置界面

 

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

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

图 4设置界面

 

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

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

图 5设置界面

 

3.       手机效果显示

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