window
window二级模块对象,用于处理主窗口相关的逻辑。
setStatusBarMessage
设置HBuilderX底部状态栏消息
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
text | String | 消息内容 |
hideAfterTimeout | Number | [可选] 多长时间后自动隐藏,单位ms,默认值是0:不自动隐藏 |
level | String | [可选] 消息级别,取值有[‘warn’,’info’,’error’],默认值:’info’ |
返回值
返回类型 | 描述 |
---|---|
Disposable | 销毁器,可调用dispose方法清理状态栏消息 |
示例
hx.window.setStatusBarMessage('正在校验xxx文档...',600,'info');
clearStatusBarMessage
清空状态栏消息
参数说明
无
返回值
无
示例
hx.window.clearStatusBarMessage();
showErrorMessage
在窗口右下角显示错误通知框
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
message | String | 消息内容,支持html标签 |
buttons | Array<String> | 通知框中的按钮组 |
返回值
返回类型 | 描述 |
---|---|
Promise<String> | 如果设置了按钮,返回用户点击了哪个按钮 |
示例
let resultPromise = hx.window.showErrorMessage('是否删除该文件?',['是','否']);
resultPromise.then((result)=>{
if(result == '是'){
console.log("选择了是");
}else if(result === '否'){
console.log("选择了否");
}
});
showInformationMessage
在窗口右下角显示消息通知框
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
message | String | 消息内容,支持html标签 |
buttons | Array<String> | 通知框中的按钮组 |
返回值
返回类型 | 描述 |
---|---|
Promise<String> | 如果设置了按钮,返回用户点击了哪个按钮 |
示例
hx.window.showInformationMessage('详情可访问<a href="http://www.dcloud.io">参考文档</a>');
效果如下:
showWarningMessage
在窗口右下角显示警告消息通知框
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
message | String | 消息内容,支持html标签 |
buttons | Array<String> | 通知框中的按钮组 |
返回值
返回类型 | 描述 |
---|---|
Promise<String> | 如果设置了按钮,返回用户点击了哪个按钮 |
示例
let resultPromise = hx.window.showWarningMessage('是否删除该文件?',['是','否']);
resultPromise.then((result)=>{
if(result == '是'){
console.log("选择了是");
}else if(result === '否'){
console.log("选择了否");
}
});
showQuickPick
在窗口中间弹出一个可搜索的建议选择列表
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
items | Array<QuickPickItem> | 建议选择项列表 |
options | QuickPickOptions | 设置 |
返回值
返回类型 | 描述 |
---|---|
Promise<QuickPickItem> | 返回用户选择得某个列表项 |
示例
const pickResult = hx.window.showQuickPick([
{
label: '../',
description: '回到上一级目录',
backPath: 'foo/bar'
}
], {placeHolder: '请选择一个目录或者文件'});
pickResult.then(function(result) {
if (!result) {
return;
}
let backPath = result.backPath;
//do something with result
})
getActiveTextEditor
获取当前激活的编辑器,如果没有打开的编辑器返回undefined
参数说明
无
返回值
返回类型 | 描述 |
---|---|
Promise<TextEditor> | 返回当前激活的编辑器 |
示例
let activeEditor = hx.window.getActiveTextEditor();
activeEditor.then(function(editor){
console.log(editor.document.fileName);
});
showInputBox
在窗口中间居中弹出一个输入框,获取用户输入。类似于浏览器的prompt方法。
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
options | InputBoxOptions | 输入框设置 |
返回值
返回类型 | 描述 |
---|---|
Promise<String> | 用户输入的结果 |
示例
let inputPromise = hx.window.showInputBox({
prompt:"请输入密码",
password:true
});
inputPromise.then((result)=>{
console.log("输入的密码为:",result);
});
createOutputChannel
创建一个输出控制台通道,可用于在控制台输出文本内容。
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
channel | String | 控制台通道名称,在添加内容到控制台时,会将该名称作为前缀输出,eg:[${channel}] 这是要输出的内容。 |
返回值
返回类型 | 描述 |
---|---|
OutputChannel | 控制台通道 |
示例
let outputChannel = hx.window.createOutputChannel("foo");
outputChannel.show();
outputChannel.appendLine("Hello World");
createTreeView
从HBuilderX 2.7.12及以上版本开始支持
创建指定viewId的视图,在窗体左侧区域创建一个和项目管理器
同级的tab项。tab的内容区为一个树控件,可自行装载节点。
viewId需要在package.json文件内的配置扩展点views中声明,完整的扩展视图流程参考如何注册一个新的视图?
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
viewId | String | 视图Id,需要首先在配置扩展点views 中声明。 |
options | TreeViewOptions | 创建TreeView时需要的设置项。 |
返回值
无
示例
class DemoTreeDataProvider extends hx.TreeDataProvider{
constructor(demoData) {
super();
this._demoData = demoData;
}
getChildren(element) {
let demoData = this._demoData;
return new Promise(resolve => {
if (!element) {
resolve(demoData);
} else {
resolve(element.children);
}
});
}
getTreeItem(element) {
return {
label:element.name,
collapsibleState:element.children ? 1 : 0,
command:{
command:element.children ? "":"extension.helloWorld",
arguments:[
element.name
]
}
}
}
}
let demoData = [
{
name:"Root1",
children:[
{
name:"child1"
},
{
name:"child2"
}
]
},
{
name:"Root2",
children:[
{
name:"child3",
},
{
name:"child4"
}
]
}
]
hx.commands.registerCommand("extension.helloWorld",function(param){
hx.window.showInformationMessage("选中了TreeItem:" + param[0]);
});
hx.window.createTreeView("extensions.treedemo",{
showCollapseAll:true,
treeDataProvider:new DemoTreeDataProvider(demoData);
});
createWebView
从HBuilderX 2.8.1及以上版本开始支持
创建指定viewId的WebView控件视图,在窗体左侧或右侧区域创建一个tab项。tab内容为webview,webview里可装载html页面,可以较灵活的渲染自定义的内容。
viewId需要在package.json文件内的配置扩展点views中声明,完整的扩展视图流程参考如何注册一个新的视图?
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
viewId | String | 视图Id,需要首先在配置扩展点views 中声明。 |
options | WebViewOptions | WebView属性 |
返回值
返回类型 | 描述 | |
---|---|---|
WebViewPanel | WebViewPanel | WebViewPanel属性 |
示例
let webviewPanel = hx.window.createWebView("viewId",{
enableScritps:true
});
let webview = webviewPanel.WebView;
webview.html = `
<script>
// 以下两种写法等同
hbuilderx.onDidReceiveMessage((msg)=>{
});
window.addEventListener("message",(msg)=>{
});
hbuiderx.postMessage({
command: 'alert',
text: 'HelloWorld'
});
</script>
<img src="xxxx">
`;
webview.postMessage({
command:"test"
});
webview.onDidReceiveMessage((msg)=>{
if(msg.command == 'alert'){
hx.window.showInformationMessage(msg.text);
}
});
registerUriHandler
从HBuilderX 2.8.1及以上版本开始支持
注册一个依赖hbuilderx协议的自定义网络请求处理器(schema),格式为:
hbuilderx://requestExtension/exampleid/examplerequest/example?example1=example2&...
\________/ \_____________/ \________/ \__________________________________________/
| | | |
协议 自定义插件请求的标记 插件id 任意的自定义信息
当在浏览器地址栏中输入以上格式的url时或者跳转到以上格式的url,已安装了HBuilderX的系统将会把该请求转入HBuilderX, 由HBuilderX识别该请求并检测对应插件(如上例子中名为exampleid的插件)的配置信息(package.json)中是否声明了 onUri, 此时如果当前的插件并没有激活,那么HBuilderX会先激活该插件并把对应请求转发到由registerUriHandler方法注册的处理器中。
如果exampleid对应插件并未安装,则HBuilderX会弹框提示是否安装该插件。
适用的场景
- 需要通过浏览器等外部应用启动HBuilderX,然后通过指定插件响应请求
参数说明
参数名称 | 参数类型 | 描述 |
---|---|---|
handler | UriHandler | scheme的处理器 |
context | ExtensionContext | 插件激活方法activate中传入的(context)参数对象 |
返回值
返回类型 | 描述 |
---|---|
Disposable | 注册的UriHandler的销毁器,可将该对象放置到插件的context.subscriptions数组内,插件卸载时,将会自动注销该handler |
示例
hx.window.registerUriHanlder({
handleUri:function(uri){
//处理scheme请求
let path = uri.path;
let params = uri.query;
hx.window.showInformationMessage(uri.toString());
}
}, context);
上面的示例中,假设插件id为foo,则在浏览器地址栏中输入hbuilderx://requestExtension/foo?param=abc时,将自动激活该插件,并执行handleUri函数,uri的值即为地址栏中输入的地址,示例中uri.query的值为param=abc。