入门
开发指南
- 模块
- 控件基础知识
- 控件树
- 选择器 API
- 布局
- 手势和触摸事件
- W3C APIs 兼容
- Cordova 插件支持
- EcmaScript 6,TypeScript 和 JSX
- Windows 10 支持说明
- 构建 Tabris.js App
- Tabris.js App 补丁
API 参考文档
- app
- device
- fs
- localStorage
- ui
- ActionSheet(操作列表)
- AlertDialog(对话框)
- CanvasContext
- InactivityTimer(闲置定时器)
- NativeObject
- Popup(弹出窗)
- Timer(计时器)
- WidgetCollection
控件
- Action
- ActivityIndicator
- Button
- Canvas
- CheckBox
- CollectionView
- Composite
- Drawer
- ImageView
- NavigationBar
- NavigationView
- Page
- Picker
- ProgressBar
- RadioButton
- ScrollView
- SearchAction
- Slider
- StatusBar
- Switch
- Tab
- TabFolder
- TextInput
- TextView
- ToggleButton
- Video
- WebView
- Widget
自定义控件
AlertDialog(对话框)
继承自Popup
对话框
是一个原生对话弹出框,显示一个消息与最多三个按钮。关闭时会被自动释放。
使用“const {AlertDialog} = require('tabris');
”引入该类。
属性
buttons
Type: {ok?: string, cancel?: string, neutral?: string}
含有按钮文本内容的对象。分别是这三种按钮:ok
, cancel
和neutral
。没有设置文本的按钮不会显示。示例: {ok: 'Yes', cancel: 'No'}
显示‘Yes’和‘No’按钮,不显示‘neutral’按钮。
message
Type: string
对话框中显示的文本。
title
Type: string
对话框的标题。
事件
buttonsChanged
当buttons属性改变时触发。
事件参数
target: this 事件触发的控件。
value: {ok?: string, cancel?: string, neutral?: string} buttons属性被设置的新的值。
close
当对话框被关闭时触发。
事件参数
target: this 事件触发的控件。
button: ‘ok’|’cancel’|’neutral’|’’ 关闭对话框的操作按钮类型。也可能是个空串,比如点了应用返回按钮而被关闭时。
closeCancel
当通过点击‘cancel’按钮关闭对话框时触发。
closeNeutral
当通过点击‘neutral’按钮关闭对话框时触发。
closeOk
当通过点击‘ok’按钮关闭对话框时触发。
messageChanged
当message属性发生改变时触发。
事件参数
target: this 事件触发的控件。
value: string message属性被设置的新的值。
titleChanged
当title属性发生改变时触发。
事件参数
target: this 事件触发的控件。
value: string title属性被设置的新的值。
示例
const {AlertDialog, Button, ui} = require('tabris');
// AlertDialog example
new Button({
left: 16, top: 'prev() 16', right: 16,
text: 'Show simple dialog'
}).on('select', () => {
new AlertDialog({
message: 'Your comment has been saved.',
buttons: {ok: 'Acknowledge'}
}).open();
}).appendTo(ui.contentView);
new Button({
left: 16, top: 'prev() 16', right: 16,
text: 'Show full featured dialog'
}).on('select', () => {
new AlertDialog({
title: 'Conflict while saving',
message: 'How do you want to resolve the conflict?',
buttons: {
ok: 'Replace',
cancel: 'Discard',
neutral: 'Keep editing'
}
}).on({
closeOk: () => console.log('Replace'),
closeNeutral: () => console.log('Keep editing'),
closeCancel: () => console.log('Discard'),
close: ({button}) => console.log('Dialog closed: ' + button)
}).open();
}).appendTo(ui.contentView);
new Button({
left: 16, top: 'prev() 16', right: 16,
text: 'Show self closing dialog'
}).on('select', () => {
let alertDialog = new AlertDialog({
message: 'This dialogs closes in 3 seconds.',
buttons: {ok: 'OK'}
}).open();
setTimeout(() => alertDialog.close(), 3000);
}).appendTo(ui.contentView);
还可参阅
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论