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

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 今天继续Smobiler开发APP的学习日志,这次是做一个title、toolbar、侧边栏三种效果 样式一一、          Toolbar1.       目标样式我们要实现上图中的效果,需要如下的操作:2.

今天继续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

-----------------END-----------------

Smobiler是一款基于.NET的移动应用开发平台

只需要Visual Studio中进行一次开发

同时支持AndroidiOS两大操作系统

相关实践学习
通过日志服务实现云资源OSS的安全审计
本实验介绍如何通过日志服务实现云资源OSS的安全审计。
相关文章
|
2月前
|
人工智能 文字识别 小程序
旅游社用什么工具收报名 + 资料?不开发 App 也能自动收集信息
本文探讨了旅游行业中报名信息收集的常见痛点及解决方案,重点介绍了二维码表单工具在提升信息收集效率、简化操作流程方面的优势。通过对比多种工具,分析其适用场景与实际应用逻辑,为一线旅游从业者提供高效、低成本的执行参考。
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:外卖App
仓颉语言实战分享,教你如何用仓颉开发外卖App界面。内容包括页面布局、导航栏自定义、搜索框实现、列表模块构建等,附完整代码示例。轻松掌握Scroll、List等组件使用技巧,提升HarmonyOS应用开发能力。
|
3月前
|
IDE 开发工具 开发者
使用DevEcoStudio 开发、编译鸿蒙 NEXT_APP 以及使用中文插件
# 使用DevEcoStudio 开发、编译鸿蒙 NEXT_APP 以及使用中文插件 #鸿蒙开发工具 #DevEco Studio
289 1
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:健身App
本期分享一个健身App首页的布局实现,顶部采用Stack容器实现重叠背景与偏移效果,列表部分使用List结合Scroll实现可滚动内容。代码结构清晰,适合学习HarmonyOS布局技巧。
|
3月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:银行App
仓颉语言银行App项目分享,页面布局采用List容器,实现沉浸式体验与模块化设计。顶部资产模块结合Stack与Row布局,背景图与内容分离,代码清晰易懂;功能按钮部分通过负边距实现上移效果,圆角仅保留顶部;热门推荐使用header组件,结构更规范。整体代码风格与ArkTS相似,但细节更灵活,适合金融类应用开发。
|
3月前
|
安全 新制造
不用开发APP,也能实现设备巡检自动提醒和记录归档
设备巡检新方案!告别纸质表格,用二维码轻松搞定自动提醒和记录归档。某工厂分享如何通过草料二维码实现一物一码、扫码填写巡检信息,自动生成数据归档,还能设置定期提醒,确保巡检任务按时完成。无需额外开发 App,低成本高效管理,为设备巡检提供简单又实用的解决方案。
|
9月前
|
监控 前端开发 API
一款基于 .NET MVC 框架开发、功能全面的MES系统
一款基于 .NET MVC 框架开发、功能全面的MES系统
211 5
|
开发框架 前端开发 JavaScript
ASP.NET MVC 教程
ASP.NET 是一个使用 HTML、CSS、JavaScript 和服务器脚本创建网页和网站的开发框架。
193 7