uitsheetview

来自于：APICloud立即使用

概述 UI模版引擎调用本模块方法 示例代码 补充说明 可用性

概述

uitsheetview 小程序模块，可从页面底部弹出具备按钮交互功能的 sheet 样式的对话框。本小程序模块基于UI模块引擎语法开发的,开发者可下载后直接使用或根据实际需要修改内部UI样式，完成该功能的二次开发。(本模块为公测版)

图片说明

UI模版引擎调用本模块方法

  • 下载本模块，解压后安置在UI模版引擎对应的 widget 目录中,并在app.json文件中添加本模块的相对路径地址

  • 在引用页面，初始化 UITemplate 引擎模块

  • 使用 UITemplate.openView 方法调用本模块。

  • 注意事项

    • 调用处理

      需要将 sheet 的参数封装在 pageParam 参数对象中，然后将该对象通过 UITemplate.openView 的 data 参数传递给本模块进行显示。

      pageParam 中具体参数如下：

      • title [String]

        弹窗标题, 必填, 无默认值

      • cancleName [String]

        底部取消按钮名称, 选填, 默认值“取消”

      • buttons [Array]

        包含item名称的数组,如[‘一年级’,’二年级’,’三年级’], 必填

    • 回调处理

      收到回调事件后，关闭sheet弹窗

示例代码

  1. // 前置步骤，需要先使用 init 方法初始化 UITemplate
  3. var UITemplate = api.require("UITemplate");
  4. UITemplate.openView({
  5.     name: 'sheet',
  6.     url: 'pages/sheetview/sheetview',
  7.     rect: {
  8.         marginTop: 0,
  9.         h: 'auto',
  10.         w: 'auto'
  11.     },
  12.     level: 'alert',
  13.     data: {
  14.         pageParam: {
  15.             title: '你想让谁发红包',
  16.             items: [{name: 'Sean'},{name: 'Broad'},{name: 'May'}],
  17.             cancleName: '取消'
  18.         }
  19.     }
  20. },function(ret,err){
  21.     if(ret && 'buttonClick' == ret.type ){
  22.         _UITemplate.closeView({name: 'sheet'});
  24.         // 此处可填写回调代码逻辑
  25.     }
  26. });

补充说明

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本