HTML5+ - nativeUI系统原生界面管理

1、actionSheet: 弹出系统选择按钮框

void plus.nativeUI.actionSheet( actionsheetStyle, actionsheetCallback );

说明：

从底部动画弹出系统样式选择按钮框，可设置选择框的标题、按钮文字等。 弹出的提示框为非阻塞模式，用户点击选择框上的按钮后关闭，并通过actionsheetCallback回调函数通知用户选择的按钮。

参数：

actionsheetStyle: ( ActionSheetStyle ) 必选 选择按钮框显示的样式

actionsheetCallback: ( ActionSheetCallback ) 可选 选择按钮框关闭后的回调函数

<input type="button" value="test" onclick="share();" /> 

<script type="text/javascript"> function share(){

 plus.nativeUI.actionSheet( 

{title:"test",cancel:"取消",buttons:[{title:"1"},{title:"2"}]

}, 

function(e){ 

//e.index 代表选择按钮的序列号 

console.log( "User pressed: "+e.index ); }); }

 </script>

2、alert弹出系统提示对话框

void plus.nativeUI.alert( message, alertCB, title, buttonCapture );

说明：

创建并显示系统样式提示对话框，可设置提示对话框的标题、内容、按钮文字等。 弹出的提示对话框为非阻塞模式，用户点击提示对话框上的按钮后关闭，并通过alertCB回调函数通知对话框已关闭。

参数：

message: ( String ) 必选 提示对话框上显示的内容

alertCB: ( AlertCallback ) 可选 提示对话框上关闭后的回调函数

title: ( String ) 可选 提示对话框上显示的标题

buttonCapture: ( String ) 必选 提示对话框上按钮显示的内容

function share(){plus.nativeUI.alert('hi',function(){},'test','确定');}

3、confirm 弹出系统确认对话框

void plus.nativeUI.confirm( message, confirmCB, title, buttons );

说明：

创建并显示系统样式确认对话框，可设置确认对话框的标题、内容、按钮数目及其文字。 弹出的确认对话框为非阻塞模式，用户点击确认对话框上的按钮后关闭，并通过confirmCB回调函数通知用户点击的按钮索引值。

参数：

message: ( String ) 必选 确认对话框上显示的内容

confirmCB: ( ConfirmCallback ) 可选 确认对话框关闭后的回调函数

回调函数中包括Event参数，可通过其index属性（Number类型）获取用户点击按钮的索引值。

title: ( String ) 可选 确认对话框上显示的标题

buttons: ( Array[ String ] ) 可选 确认对话框上显示的按钮

字符串数组，每项对应在确认对话框上显示一个按钮，用户点击后通过confirmCB返回用户点击按钮的在数组中的索引值。

<input type="button" value="test" onclick="test();" />

 <script type="text/javascript">

 function test(){

 plus.nativeUI.confirm('确定要删除吗？',

function(e){ 

if(e.index == 0){ alert('yes'); } 

},'提示', ['是','否']); } 

</script>

4、loading等待对话框

closeWaiting: 关闭系统等待对话框

showWaiting: 显示系统等待对话框

<input type="button" value="test" onclick="test();" /> 

<script type="text/javascript"> 

function test(){ 

var w = plus.nativeUI.showWaiting(); 

setTimeout(function (){

 w.close();//或者plus.nativeUI.closeWaiting(); 

}, 3000); } 

</script>

5、prompt 弹出系统输入对话框

void plus.nativeUI.prompt( message, promptCB, title, tip, buttons );

说明：

创建并显示系统样式输入对话框，可设置输入对话框的标题、内容、提示输入信息、按钮数目及其文字。 弹出的输入对话框为非阻塞模式，其中包含编辑框供用户输入内容，用户点击输入对话框上的按钮后自动关闭，并通过promptCB回调函数返回用户点击的按钮及输入的内容。

参数：

message: ( String ) 必选 输入对话框上显示的内容

promptCB: ( PromptCallback ) 可选 关闭输入对话框的回调函数

回调函数中包括Event参数，可通过其index属性（Number类型）获取用户点击按钮的索引值，通过其value属性（String类型）获取用户输入的内容。

title: ( String ) 可选 输入对话框上显示的标题

tip: ( String ) 可选 输入对话框上编辑框显示的提示文字

buttons: ( Array[ String ] ) 可选 输入对话框上显示的按钮数组

<input type="button" value="test" onclick="test();" /> 

<script type="text/javascript"> 

function test(){ 

plus.nativeUI.prompt('您的姓名',function(e){ 

//可通过event.index（Number类型）获取用户关闭输入对话框点击按钮的索引值，索引值从0开始 

//通过event.value（String类型）获取用户输入的内容，如果没有输入则返回空字符串。 

if(e.index == 0){alert(e.value);} },'hcoder','请输入...',['提交','取消']); } 

</script>

6、toast显示自动消失的提示消息

void plus.nativeUI.toast( message, options );

说明：

创建并显示系统样式提示消息，弹出的提示消息为非阻塞模式，显示指定时间后自动消失。 提示消息显示时间可通过options的duration属性控制，长时间提示消息显示时间约为3.5s，短时间提示消息显示时间约为2s。

参数：

message: ( String ) 必选 提示消息上显示的文字内容

options: ( ToastOption ) 可选 提示消息的参数

可设置提示消息显示的图标、持续时间、位置等。

7、根据手册改造loading
手册地址：http://www.html5plus.org/doc/zh_cn/nativeui.html

<input type="button" value="test" onclick="test();" />

 <script type="text/javascript">

 function test(){ plus.nativeUI.showWaiting('加载中...',

{padding:'10px', loading:{display:'inline'}}); } 

</script>