HarmonyOS实战——CommonDialog组件的基本使用 原创 精华
兮动人
发布于 2021-8-27 09:21
1.6w浏览
4收藏
Table of Contents
弹框组件
- 在HarmonyOS当中,常用的弹框主要有两种:
- 第一种是普通弹框(
CommonDialog
),提示用户并让用户进行对应的操作的,比如使用打车软件的时候,如果手机没有开定位,就会有弹框提示,让你在手机中开启定位,这就是一个普通弹框,给你作为一个信息的提示,并且做一些操作。
2. 第二种消息提示弹框(ToastDialog
),如:在每次打开“小破站”APP的时候,都会弹出提示,这些也是弹框。这些弹框不需要用户选择的,只是告诉用户一些消息而已
1. CommonDialog 组成和使用
- 在鸿蒙当中,这种普通和弹框其实是有默认布局的
- 下面的选择按钮最多只有三个
- 弹框并不是APP启动时立马弹出来的,一般会有两种情况:
- 点击按钮的时候会弹出来
- 当程序满足一定要求的时候也会弹出来
项目案例:
- 新建项目:
DialogApplication
ability_main
MainAbilitySlice
- 运行:
- 点击后:
- 当再次点击
灰色区域
也没有反应 - 点击或
取消
按钮时没有任何反应,因为在上面的那里设置了null
一般点击弹框的两种情况:
- 点击灰色区域也不能取消,必须点击取消按钮才能取消弹框
- 点击灰色区域或取消按钮都能达到取消弹框的效果
下面就实现上面这两种情况:
-
点击灰色区域也能取消按钮的情况,在上面的代码基础上补充如下
-
当鼠标点击取消按钮的时候也能让弹框消失,把上面设置取消按钮的
null
设置为:
- 运行,点击后:
- 实现了上面的两种情况
2. CommonDialog 自定义布局使用
- CommonDialog 里面有默认的布局,布局由如下三部分组成:
- 所以只要直接调用方法给里面设置一些文本内容就可以了
- 下面就介绍下自定义弹框里的内容
案例如下:在主界面上有一个按钮,点击了一个按钮后会出现弹框
- 弹框里面有三个东西:一行文本和两个按钮
- 当点击了 确定 按钮后,上面的文本就会变成“点击了确定按钮”,当点击了 取消 按钮后弹框就会消失
下面就实现下:
- 新建项目:
DialogLayoutApplication
ability_main
- 弹框里面的内容也可以用 xml 来写,新建一个布局文件
- 文件名不能是大写的
- 上面的弹框组成:一个Text文本+两个Button
- 生成弹框的布局文件后,首先改下布局文件的大小,默认的就是充满整个屏幕的,改为包裹内容的就行了
- 文本的内容因为是变化的,所以在java代码那里进行设置
- 两个按钮如果不设置外边距的话就会挤在一起,所以要加个上往外边距
messagedialog
MainAbilitySlice
- 运行:
- 点击后,就会弹出弹框
- 点击弹框中的确定按钮后,文本内容发生改变
- 点击取消按钮后,弹框消失,恢复到原界面
3. 优化代码——抽取弹框工具类
-
在工作当中,如果需要用多个弹框,而每次都和上面一样写的话,就会造成代码冗余,不方便管理
-
下面就把弹框抽取成一个工具类,当用到一个弹框的时候,直接调用工具类中的方法就可以了
-
创建一个工具类
-
创建一个弹框的工具类:
MyDialog
-
当外界调用了这个方法之后,就会出现一个弹框
-
把上面的 OnClick 方法中的代码剪切到上面的 showDialog 方法中
-
粘贴过来后,MyDialog类中部分代码修改如下
-
MainAbilitySlice类中修改如下,直接调用
MyDialog
中的方法,传递参数就行了
-
运行:
-
点击确定按钮后,发现Text文本内容是刚刚方法中传递过来
©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
已于2021-8-27 09:21:38修改
赞
6
收藏 4
回复
6
3
4
相关推荐
两种弹框都经常在手机上遇见,很实用的功能,感谢分享。
多谢小伙伴的支持,一起进步!😊
多谢小伙伴的支持,一起进步!😄