HarmonyOS NEXT 案例实战之弹框组件: 简化代码抽取工具类介绍
应用使用场景
在应用开发过程中，频繁使用的功能或模块如果每次都单独实现，会导致代码冗余、维护困难。通过将这些功能抽取为工具类，可以提高代码复用性和可维护性。具体到 CommonDialog 弹框组件，适用场景包括：
- 多个界面需要使用相似的对话框。
- 需要保证对话框外观和行为的一致性。
- 需要简化弹框调用的代码逻辑。
原理解释
工具类是一种设计模式，它将常用的函数或方法封装在一个类中，以便于在整个项目中重复调用。这有助于减少代码重复，提高代码清晰度，并使得应用程序更易于维护和扩展。
算法原理流程图
+-------------------------+
| 定义工具类 |
+-----------+-------------+
|
v
+-------------------------+
| 编写通用对话框方法 |
| 包括内容、按钮等参数 |
+-----------+-------------+
|
v
+-------------------------+
| 各模块调用工具类方法 |
| 传递特定参数显示对话框 |
+-----------+-------------+
|
v
+-------------------------+
| 显示并处理用户交互 |
+-------------------------+
算法原理解释
- 定义工具类：创建一个专门的类，用于封装对话框相关方法。
- 编写通用对话框方法：在工具类中定义一个或多个方法，允许自定义对话框内容、按钮及其行为。
- 各模块调用工具类方法：不同模块或页面可以通过调用工具类的方法来实例化所需的对话框。
- 显示并处理用户交互：根据业务逻辑显示对话框并响应用户输入。
ArkTS + ArkUI 代码示例实现
// DialogUtil.ts
import { CommonDialog } from '@ohos/ui';
export class DialogUtil {
// 静态方法展示简单提示对话框
static showInfoDialog(title: string, message: string, onConfirm: () => void) {
const dialog = new CommonDialog({
title: title,
message: message,
buttons: [
{
text: '确定',
action: onConfirm
}
]
});
dialog.show();
}
// 静态方法展示带取消的确认对话框
static showConfirmDialog(title: string, message: string, onConfirm: () => void, onCancel: () => void) {
const dialog = new CommonDialog({
title: title,
message: message,
buttons: [
{
text: '取消',
action: onCancel
},
{
text: '确定',
action: onConfirm
}
]
});
dialog.show();
}
}
// 使用工具类显示对话框
DialogUtil.showInfoDialog('信息', '操作成功', () => console.log('用户确认'));
DialogUtil.showConfirmDialog('确认', '确定要删除吗？',
() => console.log('用户确认删除'),
() => console.log('用户取消删除'));
测试代码与部署场景
- 测试代码：编写测试用例验证工具类方法的输出和行为，确保参数传递和对话框呈现正确。
- 部署场景：在不同设备上运行应用，确保工具类封装的对话框在各种分辨率下正常工作。
材料链接
总结
通过使用工具类来管理 CommonDialog 的创建和显示，我们可以有效地提高代码重用性和一致性。此方法不仅简化了开发过程，还增强了代码的可读性和可维护性。
未来展望
随着项目规模的增大，工具类可能需要支持更复杂的对话框配置和更多的自定义选项。同时，通过结合 AI 能力，未来工具类或许能够智能推荐常用对话框模板，进一步提升开发效率。
