Dialog
更新时间：2021-10-18
车载智能小程序弹窗规范使用说明
一、弹窗类型
解释：显示消息提示框，用以提供成功、警告和错误等反馈信息.
1. 内容&两个按钮: [小度助手样式]
图示待补充；
代码实例:
swan.showModal({
content: '提示内容、告知状态、信息和解决方法，描述尽量控制在两行内'
showCancel: true
cancelText: '取消'
confirmText: '去支付'
});2. 标题&内容&两个按钮: [小度助手样式]
图示待补充；
代码实例:
swan.showModal({
title: '支付提醒',
content: '提示内容、告知状态、信息和解决方法，描述尽量控制在两行内',
showCancel: true,
cancelText: '取消',
confirmText: '去支付'
});3. 标题&内容&1个按钮: [小度助手样式]
图片代补充；
代码实例:
swan.showModal({
title: '支付提醒',
content: '提示内容、告知状态、信息和解决方法，描述尽量控制在两行内',
showCancel: false,
confirmText: '我知道了'
});4. 复杂Dialog
举个例子:待补充；
分割:
代码实例:
swan.iovauto.showIOVModal({
data: {
"title":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"project":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"picture":{
"url":"https://baidu.com/ccc/cccc.png",
"corner":12
},
"picTint":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"score":{
"level":4
},
"description":[{
"maxLines":3,
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
{
"maxLines":3,
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
{
"maxLines":3,
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
}],
"confirmText":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"cancelText":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"rightOriginText":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"rightCountText":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
},
"rightDescription":{
"text":"百度车载小程序复杂弹窗",
"textColor":"#ffffff",
"textSize":"24"
}
},
success: res => {
},
fail: err => {
}
}1. 取消按钮默认出现, 文字为"取消" ;
2. 坐标系从dialog左上角出发, 向右向下延伸
3. A. 不传图片, 内容区默认距左边100px ; B. 传了图片, 图片距左边100px, 文字距离图片40px ;
4. 默认属性,
TextView
| 可选属性 | 默认值 |
|---|---|
| panel_x_Top | 0px |
| panel_x_Start | 0px |
| panel_x_End | 0px |
| panel_x_Bottom | 0px |
| panel_x_TextSize | 30px |
| panel_x_maxlines | 自适应 |
| panel_x_TextColor | #FFFFFFF |
| panel_x_TextBackground | 透明 |
| panel_x_TextGravity | start,top |
| panel_x_padding | 0px |
| panel_x_paddingLeft | 0px |
| panel_x_paddingRight | 0px |
| panel_x_paddingTop | 0px |
| panel_x_paddingBottom | 0px |
ImageView
| 可选属性 | 默认值 |
|---|---|
| panel_x_Top | 0px |
| panel_x_Start | 0px |
| panel_x_End | 0px |
| panel_x_Bottom | 0px |