为了账号安全,请及时绑定邮箱和手机立即绑定

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

标签:
HarmonyOS

假期第一天,祝大家端午节快乐。昨天观看了时代旗舰尊界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实现的自定义弹窗的所有参数是不支持动态刷新的,这一点不太方便,幽蓝目前也正在寻找更加方便的弹窗方式。


下面为大家分享一段完整的半透明文字提示弹窗的实现代码,先看下效果:


https://img1.sycdn.imooc.com/f7953068094fdb6205720712.jpg


下面是实现代码:

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语言##仓颉##购物#


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
移动开发工程师
手记
粉丝
1
获赞与收藏
1

关注作者,订阅最新文章

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

举报

0/150
提交
取消