面板组件 ： 按钮

按钮组件是一种常用的交互组件， 当用户点击按钮时， 可以触发相应的事件。

属性配置

• ID : 组件ID，可用于在脚本或模板中引用该组件。
• 文本 ：设置按钮组件的文本内容。
• 类型 ：设置按钮组件的类型，支持主要，默认， 虚线， 文本， 链接。
• 透明 ：设置按钮组件是否透明。
• 大小 ：设置按钮组件尺寸，支持默认,小型,大型三种。
• 危险 ：设置按钮组件是否为危险按钮。
• 图标 ：设置按钮组件的图标。
• 取值 ：设置按钮组件的取值。
• 快捷键 ：设置按钮组件的快捷键。
• 脚本 ：定义组件事件处理函数或其他功能函数。
• 坐标X ：设置按钮坐标X取值。
• 坐标Y ：设置按钮坐标Y取值。
• 坐标Z ：设置按钮坐标Z取值。
• 高度 ：设置按钮高度取值。
• 宽度 ：设置按钮宽度取值。

事件配置

• 点击 ： 当按钮被点击时触发的事件。

脚本

脚本上下文 $this

$this 为当前组件实例，您可以通过 $this 对象调用组件的各种方法。

▲ 组件初始化

void init()

当组件存在init方法时，组件初始化时会调用该方法。

脚本示例：

export function init() {
    // your code here
}

▲ 获取当前值

string value()

脚本示例：

let value = $this.value();

▲ 设置/获取按钮类型

string buttonType(string type)

请求参数：

• type : <字符串> 可选项， 设置按钮类型。

返回值：<字符串> 当前按钮类型

脚本示例：

// 设置按钮类型
$this.buttonType("primary");

// 获取按钮类型
let type = $this.buttonType();

▲ 设置/获取按钮透明

boolean ghost(boolean ghost=undefined)

请求参数：

• ghost : <布尔> 可选项， 设置按钮透明。

返回值：<布尔> 当前按钮透明

脚本示例：

// 设置按钮透明
$this.ghost(true);

// 获取按钮透明
let ghost = $this.ghost();

▲ 设置/获取按钮大小

string sizeType(string size=undefined)

请求参数：

• size : <字符串> 可选项， 设置按钮大小。

返回值：<字符串> 当前按钮大小

脚本示例：

// 设置按钮大小
$this.sizeType("small");

// 获取按钮大小
let size = $this.sizeType();

▲ 设置/获取按钮危险

boolean danger(boolean danger=undefined)

请求参数：

• danger : <布尔> 可选项， 设置按钮危险。

返回值：<布尔> 当前按钮危险

脚本示例：

// 设置按钮危险
$this.danger(true);

// 获取按钮危险
let danger = $this.danger();

▲ 设置/获取按钮图标

string icon(string icon=undefined)

请求参数：

• icon : <字符串> 可选项， 设置按钮图标。

返回值：<字符串> 当前按钮图标

脚本示例：

// 设置按钮图标
$this.icon("icon");

// 获取按钮图标
let icon = $this.icon();

▲ 设置/获取按钮文本

string text(string text=undefined)

请求参数：

• text : <字符串> 可选项， 设置按钮文本。

返回值：<字符串> 当前按钮文本

脚本示例：

// 设置按钮文本
$this.text("text");

// 获取按钮文本
let text = $this.text();

▲ 设置/获取按钮加载状态

boolean loading(boolean loading=undefined)

请求参数：

• loading : <布尔> 可选项， 设置按钮加载状态。

返回值：<布尔> 当前按钮加载状态

脚本示例：

// 设置按钮加载状态
$this.loading(true);

// 获取按钮加载状态
let loading = $this.loading();

脚本上下文 $panel

$panel 对象为当前面板实例，您可以通过 $panel 对象调用面板的各种方法。

▲ 设置/获取变量

string variable(string name, string value=undefined)

请求参数：

• name : <字符串> 必选项， 变量名称。
• value : <字符串> 可选项， 设置变量值。

返回值：<字符串> 变量值

脚本示例：

// 设置变量值
$panel.variable("name", "value");

// 获取变量值
let value = $panel.variable("name");

▲ 获取组件实例

object widget(string id)

请求参数：

• id : <字符串> 必选项， 组件ID。

返回值：<对象> 组件实例

脚本示例：

// 获取组件实例
let widget = $panel.widget("switch");
// 获取开关值
let value = widget.value();

脚本上下文 $

脚本上下文 $ 是一个全局对象， 包含常用的全局函数和对象。

▲ 延时给定的毫秒数

async msleep(Integer ms)

例如 ：

await $.msleep(1000);

▲ 显示确认对话框

async confirm(String message)

参数：

• message : 消息内容

返回值： 如果用户点击了确认按钮，则返回 true，否则返回 false。

例如 ：

let confirmed = await $.confirm("Are you sure?");
if ( confirmed ) {
    $.alert("yes");
} else {
    $.alert("no");
}

▲ 显示消息对话框

async alert(String message, String type=undefined)

参数：

• message : 消息内容
• type : 消息类型，可选值为 error、warning, alert。默认为 alert。

例如 ：

$.alert("hello world");
// 显示错误信息
$.alert("hello world", "error");
// 显示警告信息
$.alert("hello world", "warning");

▲ 显示Toast消息

async toast(String message, String type=undefined)

参数：

• message : 消息内容
• type : 消息类型，可选值为 success, error、warning, info。默认为 info。

例如 ：

$.toast("hello world");
// 显示错误信息
$.toast("hello world", "error");
// 显示警告信息
$.toast("hello world", "warning");

▲ 显示通知消息

async notify(String title, String message, String type=undefined)

参数：

• title : 消息标题
• message : 消息内容
• type : 消息类型，可选值为 success, error、warning, info。默认为 info。

例如 ：

$.notify("hello", "hello world");
// 显示错误信息
$.notify("hello", "hello world", "error");
// 显示警告信息
$.notify("hello", "hello world", "warning");

▲ 生成随机数

Integer random(Integer min, Integer max)

参数：

• min : 最小值
• max : 最大值

返回值： 生成的随机数

例如 ：

let value = $.random(1, 100);

▲ 生成随机字符串

String randomString(Integer length)

参数：

• length : 字符串长度

返回值： 生成的随机字符串

例如 ：

let value = $.randomString(10);

▲ 执行指令

async execute(String name, Any params)

例如 ：

let response = await $.execute(
    "文件夹/指令名称",  // 指令路径
    {"name": "sige"} // 指令参数
);

// 等待1秒，用于等待指令执行完成
await $.msleep(1000); 

// 读取指令执行结果
let text = response.readAs('text');
// 结束指令执行
response.cancel();

▲ 调用指令

async call(String name, Any params)

调用和执行指令的区别是， 调用模式下会在接收到响应内容后立即返回， 而执行模式下会持续接收响应内容。

例如 ：

let response = await $.call(
    "文件夹/指令名称",  // 指令路径
    {"name": "sige"} // 指令参数
);