当前位置: 首页 > news >正文

鸿蒙应用开发从入门到实战(二十一):ArkUI自定义弹窗组件

大家好,我是潘Sir,持续分享IT技术,帮你少走弯路。《鸿蒙应用开发从入门到项目实战》系列文章持续更新中,陆续更新AI+编程、企业级项目实战等原创内容、欢迎关注!

上一篇文章讲述了ArkUI提供的各种内置弹窗组件,当项目中遇到这些组件仍然不满足需求时,可以使用自定义弹窗组件。本文研究自定义弹窗组件的使用。

一、概述

当现有组件不满足要求时,可考虑自定义弹窗,自定义弹窗允许开发者自定义弹窗内容和样式。例如

1自定义弹窗

示例代码

pages/component/dialog/新建CustomDialogPage.ets文件

@Entry
@Component
struct CustomDialogPage {@State answer: string = '?'controller: CustomDialogController = new CustomDialogController({builder: TextInputDialog({confirm: (value) => {this.answer = value;}}),alignment: DialogAlignment.Bottom,offset: { dx: 0, dy: -30 }})build() {Column({ space: 50 }) {Row() {Text('1+1=').fontWeight(FontWeight.Bold).fontSize(30)Text(this.answer).fontWeight(FontWeight.Bold).fontSize(30)}Button('作答').onClick(() => {this.controller.open();})}.width('100%').height('100%').justifyContent(FlexAlign.Center)}
}@CustomDialog
struct TextInputDialog {controller: CustomDialogController = new CustomDialogController({ builder: TextInputDialog() })confirm: (value: string) => void;value: string = '';build() {Column({ space: 20 }) {Text('请输入你的答案')TextInput({ placeholder: '请输入数字' }).type(InputType.Number).onChange((value) => {this.value = value;})Row({ space: 50 }) {Button('取消').onClick(() => {this.controller.close();})Button('确认').onClick(() => {this.confirm(this.value);this.controller.close();})}}.padding(20)}
}

二、使用说明

显示自定义弹窗需要使用CustomDialogController

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V2/arkts-common-components-custom-dialog-0000001450754206-V2

《鸿蒙应用开发从入门到项目实战》系列文章持续更新中,陆续更新AI+编程、企业级项目实战等原创内容,防止迷路,欢迎关注!

http://www.hskmm.com/?act=detail&tid=30705

相关文章:

  • 2025 年北京开锁机构推荐:北京锁王开锁有限公司,您身边的锁具安全专家
  • jeecg vue2前端组件
  • 2025年空天信息感知与智能处理国际学术会议(AIPIP 2025)
  • svn常用命令命令
  • 2025 年防撞护栏生产厂家最新推荐榜单:深度剖析各企业产品质量与服务能力,Q235/Q355B/景观/灯光/河道桥梁防撞护栏厂家推荐
  • 人类一败涂地Mac版下载教程|Human Fall Flat Mac安装与游戏玩法详解
  • 第二届航空航天、机械与材料工程国际学术会议 (AMME 2025)
  • 从Salesforce到国产CRM,纷享销客助力顺祥新材料提速提效
  • 再见 Navicat!DataGrip 正式宣布免费!!
  • 蓝牙语音遥控器方案 NRF52840、HS6621
  • 创意技术专家指南:如何融合编程与创造力
  • 2025 年桥梁护栏厂家最新推荐排行榜:聚焦防撞、景观、不锈钢、铝合金、灯光护栏,精选优质企业助力项目高效选型
  • 2025 年最新推荐!覆盖上海广州杭州等多地的居民同城长途异地跨城日式国际搬家公司优质服务排行榜
  • 完整教程:第 5 篇:WebGL 从 2D 到 3D - 坐标系、透视与相机
  • CUDA+torch+flash-attn安装
  • 2025 年离合器厂家最新推荐排行榜:聚焦国内优质厂商,从技术到服务多维度解析,助力企业精准选购矿山/气胎/通风式/推盘离合器厂家推荐
  • 2025 年离心机厂家最新推荐排行榜:聚焦平板 / 吊袋 / 刮刀 / 拉袋等多类型设备,精选优质企业助力用户精准选型
  • 共模电压测量:原理、方法与应用探析
  • ​​差分探头技术解析:高精度电子测量的核心工具​​
  • LGP9869 [NOIP 2023] 三值逻辑 学习笔记
  • Windows 程序开机自启的方法
  • 详细介绍:全球资本开支激增,就业增长停滞:AI时代的双刃剑
  • 2025 年昆明商务车总代理推荐艾维诺:16 年深耕高端定制与销售,奔驰丰田等品牌优选服务商
  • java面向对象
  • Chrome 安装失败且提示“无可用的更新” 或 “与服务器的连接意外终止”,Chrome 离线版下载安装教程
  • keepalived日志报错Error exec-ing command /usr/local/keepalived/chk.sh, error 8: Exec format
  • 2025 年国内树脂瓦厂家最新推荐排行榜:聚焦品质与服务,助力建筑屋面选材更可靠PVC/asa 加厚合成 / FRP/PET 树脂瓦厂家推荐!
  • 2025 年隔音板厂家最新推荐排行榜:阻尼 / 聚酯纤维 / 室外等多品类适配,聚焦口碑厂商与一站式服务
  • 2025-10-13
  • 剑指offer-34、第⼀次出现的字符