0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

鸿蒙开发接口UI界面:【@ohos.prompt (弹窗)】

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-05-28 09:35 次阅读

弹窗

icon-note.gif说明 本模块首批接口从API version 8开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。

导入模块

import prompt from '@ohos.prompt'

权限列表

开发前请熟悉鸿蒙开发指导文档 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]

prompt.showToast

showToast(options: ShowToastOptions): void

创建并显示文本提示框。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数

参数名类型必填说明
options[ShowToastOptions]文本弹窗选项。

示例:

export default {    
  showToast() {        
    prompt.showToast({            
      message: 'Message Info',
      duration: 2000,      
    });
  }
}

ShowToastOptions

文本提示框的选项。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称类型必填说明
messagestring显示的文本信息
durationnumber默认值1500ms,建议区间:1500ms-10000ms,若小于1500ms则取默认值。
bottom设置弹窗边框距离屏幕底部的位置。

prompt.showDialog

showDialog(options: ShowDialogOptions): Promise

创建并显示对话框,对话框响应后同步返回结果。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
options[ShowDialogOptions]对话框选项。

返回值:

类型说明
Promise<[ShowDialogSuccessResponse]>对话框响应结果。

示例:

export default {
  showDialog() {
    prompt.showDialog({
      title: 'Title Info',
      message: 'Message Info',
      buttons: [
        {
           text: 'button1',
           color: '#000000',
        },
        {
           text: 'button2',
           color: '#000000',
        }
       ],
    })
    .then(data = > {
      console.info('showDialog success, click button: ' + data.index);
    })
    .catch(err = > {
      console.info('showDialog error: ' + err);
    })
  }
}

prompt.showDialog

showDialog(options: ShowDialogOptions, callback: AsyncCallback):void

创建并显示对话框,对话框响应结果异步返回。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
options[ShowDialogOptions]页面显示对话框信息描述。
callbackAsyncCallback<[ShowDialogSuccessResponse]>对话框响应结果回调。

示例:

export default {
  callback(err, data) {
    if(err) {
      console.info('showDialog err: ' + err);
      return;
    }
    console.info('showDialog success callback, click button: ' + data.index);
  },
  showDialog() {
    prompt.showDialog({
      title: 'showDialog Title Info',
      message: 'Message Info',
      buttons: [
        {
          text: 'button1',
          color: '#000000',
        },
        {
          text: 'button2',
          color: '#000000',
        }
      ]
    }, this.callback);
  }
}

ShowDialogOptions

对话框的选项。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称类型必填说明
titlestring标题文本。
messagestring内容文本。
buttonsArray对话框中按钮的数组,结构为:{text:'button', color: '#666666'},支持1-3个按钮。其中第一个为positiveButton;第二个为negativeButton;第三个为neutralButton。

ShowDialogSuccessResponse

对话框的响应结果。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称类型说明
indexnumber选中按钮在buttons数组中的索引

prompt.showActionMenu

showActionMenu(options: ActionMenuOptions, callback: AsyncCallback):void

创建并显示操作菜单,菜单响应结果异步返回。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

参数:

参数名类型必填说明
options[ActionMenuOptions]操作菜单选项。
callbackAsyncCallback<[ActionMenuSuccessResponse]>菜单响应结果回调。

示例:

export default {
  callback(err, data) {
    if(err) {
      console.info('showActionMenu err: ' + err);
      return;
    }
    console.info('showActionMenu success callback, click button: ' + data.index);
  },
  showActionMenu() {
    prompt.showActionMenu({
      title: 'Title Info',
      buttons: [
        {
          text: 'item1',
          color: '#666666',
        },
        {
           text: 'item2',
           color: '#000000',
        },
      ]
    }, this.callback)
  }
}

rompt.showActionMenu

showActionMenu(options: ActionMenuOptions): Promise

创建并显示操作菜单,菜单响应后同步返回结果。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
options[ActionMenuOptions]操作菜单选项。

返回值:

类型说明
Promise<[ActionMenuSuccessResponse]>菜单响应结果。

示例:

export default {
  showActionMenu() {
    prompt.showActionMenu({
      title: 'showActionMenu Title Info',
      buttons: [
        {
          text: 'item1',
          color: '#666666',
        },
        {
           text: 'item2',
           color: '#000000',
        },
      ]
    })
    .then(data = > {
      console.info('showActionMenu success, click button: ' + data.index);
    })
    .catch(err = > {
      console.info('showActionMenu error: ' + err);
    })
  }
}

ActionMenuOptions

操作菜单的选项。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称类型必填说明
titlestring标题文本。
buttonsArray菜单中菜单项按钮的数组,结构为:{text:'button', color: '#666666'},支持1-6个按钮。大于6个按钮时弹窗不显示。HarmonyOSOpenHarmony鸿蒙文档籽料:mau123789是v直接拿

搜狗高速浏览器截图20240326151450.png

ActionMenuSuccessResponse

操作菜单的响应结果。

系统能力: 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称类型必填说明
indexnumber选中按钮在buttons数组中的索引,从0开始。

审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 接口
    +关注

    关注

    33

    文章

    7972

    浏览量

    149247
  • 鸿蒙
    +关注

    关注

    55

    文章

    2123

    浏览量

    42274
收藏 人收藏

    评论

    相关推荐

    HarmonyOS实战开发-全局状态保留能力弹窗

    // 全局状态保留能力弹窗 模块依赖 不涉及 最后 如果大家觉得这篇内容对学习鸿蒙开发有帮助,我想邀请大家帮我三个小忙: 点赞,转发,有你们的 『点赞和评论』,才是我创造的动力。 关注小编,同时可以
    发表于 05-07 14:53

    鸿蒙开源第三方组件资料合集

    1、鸿蒙开源第三方组件——日志工具组件Timber_ohosTimber_ohos是一个带有小型可扩展API的日志工具组件,它可以给开发者提供统一的API接口,来记录不同类型的日志,帮
    发表于 03-23 09:53

    鸿蒙应用开发的JS UI框架如何实现高德地图的访问?

    鸿蒙应用,现在分为Java UI框架和Ark UI框架,其中JS UI开发者框架Ark UI框架
    发表于 04-28 11:44

    【软通动力鸿湖万联扬帆系列“竞”开发板试用体验】基于JS UI框架的视频播放应用

    /MainAbility/pages/index/index.jsimport prompt from '@ohos.prompt';import router from '@ohos
    发表于 10-30 15:29

    OpenHarmony应用开发之自定义弹窗

    以​​橘子购物​​中一个应用更新提示的弹窗介绍OpenHarmony的自定义弹窗接口 自定义弹窗官方文档:​​自定义弹窗-
    发表于 09-06 14:40

    鸿蒙应用ui布局

    请问,在用java开发鸿蒙应用布局UI时,怎么才能全屏布局(不显示labelb标题)
    发表于 09-20 22:09

    鸿蒙OS界面和EMUI界面UI高度相似 被质疑是安卓换皮

    安卓,证明鸿蒙OS是一个具有高度兼容性的系统。 部分已经注册为开发者的用户,已经在第一时间进行了更新,据说体验还不错,大量国内主流app也都支持鸿蒙OS,但更新之后却有人发现,鸿蒙OS
    的头像 发表于 12-18 10:12 7940次阅读

    鸿蒙版微信聊天UI效果实现!

      最近开发中要做一个类似微信聊天的工单系统客服中心界面(安卓版)所以想着也模仿一个鸿蒙版(基于 Java UI 的,JS UI 版本的后期
    的头像 发表于 11-15 09:35 3342次阅读
    <b class='flag-5'>鸿蒙</b>版微信聊天<b class='flag-5'>UI</b>效果实现!

    OHOS中实现各个方向的气泡弹窗案例

    项目介绍 实现各个方向的气泡弹窗,可控制气泡尖角偏移量 安装教程 在entry的build.gradle中添加依赖 依赖项 { ... 实施 ‘com.gitee.archermind-ti:bubble-popup-window-ohos:1.0.0-beta’ ...
    发表于 03-25 13:44 2次下载

    三种自定义弹窗UI组件封装的实现

    鸿蒙已经提供了全局 UI 方法自定义弹窗,本文是基于基础的自定义弹窗来实现提示消息弹窗、确认弹窗
    的头像 发表于 03-30 09:28 2647次阅读

    鸿蒙ArkUI开发-应用添加弹窗

    弹窗是一种模态窗口,通常用来展示用户当前需要的或用户必须关注的信息或操作。在弹出框消失之前,用户无法操作其他界面内容。ArkUI为我们提供了丰富的弹窗功能
    的头像 发表于 01-24 17:22 414次阅读
    <b class='flag-5'>鸿蒙</b>ArkUI<b class='flag-5'>开发</b>-应用添加<b class='flag-5'>弹窗</b>

    鸿蒙实战开发-全局UI方法的功能

    使用全局UI的方法定义日期滑动选择器弹窗并弹出。
    的头像 发表于 02-02 17:13 311次阅读
    <b class='flag-5'>鸿蒙</b>实战<b class='flag-5'>开发</b>-全局<b class='flag-5'>UI</b>方法的功能

    鸿蒙UI界面——@ohos.measure (文本计算)

    导入模块   import measure from '@ohos.measure'   measure.measureText measureText(options
    的头像 发表于 02-22 17:02 355次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>UI</b><b class='flag-5'>界面</b>——@<b class='flag-5'>ohos</b>.measure (文本计算)

    鸿蒙开发接口UI界面:【@ohos.animator (动画)】

    本模块首批接口从API version 6开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。
    的头像 发表于 05-27 16:46 350次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>开发</b><b class='flag-5'>接口</b><b class='flag-5'>UI</b><b class='flag-5'>界面</b>:【@<b class='flag-5'>ohos</b>.animator (动画)】

    鸿蒙开发接口UI界面:【@ohos.router (页面路由)】

    本模块首批接口从API version 8开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。 > - 页面路由需要在页面渲染完成之后才能调用,在onInit和onReady生命周期中页面还处于渲染阶段,禁止调用页
    的头像 发表于 05-28 16:26 381次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>开发</b><b class='flag-5'>接口</b><b class='flag-5'>UI</b><b class='flag-5'>界面</b>:【@<b class='flag-5'>ohos</b>.router (页面路由)】