宜信同城网交流论坛技术专版技术专区nativeUI管理系统原生界面，可用于弹出系统原生提示对话框窗口、时间日期选择对话框、 ...方法： actionSheet: 弹出系统选择按钮框alert: 弹出系统提示对话框confirm: 弹出系统确认对话框closePr ...

admin 发表于 2023-2-16 18:54:50

nativeUI管理系统原生界面，可用于弹出系统原生提示对话框窗口、时间日期选择对话框、 ...

<div id="article_content" class="article_content clearfix">
 <link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/kdoc_html_views-1a98987dfd.css">
 <link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/ck_htmledit_views-6e43165c0a.css">
 <div id="content_views" class="htmledit_views">
 <h2 style="margin-left:.8em;">方法：</h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.actionSheet">actionSheet</a>: 弹出系统选择按钮框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.alert">alert</a>: 弹出系统提示对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.confirm">confirm</a>: 弹出系统确认对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.closePreviewImage">closePreviewImage</a>: 关闭预览图片界面</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.closeWaiting">closeWaiting</a>: 关闭系统等待对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.closeToast">closeToast</a>: 关闭自动消失的提示消息</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.previewImage">previewImage</a>: 预览图片</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.showWaiting">showWaiting</a>: 显示系统等待对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.pickDate">pickDate</a>: 弹出系统日期选择对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.pickTime">pickTime</a>: 弹出系统时间选择对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.prompt">prompt</a>: 弹出系统输入对话框</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.toast">toast</a>: 显示自动消失的提示消息</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.setUIStyle">setUIStyle</a>: 设置原生界面样式（暗黑模式）</li></ul>
<h2 style="margin-left:.8em;">对象：</h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ActionButtonStyles">ActionButtonStyles</a>: 原生选择按钮框上按钮的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ActionSheetStyles">ActionSheetStyles</a>: 原生选择按钮框的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ConfirmStyles">ConfirmStyles</a>: 确认对话框的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PreviewImageStyles">PreviewImageStyles</a>: 图片预览的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickDateStyles">PickDateStyles</a>: 日期选择对话框的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickTimeStyles">PickTimeStyles</a>: 时间选择对话框的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.NativeUIObj">NativeUIObj</a>: 系统原生界面基类对象</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingObj">WaitingObj</a>: 系统等待对话框对象</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.WaitingStyles">WaitingStyles</a>: 原生等待对话框的样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.WaitingLoadingStyles">WaitingLoadingStyles</a>: JSON对象，原生等待对话框上loading图标自定义样式</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ToastStyles">ToastStyles</a>: 系统提示消息框的样式</li></ul>
<h2 style="margin-left:.8em;">回调方法：</h2>
<ul><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ActionSheetCallback">ActionSheetCallback</a>: 系统选择按钮框的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.AlertCallback">AlertCallback</a>: 系统提示框确认的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ConfirmCallback">ConfirmCallback</a>: 关闭确认对话框的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PromptCallback">PromptCallback</a>: 系统输入对话框关闭后的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickDatetimeSuccessCallback">PickDatetimeSuccessCallback</a>: 选择日期或时间操作成功的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickDatetimeErrorCallback">PickDatetimeErrorCallback</a>: 选择日期或时间操作取消或失败的回调函数</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PreviewImageLongPressCallback">PreviewImageLongPressCallback</a>: 图片预览长按事件</li><li><ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.SuccessCallback">SuccessCallback</a>: 操作成功回调函数</li></ul>
<h2 style="margin-left:.8em;">权限：</h2>
5+功能模块（permissions）
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
{
// ...
"permissions":{
// ...
"NativeUI": {
"description": "原生UI控件"
}
}
}
</code></code></pre>
<h1 style="margin-left:0;">actionSheet</h1>
弹出系统选择按钮框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
NativeUIObj plus.nativeUI.actionSheet(actionsheetStyle, actionsheetCallback);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
从底部动画弹出系统样式选择按钮框，可设置选择框的标题、按钮文字等。弹出的提示框为非阻塞模式，用户点击选择框上的按钮后关闭，并通过actionsheetCallback回调函数通知用户选择的按钮。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>actionsheetStyle: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ActionSheetStyles">ActionSheetStyles</a> ) 必选 选择按钮框显示的样式 </li><li>actionsheetCallback: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ActionSheetCallback">ActionSheetCallback</a> ) 可选 选择按钮框关闭后的回调函数 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
<ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.NativeUIObj">NativeUIObj</a> : 系统原生界面基类对象
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统选择按钮框
function actionSheet(){
plus.nativeUI.actionSheet(
{title:"Plus is ready!",
cancel:"取消",
buttons:[
{
title:"1"
},{
title:"2"
}
]},
function(e){
console.log("User pressed: "+e.index);
}
);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">alert</h1>
弹出系统提示对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.alert(message, alertCB, title, buttonCapture);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式提示对话框，可设置提示对话框的标题、内容、按钮文字等。弹出的提示对话框为非阻塞模式，用户点击提示对话框上的按钮后关闭，并通过alertCB回调函数通知对话框已关闭。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>message: ( String ) 必选 提示对话框上显示的内容 </li><li>alertCB: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.AlertCallback">AlertCallback</a> ) 可选 提示对话框上关闭后的回调函数 </li><li>title: ( String ) 可选 提示对话框上显示的标题 </li><li>buttonCapture: ( String ) 必选 提示对话框上按钮显示的内容 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统提示对话框
function showAlert(){
plus.nativeUI.alert("Hello HTML5 plus!", function(){
console.log("User pressed!");
}, "nativeUI", "OK");
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">confirm</h1>
弹出系统确认对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.confirm(message, confirmCB, styles);
void plus.nativeUI.confirm(message, confirmCB, title, buttons); // deprecated
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式确认对话框，可设置确认对话框的标题、内容、按钮数目及其文字。弹出的确认对话框为非阻塞模式，用户点击确认对话框上的按钮后关闭，并通过confirmCB回调函数通知用户点击的按钮索引值。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>message: ( String ) 必选 确认对话框上显示的内容 </li><li>confirmCB: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ConfirmCallback">ConfirmCallback</a> ) 可选 确认对话框关闭后的回调函数 回调函数中包括Event参数，可通过其index属性（Number类型）获取用户点击按钮的索引值。 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ConfirmStyles">ConfirmStyles</a> | String ) 可选 确认对话框的参数/对话框的标题 类型为JSON Object（ConfirmStyles）时，表示设置确认对话框的参数； 类型为String时，表示设置确认对话框的标题（不推荐使用）。 </li><li>buttons: ( Array ) 可选 确认对话框上显示的按钮（不推荐使用） 字符串数组，每项对应在确认对话框上显示一个按钮，用户点击后通过confirmCB返回用户点击按钮的在数组中的索引值。不推荐使用，建议使用styles参数中的buttons属性。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (支持) : 对话框上最多只能支持三个按钮，buttons参数超过三个的值则忽略。 </li><li>iOS - ALL (支持)</li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出提示信息对话框
function showConfirm(){
plus.nativeUI.confirm("Are you sure ready?", function(e){
console.log("Close confirm: "+e.index);
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">closePreviewImage</h1>
关闭预览图片界面
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.closePreviewImage();
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
关闭已经显示的所有预览图片界面。 HBuilderX3.2.13+版本支持。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 自动关闭系统等待对话框
function autoClosePreview(){
plus.nativeUI.previewImage([
"_www/logo.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon1.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon2.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon3.png"
]);
setTimeout(function(){
plus.nativeUI.closePreviewImage();
}, 5000);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">closeWaiting</h1>
关闭系统等待对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.closeWaiting();
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
关闭已经显示的所有系统样式等待对话框，触发Waiting对象的onclose事件。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 自动关闭系统等待对话框
function autoCloseWaiting(){
plus.nativeUI.showWaiting( "等待中..." );
setTimeout(function(){
plus.nativeUI.closeWaiting();
}, 5000);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">closeToast</h1>
关闭自动消失的提示消息
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.closeToast();
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
关闭已经显示的所有自动消失的提示框。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (支持) : 仅可关闭type类型为"richtext"的提示消息。 </li><li>iOS - ALL (支持)</li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 自动关闭系统等待对话框
function autoCloseToast(){
plus.nativeUI.toast(
"再按一次返回键退出 点此可<a onclick=\"console.log('clicked')\">反馈意见</a>",
{type:'richtext',
duration:'long',
richTextStyle:{align:'center'}
}
);
setTimeout(function(){
plus.nativeUI.closeToast();
}, 500);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">previewImage</h1>
预览图片
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.previewImage(urls, styles);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示全屏图片预览界面，用户点击图片或返回键退出预览界面。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>urls: ( Array ) 必选 需要预览的图片地址列表 支持网络地址，也支持本地地址。相对路径 - 相对于当前页面的host位置，如"a.jpg"； 绝对路径 - 系统绝对路径，如Android平台"/sdcard/a.jpg"，此类路径通常通过其它5+ API获取的； 扩展相对路径URL(RelativeURL) - 以"_"开头的相对路径，如"_www/a.jpg"； 本地路径URL - 以“file://”开头，后面跟随系统绝对路径。 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PreviewImageStyles">PreviewImageStyles</a> ) 可选 预览的显示参数 如设置默认显示图片的索引值。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 图片预览
function previewImage(){
plus.nativeUI.previewImage([
"_www/logo.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon1.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon2.png",
"http://img-cdn-qiniu.dcloud.net.cn/icon3.png"
]);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">showWaiting</h1>
显示系统等待对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
Waiting plus.nativeUI.showWaiting(title, styles);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式等待对话框，并返回等待对话框对象Waiting，显示后需调用其close方法进行关闭。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>title: ( String ) 可选 等待对话框上显示的提示标题内容 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingStyles">WaitingStyles</a> ) 可选 等待对话框的显示参数 可设置等待对话框的宽、高、边距、背景等样式。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
<ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.Waiting">Waiting</a> : Waiting对象
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统等待对话框
function showWaiting(){
var w = plus.nativeUI.showWaiting("等待中...");
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">pickDate</h1>
弹出系统日期选择对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.pickDate( successCB, errorCB, styles );
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式日期选择对话框，可进行日期的选择。用户操作确认后通过successCB回调函数返回用户选择的日期，若用户取消选择则通过errorCB回调。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>successCB: ( <ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickDatetimeSuccessCallback">PickDatetimeSuccessCallback</a> ) 必选 日期选择操作成功的回调函数 回调函数中包括Event参数，可通过其date属性（Date类型）获取用户选择的时间。 </li><li>errorCB: ( <ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.PickDatetimeErrorCallback">PickDatetimeErrorCallback</a> ) 可选 日期选择操作取消或失败的回调函数 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PickDateStyles">PickDateStyles</a> ) 可选 日期选择操作的参数 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 选择日期
function pickDate(){
plus.nativeUI.pickDate(function(e){
var d=e.date;
console.log("选择的日期："+d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate());
}, function(e){
console.log("未选择日期："+JSON.stringify(e));
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">pickTime</h1>
弹出系统时间选择对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.pickTime(successCB, errorCB, styles);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并弹出系统样式时间选择对话框，可进行时间的选择。用户操作确认后通过successCB回调函数返回用户选择的时间，若用户取消选择则通过errorCB回调。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>successCB: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PickDatetimeSuccessCallback">PickDatetimeSuccessCallback</a> ) 必选 时间选择操作成功的回调函数 回调函数中包括Event参数，可通过其date属性（Date类型）获取用户选择的时间。 </li><li>errorCB: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PickDatetimeErrorCallback">PickDatetimeErrorCallback</a> ) 可选 时间选择操作取消或失败的回调函数 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PickTimeStyles">PickTimeStyles</a> ) 可选 时间选择操作的参数 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 选择时间
function pickTime(){
plus.nativeUI.pickTime(function(e){
var d=e.date;
console.log("选择的时间："+d.getHours()+":"+d.getMinutes());
}, function(e){
console.log("未选择时间："+JSON.stringify(e));
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">prompt</h1>
弹出系统输入对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.prompt(message, promptCB, title, tip, buttons);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式输入对话框，可设置输入对话框的标题、内容、提示输入信息、按钮数目及其文字。弹出的输入对话框为非阻塞模式，其中包含编辑框供用户输入内容，用户点击输入对话框上的按钮后自动关闭，并通过promptCB回调函数返回用户点击的按钮及输入的内容。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>message: ( String ) 必选 输入对话框上显示的内容 </li><li>promptCB: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PromptCallback">PromptCallback</a> ) 可选 关闭输入对话框的回调函数 回调函数中包括Event参数，可通过其index属性（Number类型）获取用户点击按钮的索引值，通过其value属性（String类型）获取用户输入的内容。 </li><li>title: ( String ) 可选 输入对话框上显示的标题 </li><li>tip: ( String ) 可选 输入对话框上编辑框显示的提示文字 </li><li>buttons: ( Array ) 可选 输入对话框上显示的按钮数组 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出输入对话框
function showPrompt(){
plus.nativeUI.prompt("Input your name: ", function(e){
console.log(((e.index==0)?"OK: ":"Cancel")+e.value);
}, "nativeUI", "your name", ["OK","Cancel"]);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">toast</h1>
显示自动消失的提示消息
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.toast(message, styles);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
创建并显示系统样式提示消息，弹出的提示消息为非阻塞模式，显示指定时间后自动消失。提示消息显示时间可通过styles的duration属性控制，长时间提示消息显示时间约为3.5s，短时间提示消息显示时间约为2s。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>message: ( String ) 必选 提示消息上显示的文字内容 </li><li>styles: ( <ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.ToastStyles">ToastStyles</a> ) 可选 提示消息的样式 可设置提示消息显示的图标、持续时间、位置等。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 显示自动消失的提示消息
function showToast(){
plus.nativeUI.toast("I'am toast information!");
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">setUIStyle</h1>
设置原生界面样式（暗黑模式）
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void plus.nativeUI.setUIStyle(style);
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
iOS13+系统支持暗黑模式，可设置原生界面的外观样式为浅色或深色（暗黑模式）。即使应用没有设置"全局开启暗黑模式"，也可以调用此方法强制设置原生界面外观样式。 HBuilderX2.6.3+版本支持，并且要求iOS13及以上系统。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>style: ( String ) 必选 原生界面样式 可取值：
<ul style="margin-left:2em;"><li>"light" - 浅色外观样式</li><li>"dark" - 深色外观样式（暗黑模式）</li><li>"auto” - 根据系统外观样式自动调整，应用需"全局开启暗黑模式"，参考<ahref="https://ask.dcloud.net.cn/article/36995">iOS13适配暗黑模式/夜间模式/深色模式/暗黑主题（DarkMode） - DCloud问答</a></li></ul> </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (不支持) : 调用后无效果 </li><li>iOS - 13+ (支持) : iOS13及以上设备支持，低版本设备不支持暗黑模式。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 设置原生界面为暗黑模式
function showToast(){
plus.nativeUI.setUIStyle(‘dark’);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">ActionButtonStyles</h1>
原生选择按钮框上按钮的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>color: (String 类型 )按钮上的文字颜色 可取值： "#RRGGBB"格式字符串，如"#FF0000"表示文字颜色为红色； "rgba(R,G,B,A)"，其中R/G/B分别代表红色值/绿色值/蓝色值，正整数类型，取值范围为0-255，A为透明度，浮点数类型，取值范围为0-1（0为全透明，1为不透明），如"rgba(255,0,0,0.5)"，表示红色半透明。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - ALL (支持) : 默认值为"#000000"（黑色）；如果style为"destructive"，则默认值为"#FF0000"(红色)。 </li><li>iOS - ALL (不支持) : 暂不支持设置字体颜色，如果style为"default"则文字颜色为"#0000FF"（蓝色）；如果style为"destructive"，则文字颜色为"#FF0000"(红色)。 </li></ul></li><li>title: (String 类型 )按钮上的文字内容</li><li>style: (String 类型 )按钮的样式 可取值： "destructive" - 表示警示按钮样式，默认文字颜色为红色； "default" - 表示默认按钮样式。默认值为"default"。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - ALL (不支持)</li><li>iOS - 5.0+ (支持) : iOS7及以下系统只仅支持一个按钮为"destructive"样式按钮，iOS8及以上系统可支持多个"destructive"样式按钮。 </li></ul></li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统选择按钮框
function actionSheet(){
var actionbuttons=[{title:"不同意",style:"destructive"},{title:"1"},{title:"2"},{title:"3"}];
var actionstyle={title:"Hello HTML5 plus!",cancel:"取消",buttons:actionbuttons};
plus.nativeUI.actionSheet(actionstyle, function(e){
console.log("User pressed: "+e.index );
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">ActionSheetStyles</h1>
原生选择按钮框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>title: (String 类型 )选择按钮框的标题</li><li>cancel: (String 类型 )取消按钮上显示的文字内容 不设置此属性，则不显示取消按钮。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>iOS - ALL (支持) : 在iPad设备上不会显示取消按钮，点击actionsheet区域之外会自动关闭，并触发取消回调。 </li></ul></li><li>buttons: (Array[<ahref="https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.ActionButtonStyles">ActionButtonStyles</a>] 类型 )选择框上的按钮 ActionButtonStyles对象数组 </li><li>popover: (JSON 类型 )弹出原生选择按钮框的指示区域 JSON类型对象，格式如{top:10;left:10;width:200;height:200;}，所有值为像素值，其值为相对于容器Webview的位置。如未设置此值，默认指向屏幕底部水平居中位置。注意：HBuilderX2.6.6+版本支持，仅在iPad上有效，其它设备忽略此值。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统选择按钮框
function actionSheet(){
var actionbuttons=[{title:"不同意",style:"destructive"},{title:"1"},{title:"2"},{title:"3"}];
var actionstyle={title:"Hello HTML5 plus!",cancel:"取消",buttons:actionbuttons};
plus.nativeUI.actionSheet(actionstyle, function(e){
console.log("User pressed: "+e.index );
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">ConfirmStyles</h1>
确认对话框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>title: (String 类型 )确认对话框显示的标题 如果不设置此属性值，则不显示标题。 </li><li>buttons: (Array 类型 )确认对话框上显示的按钮 字符串数组，每项对应在确认对话框上显示一个按钮，用户点击后通过confirmCB返回用户点击按钮的在数组中的索引值。 </li><li>verticalAlign: (String 类型 )对话框在屏幕中的垂直分享对齐方式 可取值： "top" - 表示垂直居顶对齐； "center" - 表示垂直居中对齐； "bottom" - 表示垂直居底对齐。默认值为"center"（垂直居中对齐）。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统确认对话框
function showConfirm(){
plus.nativeUI.confirm("Are you sure ready?", function(e){
console.log("Close confirm: "+e.index);
},
{"title":"nativeUI",
"buttons":["Yes","No"],
"verticalAlign":"bottom"
}
);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">PreviewImageStyles</h1>
图片预览的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>background: (String 类型 )图片预览的背景颜色 颜色值格式为"#RRGGBB"，如"#FF0000"表示为红色背景。默认值为黑色（"#000000"）。 </li><li>current: (Number 类型 )默认显示图片的索引值 索引值从0开始，默认值为0。 </li><li>indicator: (String 类型 )图片指示器样式 可取值： "default" - 默认指示器（底部圆点样式）； "number" - 顶部数字指示器（顶部居中显示，文字为%当前图片索引值（从1开始）%/%图片总数%）； "none" - 不显示指示器。默认值为"default"。 </li><li>loop: (Boolean 类型 )是否可循环预览 可取值： "true" - 支持循环预览； "false" - 不支持循环预览。默认值为"false"。 </li><li>onLongPress: (<ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.PreviewImageLongPressCallback">PreviewImageLongPressCallback</a> 类型 )长按事件 用户在图片预览界面长按时触发。在回调中返回长按图片的信息（索引值、地址等）。由于图片预览界面是层级非常高的窗口，此时只能调用plus.nativeUI.*显示的窗口覆盖在图片预览界面上（原生控件plus.nativeObj.View也无法显示）。注意：HBuilderX1.9.5及以上版本支持。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 图片预览 
function previewImage(){
plus.nativeUI.previewImage([
"_www/img/h5p.jpg",
"../img/shake/2.jpg",
"http://img-cdn-qiniu.dcloud.net.cn/newpage/images/logo4.png"
],{
current:1,
loop:true,
onLongPress:function(e){ // 预览界面长按显示ActionSheet
console.log('onLongPress: '+JSON.stringify(e));
var bts=[{title:"警告",style:"destructive"},{title:"按钮1"},{title:"按钮2"},{title:"按钮3"}];
plus.nativeUI.actionSheet({title:"ActionSheet标题",cancel:"取消",buttons:bts},
function(e){
console.log( "选择了\""+((e.index>0)?bts[e.index-1].title:"取消")+"\"");
}
);
}
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">PickDateStyles</h1>
日期选择对话框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>title: (String 类型 )日期选择对话框显示的标题 如果未设置，则不显示标题。 </li><li>date: (Date 类型 )日期选择对话框默认显示的日期 如果未设置，则显示当前的日期。 </li><li>minDate: (Date 类型 )日期选择对话框可选择的最小日期 Date类型对象，如果未设置可选择的最小日期，则使用系统默认可选择的最小日期值。 </li><li>maxDate: (Date 类型 )日期选择对话框可选择的最大日期 Date类型对象，如果未设置可选择的最大日期，则使用系统默认可选择的最大日期值。其值必须大于minDate设置的值，否则使用系统默认可选择的最大日期值。 </li><li>popover: (JSON 类型 )时间选择对话框弹出指示区域 JSON类型对象，格式如{top:10;left:10;width:200;height:200;}，所有值为像素值，其值为相对于容器Webview的位置。如未设置此值，默认在屏幕居中显示。仅在iPad上有效，其它设备忽略此值。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 选择日期
function pickDate(){
var styles = {};
styles.title = "请选择日期："; // 显示标题
styles.date = new Date(), styles.date.setFullYear(2018,8,8);// 默认显示的日期
styles.minDate = new Date(), styles.minDate.setFullYear(2010,0,1);// 设置最小可选日期为“2010-01-01”
styles.maxDate = new Date(), styles.maxDate.setFullYear(2020,11,31);// 设置最大可选日期为“2020-12-31”

plus.nativeUI.pickDate(function(e){
var d=e.date;
console.log( "选择的日期："+d.getFullYear()+"-"+(d.getMonth()+1)+"-"+d.getDate() );
}, function(e){
console.log( "未选择日期："+e.message );
}, styles);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">PickTimeStyles</h1>
时间选择对话框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>time: (Date 类型 )时间选择对话框默认显示的时间 如果未设置，则默认当前的时间。 </li><li>title: (String 类型 )时间选择对话框显示的标题 如果未设置，则不显示标题。 </li><li>is24Hour: (Boolean 类型 )是否24小时制模式 true表示使用24小时制模式显示，fale表示使用12小时制模式显示，默认值为true。 </li><li>popover: (JSON 类型 )日期选择对话框弹出指示区域 JSON类型对象，格式如{top:10;left:10;width:200;height:200;}，所有值为像素值，其值相对于容器webview的位置。如未设置此值，默认在屏幕居中显示。仅在iPad上有效，其它设备忽略此值。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 选择时间
function pickTime(){
var styles = {};
styles.title = "请选择时间："; //设置标题
styles.time = new Date(), styles.time.setHours(6,0); //设置默认显示时间为早上6点
styles.is24Hour = false; //使用12小时制模式显示

plus.nativeUI.pickTime(function(e){
var d=e.date;
console.log( "选择的时间："+d.getHours()+":"+d.getMinutes() );
}, function(e){
console.log( "未选择时间："+e.message );
}, styles);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">NativeUIObj</h1>
系统原生界面基类对象
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
interface NativeUIObj{
function void close();
}
</code></code></pre>
<h2 style="margin-left:.8em;">方法：</h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.NativeUIObj.close">close</a>: 关闭显示的系统原生界面</li></ul>
<h1 style="margin-left:0;">close</h1>
关闭显示的系统原生界面
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void uiobj.close();
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
调用plus.nativeUI.actionSheet方法创建并显示系统界面后，可通过其close方法将原生界面关闭。此情况下触发界面关闭回调函数参数的index属性值为-1。注意：一个系统原生界面只能关闭一次，多次调用将无任何作用。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统选择按钮框(5秒后自动关闭) 
function autoActionSheet(){
var a = plus.nativeUI.actionSheet({title:'Plus is ready!',
cancel:'取消',
buttons:[{title:'1'},{title:'2'}]
},
function(e){
console.log('User pressed: '+e.index);
a=null;
});
setTimeout(function(){
a&&a.close();
}, 5000);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">WaitingObj</h1>
系统等待对话框对象
<h2 style="margin-left:.8em;">说明：</h2>
从NativeUIObj对象继承而来，通过plus.nativeUI.showWaiting方法创建时返回。用于控制系统样式等待对话框的操作，如关闭、设置标题内容等。
<h2 style="margin-left:.8em;">方法：</h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingObj.setTitle">setTitle</a>: 设置等待对话框上显示的文字内容</li><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingObj.close">close</a>: 关闭显示的系统等待对话框</li></ul>
<h2 style="margin-left:.8em;">事件：</h2>
<ul><li><ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingObj.onclose">onclose</a>: 等待对话框关闭事件</li></ul>
<h1 style="margin-left:0;">setTitle</h1>
设置等待对话框上显示的文字内容
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
wobj.setTitle( title );
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>title: ( String ) 必选 要设置的文本信息 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 更新等待对话框上显示内容
function updateWaitingTitle(){
// 弹出系统等待对话框
var w = plus.nativeUI.showWaiting( "等待中..." );
// 2秒后更新
setTimeout(function(){
w.setTitle( "正在更新" );
}, 2000);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">close</h1>
关闭显示的系统等待对话框
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
wobj.close();
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
调用plus.nativeUI.showWaiting方法创建并显示系统等待界后，可通过其close方法将原生等待控件关闭。一个系统等待对话框只能关闭一次，多次调用将无任何作用。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 自动关闭等待框
function autoClosWaiting(){
var w = plus.nativeUI.showWaiting( "等待中..." );
// 2秒后关闭
setTimeout(function(){
w.close();
}, 2000);
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">onclose</h1>
等待对话框关闭事件
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
wobj.onclose = function() {
console.log( "Waiting closed!" );
};
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
<ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.SuccessCallback">SuccessCallback</a> 类型
等待框关闭时触发，当调用close方法或用户点击返回按钮导致等待框关闭时触发。
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统等待对话框
function showWaiting(){
var w = plus.nativeUI.showWaiting("等待中...");
// 关闭事件
w.onclose = function() {
console.log("Waiting onclose!");
}
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">WaitingStyles</h1>
原生等待对话框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>width: (String 类型 )等待框背景区域的宽度 值支持像素值（"500px"）或百分比（"50%"），百分比相对于屏幕的宽计算，如果不设置则根据内容自动计算合适的宽度。 </li><li>height: (String 类型 )等待框背景区域的高度 值支持像素绝对值（"500px"）或百分比（"50%"），如果不设置则根据内容自动计算合适的高度。 </li><li>color: (String 类型 )等待框中文字的颜色 颜色值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值/rgba值，默认值为白色。 </li><li>size: (String 类型 )等待框中文字的字体大小 如"14px"表示使用14像素高的文字，未设置则使用系统默认字体大小。 </li><li>textalign: (String 类型 )等待对话框中标题文字的水平对齐方式 对齐方式可选值包括："left"：水平居左对齐显示，"center"：水平居中对齐显示，"right"：水平居右对齐显示。默认值为水平居中对齐显示，即"center"。 </li><li>padding: (String 类型 )等待对话框的内边距 值支持像素值（"10px"）和百分比（"5%"），百分比相对于屏幕的宽计算，默认值为"3%"。 </li><li>background: (String 类型 )等待对话框显示区域的背景色 背景色的值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值/rgba值，默认值为rgba(0,0,0,0.7)。 </li><li>style: (String 类型 )等待对话框样式 可取值"black"、"white"，black表示等待框为黑色雪花样式，通常在背景主色为浅色时使用；white表示等待框为白色雪花样式，通常在背景主色为深色时使用。仅在iOS平台有效，其它平台忽略此值，未设置时默认值为white。 </li><li>modal: (Boolen 类型 )等待框是否模态显示 模态显示时用户不可操作直到等待对话框关闭，否则用户在等待对话框显示时也可操作下面的内容，未设置时默认为true。 </li><li>round: (Number 类型 )等待框显示区域的圆角 值支持像素值（"10px"），未设置时使用默认值"10px"。 </li><li>padlock: (Boolen 类型 )点击等待显示区域是否自动关闭 true表示点击等待对话框显示区域时自动关闭，false则不关闭，未设置时默认值为false。 </li><li>back: (String 类型 )返回键处理方式 可取值"none"表示截获处理返回键，但不做任何响应；"close"表示截获处理返回键并关闭等待框；"transmit"表示不截获返回键，向后传递给Webview窗口继续处理（与未显示等待框的情况一致）。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - 2.3+ (支持)</li><li>iOS - ALL (不支持) : iOS设备无返回键，忽略此属性。 </li></ul></li><li>loading: (<ahref="https://blog.csdn.net/qq_40575646/article/details/122829073#plus.nativeUI.WaitingLoadingStyles">WaitingLoadingStyles</a> 类型 )自定义等待框上loading图标样式</li></ul>
<h1 style="margin-left:0;">WaitingLoadingStyles</h1>
JSON对象，原生等待对话框上loading图标自定义样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>display: (String 类型 )loading图标显示样式 可取值： "block"表示图标与文字分开两行显示，上面显示loading图标，下面显示文字； "inline"表示loading图标与文字在同一行显示，左边显示loading图标，右边显示文字； "none"表示不显示loading图标； </li><li>height: (String 类型 )loading图标高度 设置loading图标的高度（宽度等比率缩放），取值类型：像素值，如"14px"表示14像素高。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - 2.3+ (支持)</li><li>iOS - 5.1+ (支持) : 仅在自定义loading图标时生效，使用系统默认样式loading图标时忽略此参数。 </li></ul></li><li>icon: (String 类型 )loading图标路径 自定义loading图标的路径，png格式，并且必须是本地资源地址； loading图要求宽是高的整数倍，显示等待框时按照图片的高横向截取每帧刷新。 </li><li>interval: (Number 类型 )loading图每帧刷新间隔 单位为ms（毫秒），默认值为100ms。 </li><li>type: (String 类型 )loading图标类型 如果设置了icon属性，则优先使用icon自定义图标。可取值： "circle" - 圆圈类型loading图标； "snow" - 雪花类型loading图标。默认值为"circle"。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - ALL (支持)</li><li>iOS - ALL (不支持) : 不支持设置loading图标类型，默认为系统雪花图标。 </li></ul></li></ul>
<h1 style="margin-left:0;">ToastStyles</h1>
系统提示消息框的样式
<h2 style="margin-left:.8em;">属性：</h2>
<ul><li>align: (String 类型 )提示消息框在屏幕中的水平位置 可选值为"left"、"center"、"right"，分别为水平居左、居中、居右，未设置时默认值为"center"。 </li><li>background: (String 类型 )提示消息框的背景色 背景色的值支持(参考CSS颜色规范)：颜色名称(参考CSS Color Names)/十六进制值/rgb值/rgba值。 <h3 style="margin-left:0;">平台支持</h3>
<ul style="margin-left:2em;"><li>Android - ALL (支持) : 默认为系统toast的背景颜色。 </li><li>iOS - ALL (支持) : 默认值为rgba(0,0,0,0.7)。 </li></ul></li><li>duration: (String 类型 )提示消息框显示的时间 可选值为"long"、"short"，值为"long"时显示时间约为3.5s，值为"short"时显示时间约为2s，未设置时默认值为"short"。 </li><li>icon: (String 类型 )提示消息框上显示的图标 仅支持本地图片路径。 </li><li>iconWidth: (String 类型 )图标的宽度 单位为px（逻辑像素值），默认值为图片的宽度。 </li><li>iconHeight: (String 类型 )图标的高度 单位为px（逻辑像素值），默认值为图片的高度。 </li><li>style: (String 类型 )提示消息框上显示的样式 可取值： "block" - 表示图标与文字分两行显示，上面显示图标，下面显示文字； "inline" - 表示图标与文字在同一行显示，左边显示图标，右边显示文字。默认值为"block"。 </li><li>type: (String 类型 )提示消息框上显示的文本类型 可取值： "text" - 显示的消息内容为文本字符串； "richtext" - 显示的消息内容为富文本内容。默认值为"text"。当type为"text"时，富文本使用html的部分标签，具体标签如下： 图片标签<img src="图片资源url地址" width="图片显示的宽度" height="图片显示的高度" οnclick="console.log('clicked img')"></img>； 字体标签，内容在一行显示不下时自动换行，行高默认为字体的1.2倍； 换行标签 ； 链接标签<a οnclick="console.log('clicked a')">链接地址</a>。如示例“<img οnclick="console.log('clicked img')" src="http://img-cdn-qiniu.dcloud.net.cn/icon2.png"/><a οnclick="console.log(clicked a)">链接地址</a>”。 </li><li>richTextStyle: (<ahref="https://www.html5plus.org/doc/zh_cn/nativeobj.html#plus.nativeObj.RichTextStyles">plus.nativeObj.RichTextStyles</a> 类型 )富文本样式 当type属性值为"richtext"时有效，用于定义富文本的样式，如其文本对齐方式、使用的字体等。 </li><li>verticalAlign: (String 类型 )提示消息在屏幕中的垂直位置 可选值为"top"、"center"、"bottom"，分别为垂直居顶、居中、居底，未设置时默认值为"bottom"。 </li></ul>
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 显示自动消失的富文本提示消息
function showRichToast(){
plus.nativeUI.toast("再按一次返回键退出 点此可<a onclick=\"console.log('clicked')\">反馈意见</a>",
{type:'richtext',
duration:'long',
richTextStyle:{
align:'center'
}
});
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">ActionSheetCallback</h1>
系统选择按钮框的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void onActioned( Event event ){
// actionsheet handled code.
var index=event.index; // 用户关闭时点击按钮的索引值
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>event: ( Event ) 必选 用户操作选择按钮框关闭后返回的数据 可通过event.index（Number类型）获取用户关闭时点击按钮的索引值，索引值从0开始； 0表示用户点击取消按钮，大于0值表示用户点击ActionSheetStyles中buttons属性定义的按钮，索引值从1开始（即1表示点击buttons中定义的第一个按钮）。通过API（close()方法）关闭，则回调函数中event的index属性值为-1。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">示例：</h2>
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
// 弹出系统选择按钮框
function showActionsheet(){
var actionbuttons=[{title:"不同意",style:"destructive"},{title:"test1"},{title:"test2"},{title:"3"}];
var actionstyle={title:"Plus is ready!",cancel:"取消",buttons:actionbuttons};
plus.nativeUI.actionSheet( actionstyle, function(e){
if(e.index>0){
console.log( "User pressed: "+actionbuttons[e.index-1].title );
}else{
console.log( "User pressed 取消" );
}
} );
}
</code></code></pre>
<ahref="https://uniapp.dcloud.io/use-html5plus">uni-app使用plus注意事项</a>
<h1 style="margin-left:0;">AlertCallback</h1>
系统提示框确认的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void onAlerted( Event event ){
// Alert handled code.
var index=event.index; // 用户关闭提示对话框点击按钮的索引值
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>event: ( Event ) 必选 用户操作确认对话框关闭后返回的数据 可通过event.index（Number类型）获取用户关闭确认对话框点击按钮的索引值，点击确认键的索引值为0。 Android平台上通过返回按钮关闭时索引值为-1。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (支持) : 用户点击设备“返回”按键导致提示对话框关闭，也会触发此回调函数，此时回调返回参数中的index属性值为-1。 </li><li>iOS - ALL (支持) : 用户只能通过点击提示对话框上的按钮进行关闭。 </li></ul>
<h1 style="margin-left:0;">ConfirmCallback</h1>
关闭确认对话框的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void onConfirmed( Event event ) {
// Confirm handled code.
var index=event.index; // 用户关闭确认对话框点击按钮的索引值
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>event: ( Event ) 必选 用户操作确认对话框关闭后返回的数据 可通过event.index（Number类型）获取用户关闭确认对话框点击按钮的索引值，索引值从0开始； </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (支持) : 用户点击设备“返回”按键导致确认对话框关闭，则回调函数中event的index属性值为-1。 </li><li>iOS - ALL (支持) : 用户只能通过点击确认对话框上的按钮进行关闭。 </li></ul>
<h1 style="margin-left:0;">PromptCallback</h1>
系统输入对话框关闭后的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
function void onPrompted( Event event ) {
// Prompt handled code.
var index=event.index; // 用户关闭输入对话框点击按钮的索引值
var value=event.value; // 用户输入的内容
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>event: ( Event ) 必选 用户操作输入对话框关闭后返回的数据 可通过event.index（Number类型）获取用户关闭输入对话框点击按钮的索引值，索引值从0开始； 通过event.value（String类型）获取用户输入的内容，如果没有输入则返回空字符串。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h2 style="margin-left:.8em;">平台支持：</h2>
<ul><li>Android - ALL (支持) : 用户点击设备“返回”按键导致输入对话框关闭，则回调函数中event的index属性值为-1，value值为空字符串。 </li><li>iOS - ALL (支持) : 用户只能通过点击输入对话框上的按钮进行关闭。 </li></ul>
<h1 style="margin-left:0;">PickDatetimeSuccessCallback</h1>
选择日期或时间操作成功的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
function void onPickSuccess( Event event ) {
// Date picked code.
var date = event.date;// 用户选择的日期或时间
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>event: ( Event ) 必选 用户完成选择日期或时间后返回的数据 可通过event.date（Date类型）获取选择的日期或时间值。若调用的是日期选择操作则仅年、月、日信息有效，若调用的是时间选择操作则仅时、分信息有效。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h1 style="margin-left:0;">PickDatetimeErrorCallback</h1>
选择日期或时间操作取消或失败的回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
function void onPickError( Exception error ) {
// Date picked error.
var code = error.code; // 错误编码
var message = error.message; // 错误描述信息
}
</code></code></pre>
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>error: ( Exception ) 必选 用户选择操作失败信息 可通过error.code（Number类型）获取错误编码； 可通过error.message（String类型）获取错误描述信息。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h1 style="margin-left:0;">PreviewImageLongPressCallback</h1>
图片预览长按事件
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
function void onlongPress(event) {
// longpress event
var index = event.index; // 长按图片的索引
var url = event.url; // 长按图片的url地址
var path = event.path; // 长按图片的本地图片路径（系统绝对路径）
}
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
在图片预览界面长按时触发。
<h2 style="margin-left:.8em;">参数：</h2>
<ul><li>index: ( Number ) 必选 长按图片的索引值 索引值从0开始。 </li><li>url: ( String ) 必选 长按图片的url地址 与调用plus.nativeUI.previewImage传入的urls值一致。 </li><li>path: ( String ) 必选 长按图片的本地地址 系统绝对路径。 </li></ul>
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
<h1 style="margin-left:0;">SuccessCallback</h1>
操作成功回调函数
<pre class="has" style="margin-left:0;"><code class="language-prettyprint"><code>
void onSuccess(){
// Success code.
}
</code></code></pre>
<h2 style="margin-left:.8em;">说明：</h2>
操作成功后触发回调函数。
<h2 style="margin-left:.8em;">参数：</h2>
无
<h2 style="margin-left:.8em;">返回值：</h2>
void : 无
 </div>
 </div>
 <div id="treeSkill"></div>

页: [1]

宜信同城网交流论坛's Archiver

nativeUI管理系统原生界面，可用于弹出系统原生提示对话框窗口、时间日期选择对话框、 ...