鸿蒙HarmonyOS （开发进阶）应用自定义弹窗开发实践

鸿蒙NEXT开发实战往期必看文章：

一分钟了解”纯血版！鸿蒙HarmonyOS Next应用开发！

“非常详细的” 鸿蒙HarmonyOS Next应用开发学习路线！（从零基础入门到精通）

HarmonyOS NEXT应用开发案例实践总结合（持续更新......）

HarmonyOS NEXT应用开发性能优化实践总结（持续更新......）

---

概述

弹窗是应用开发需要实现的基础功能，通常用来展示用户当前需要或用户必须关注的信息或操作，可用于广告、中奖、警告、软件更新等与用户交互响应的操作。在应用开发中，经常需要实现自定义UI和功能要求，系统弹窗往往无法满足需求，此时就需要使用到自定义弹窗了。

自定义弹窗选型

合理选择不同的系统能力实现弹窗，有利于提升应用开发效率，实现更好的功能需求，因此了解自定义弹窗的选型和差异非常重要。在应用开发中，为了选择出合适的弹窗选型，从使用场景上，需要重点关注以下两点：

• 弹窗与界面代码解耦

  在开发业务逻辑时，例如遇到一些网络请求失败的场景，需要触发相应的弹窗提醒用户进行操作，由于在任何页面都有可能触发对应的弹窗，此时弹窗不是与某个页面相关联，这个情况下，就需要弹窗与界面的解耦。

• 弹窗在界面跳转后保留

  在一些权限配置页，用户首次进入应用时会弹出权限配置弹窗，让用户进行操作，此时若点击跳转到隐私详情页面，返回后弹窗需要保留在页面上。

从能力角度，系统提供了四种不同的方式来实现自定义弹窗，分别是CustomDialog、promptAction、UIContext.getPromptAction、Navigation.Dialog，在开发业务时，需要结合每种弹窗的特点来选择弹窗。

• CustomDialog弹窗，必须在@Component struct内部定义，即在UI层创建控制器，当一个页面需要弹出多个自定义弹窗时，就需要创建对应个数的CustomDialogController，这会造成UI层代码冗余，无法做到弹窗与界面的解耦。
• promptAction弹窗，为了解决CustomDialog弹窗的问题，支持了UI元素复用机制@Builder，但依赖UI组件。
• UIContext.getPromptAction弹窗，基于promptAction弹窗演进而来，支持全局自定义弹窗，不依赖UI组件，依赖UIContext，支持在非页面文件中使用，弹窗内容支持动态修改，支持自定义弹窗圆角半径、大小和位置，适合在与页面解耦的全局弹窗、自定义弹窗显示和退出动画等场景下使用。
• Navigation.Dialog弹窗，基于Navigation路由形式，以Component组件页面存在于路由栈中，以进出栈的方式打开或关闭弹窗，可以实现弹窗与UI界面解耦，默认透明显示，适合在切换页面弹窗不消失场景下使用。

上述四种弹窗的使用区别，可以从是否支持弹窗与界面代码解耦、弹窗在界面跳转后是否保留这两个方面去进行对比，总结如下：

	CustomDialog	promptAction	UIContext.getPromptAction	Navigation.Dialog
弹窗与界面代码解耦	不支持	不支持	支持