鸿蒙仓颉语言开发教程:自定义弹窗

简介: 假期第一天,祝大家端午节快乐!继续分享仓颉语言开发教程,介绍如何通过CustomDialogController实现自定义弹窗,包括参数设置与代码示例,帮助开发者掌握弹窗的使用技巧。

假期第一天,祝大家端午节快乐。昨天观看了时代旗舰尊界S800的发布,不得不感慨这车真好啊~
放假闲来无事,继续跟大家分享仓颉语言的开发教程,今天介绍一下自定义弹窗。
仓颉语言中的自定义弹窗和ArkTs类似,但是还是有一些不同的地方。
在仓颉中通过CustomDialogController实现自定义弹窗,在弹窗中使用构造函数CustomDialogControllerOptions来传递弹窗的所有参数,为大家贴一段演示代码:

var dialogController: CustomDialogController = CustomDialogController(CustomDialogControllerOptions(
  builder: loadingdialog(),
  customStyle:true,
  autoCancel:false
  ))

然后为大家介绍自定义弹窗的各种常见属性和使用方式:
customStyle:表示弹窗样式是否自定义,设置为false时,弹窗高度最多占屏幕的90%。设置true时,弹窗可以占满整个屏幕。
autoCancel:点击空白区域是否自动消失
alignment:弹窗的对齐方式
offset:弹窗的位置偏移量
gridCount:弹窗宽度占格栅的个数,越大越宽
maskColor:自定义蒙层的颜色
cornerRadius:设置背板的圆角半径
以上就是自定义弹窗常用的一些属性,大家可以按需设置。
初始化完成后的弹窗可以使用open和close方法来打开和关闭:

dialogController.open()
dialogController.close()

在仓颉中一些参数的写法也和ArkTs不太相同,比如cancel回调方法,比如颜色的设置。还要注意的是,@CustomDialog实现的自定义弹窗的所有参数是不支持动态刷新的,这一点不太方便,幽蓝目前也正在寻找更加方便的弹窗方式。
下面为大家分享一段完整的半透明文字提示弹窗的实现代码,先看下效果:
image.png

下面是实现代码:

var dialogController: CustomDialogController = CustomDialogController(CustomDialogControllerOptions(
  builder: loadingdialog(),
  gridCount:3,
  customStyle:true,
  autoCancel:false,
  maskColor:Color(0, 0, 0, alpha: 0.0),
  cancel:{ => AppLog.info('关闭回调') }
  ))


package ohos_app_cangjie_entry.components
import ohos.base.*
import ohos.component.*
import ohos.state_manage.*
import ohos.state_macro_manage.*
import cj_res_entry.app
@CustomDialog
public  class loadingdialog {
    var controller: Option<CustomDialogController> = Option.None
    func build() {
        Row() {
            Text('这是一个提示')
            .fontColor(Color.WHITE)
            .fontSize(15)
        }.height(200).width(200).alignItems(VerticalAlign.Center).justifyContent(FlexAlign.Center).backgroundColor(0x80000000).borderRadius(10)
    }
}

以上就是关于仓颉开发语言自定义弹窗的内容介绍,感谢阅读。##HarmonyOS语言##仓颉##购物#

相关文章
|
2月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
304 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
2月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
270 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
6月前
|
容器
HarmonyOS NEXT仓颉开发语言实战案例:外卖App
仓颉语言实战分享,教你如何用仓颉开发外卖App界面。内容包括页面布局、导航栏自定义、搜索框实现、列表模块构建等,附完整代码示例。轻松掌握Scroll、List等组件使用技巧,提升HarmonyOS应用开发能力。
|
2月前
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
631 4
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
5月前
|
安全 JavaScript API
鸿蒙开发核心要素
鸿蒙开发核心要素
|
6月前
|
存储 IDE 定位技术
【HarmonyOS 5】鸿蒙组件&模板服务详解 - 助力高效开发的利器
在移动应用开发领域,效率与质量始终是开发者追求的核心目标。鸿蒙系统作为新兴的操作系统,为开发者提供了丰富且强大的开发资源,其中鸿蒙组件&模板服务更是成为开发者快速构建高质量应用的得力助手。
233 0
|
2月前
|
移动开发 Android开发
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
165 0
|
3月前
|
存储 缓存 5G
鸿蒙 HarmonyOS NEXT端云一体化开发-云存储篇
本文介绍用户登录后获取昵称、头像的方法,包括通过云端API和AppStorage两种方式,并实现上传头像至云存储及更新用户信息。同时解决图片缓存问题,添加上传进度提示,支持自动登录判断,提升用户体验。
186 1
|
3月前
|
存储 负载均衡 数据库
鸿蒙 HarmonyOS NEXT端云一体化开发-云函数篇
本文介绍基于华为AGC的端云一体化开发流程,涵盖项目创建、云函数开通、应用配置及DevEco集成。重点讲解云函数的编写、部署、调用与传参,并涉及环境变量设置、负载均衡、重试机制与熔断策略等高阶特性,助力开发者高效构建稳定云端服务。
409 1
鸿蒙 HarmonyOS NEXT端云一体化开发-云函数篇
|
3月前
|
存储 JSON 数据建模
鸿蒙 HarmonyOS NEXT端云一体化开发-云数据库篇
云数据库采用存储区、对象类型、对象三级结构,支持灵活的数据建模与权限管理,可通过AGC平台或本地项目初始化,实现数据的增删改查及端侧高效调用。
190 1

热门文章

最新文章