UI页面接口说明
创建授权页
一键登录标准版授权页说明:

如果您使用自定义协议,请确认您协议栏配置的所有自定义协议详情页HTML的<title>是否有配置内容。如未配置<title>,用户点击查看协议详情内容时会显示网页URL,影响界面美观。
导航栏
方法名 | 类型 | 说明 |
windowBarProperties | window.SystemBarProperties | 设置授权页及协议详情页顶部状态栏。 |
弹窗模式
属性名称 | 属性释义 | 属性类型 | 默认值 |
dialogAlignment | 授权页弹窗模式居中位置 | DialogAlignment | DialogAlignment.Center居中对齐 |
dialogWidth | 授权页弹窗模式宽度 | Length | '80%' |
dialogHeight | 授权页弹窗模式高度 | Length | '60%' |
dialogAutoCancel | 授权页弹窗模式点击非弹窗区域是否自动退出 | boolean | 默认false。
|
手机掩码
方法名 | 类型 | 说明 |
numberMargin | Margin | 设置手机掩码偏移。 |
numberFontSize | number | 设置手机掩码字体大小。 |
numberFontColor | ResourceColor | 设置手机掩码字体颜色。 |
numberHeight | Length | 设置手机掩码栏高度。 |
numberAlignRuleOption | AlignRuleOption | 设置手机掩码栏相对布局偏移规则。 |
登录按钮
方法名 | 类型 | 说明 |
loginBtnText | string | 登录按钮文本。 |
loginBtnMargin | Magin | 登录按钮偏移。 |
loginBtnPadding | Padding | 登录按钮内边距。 |
loginBtnFontSize | number | 登录按钮文本字体大小。 |
loginBtnFontColor | ResourceColor | 登录按钮文本字体颜色。 |
loginBtnDisableFontColor | ResourceColor | 登录按钮未选中状态时字体颜色。 |
loginBtnWidth | Length | 登录按钮宽度。 |
loginBtnHeight | Length | 登录按钮高度。 |
loginBtnBackGroundColor | ResourceColor | 登录按钮选中状态下背景色。 |
loginBtnDisableBackGroundColor | ResourceColor | 登录按钮未选中状态下背景色。 |
loginBtnBorder | Length | BorderRadiuses | LocalizedBorderRadiuses | 登录按钮边框配置。 |
loginBtnBorderWidth | Length | 登录按钮选中状态时边框宽度设置。 |
loginBtnDisableBorderWidth | Length | 登录按钮未选中状态时边框宽度设置。 |
loginBtnBorderColor | ResourceColor | 登录按钮选中状态时边框颜色。 |
loginBtnDisableBorderColor | ResourceColor | 登录按钮未选中状态时边框颜色。 |
loginBtnBackGroundImage | Resource | 登录按钮选中状态下背景图片。 说明
|
loginBtnDisableBackGroundImage | Resource | 登录按钮未选中状态下背景图片。 说明 此方法必须与 |
loginBtnAlignRuleOption | AlignRuleOption | 登录按钮相对布局偏移规则。 |
协议栏
协议栏相关:
方法名 | 类型 | 说明 |
privacyFontColor | ResourceColor | 协议栏运营商协议字体颜色。 |
privacyFontSize | number | 协议栏运营商协议字体大小。 |
privacyMargin | Margin | 协议栏偏移。 |
privacyAlignRuleOption | AlignRuleOption | 协议栏相对布局偏移规则。 |
复选框相关:
privacyCbUnSelectImg | Resource | 通过指定图片设置复选框在未选中状态下的显示效果,默认为空。 |
privacyCbSelectImg | Resource | 通过指定图片设置复选框在选中状态下的显示效果,默认为空。 |
privacyCbWidth | Length | 协议栏复选框宽度。 |
privacyCbHeight | Length | 协议栏复选框高度。 |
privacyCbMargin | Margin | 协议栏复选框相对布局偏移规则。 |
privacyCbIsOn | boolean | 复选框默认是否选中。 |
privacyCbSelectColor | ResourceColor | 复选框选中色。 |
privacyCbAlignRuleOption | AlignRuleOption | 复选框相对布局偏移规则。 |
privacyCbShape | CheckBoxShape | 复选框样式。 |
privacyCbTipText | string | 授权页未勾选复选框点击登录按钮且不需要弹出二次弹窗时吐司提示文本,默认为空。 |
其他:
自定义协议配置注意事项:
建议您在协议详情页HTML内配置<title>属性,如<title>用户服务隐私协议</title>。如有多个自定义协议时均需配置<title>属性。
如果协议详情页未配置<title>或<title>属性无法正常获取,协议详情页顶部会显示协议URL,影响界面美观。
privacySpanBeforeText | string | 协议栏前置文本。 |
privacySpanBeforeFontSize | number | 协议栏前置文本字体大小。 |
privacySpanBeforeFontColor | ResourceColor | 协议栏前置文本字体颜色。 |
privacySpanBeforeFontWeight | FontWeight | 协议栏前置文本字体样式,默认取值 |
privacySpanEndText | string | 协议栏后置文本。 |
privacySpanEndFontSize | number | 协议栏后置文本字体大小。 |
privacySpanEndFontColor | ResourceColor | 协议栏后置文本字体颜色。 |
privacySpanEndFontWeight | FontWeight | 协议栏后置文本字体样式,默认取值 |
privacyOperatorIndex | OperatorIndex | 设置运营商协议位置:
|
vendorPrivacyPrefix | string | 设置运营商及自带隐私协议前缀符号,只能设置一个字符且只能设置 |
vendorPrivacySuffix | string | 设置运营商及自带隐私协议后缀符号,只能设置一个字符且只能设置 |
privacySpanOneText | string | 第一个自定义协议文本。在授权页单击协议文本 |
privacySpanOneUrl | string | 第一个自定义协议网址。 |
privacySpanOneFontSize | number | 第一个自定义协议字体大小。 |
privacySpanOneFontColor | ResourceColor | 第一个自定义协议字体颜色。 |
privacySpanTwoText | string | 第二个自定义协议文本。 |
privacySpanTwoUrl | string | 第二个自定义协议网址。 |
privacySpanTwoFontSize | number | 第二个自定义协议字体大小。 |
privacySpanTwoFontColor | ResourceColor | 第二个自定义协议字体颜色。 |
privacySpanThreeText | string | 第三个自定义协议文本。 |
privacySpanThreeUrl | string | 第三个自定义协议网址。 |
privacySpanThreeFontSize | number | 第三个自定义协议字体大小。 |
privacySpanThreeFontColor | ResourceColor | 第三个自定义协议字体颜色。 |
协议详情页
方法名 | 类型 | 说明 |
navFontColor | ResourceColor | 设置服务条款标题栏字体颜色。默认值为 |
navFontSize | number | 设置服务条款标题栏字体大小。默认值大小为 |
自定义组件
方法名 | 类型 | 说明 |
loginPageComponent | WrappedBuilder<[]> | 授权页自定义组件,可参见集成文档示例。 |
clauseComponent | WrappedBuilder<[]> | 协议详情页自定义组件,可参见集成文档示例。 |
如需在授权页底部添加“其他登录方式”,可通过自定义组件和quitLoginPage退出授权页界面实现。
创建二次弹窗
二次弹窗会在授权页复选框未勾选协议复选框的情况下弹出:

弹窗属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
needShowPrivacyAlert | 设置二次弹窗是否需要显示 | boolean | 默认true。
|
privacyAlertWidth | 二次弹窗宽度 | Length | 90% |
privacyAlertHeight | 二次弹窗高度 | Length | 60% |
privacyAlertBackgroundColor | 二次弹窗背景色 | ResourceColor | #FFFFFFFF 白色 |
privacyAlertBorderRadius | 二次弹窗边角 | Length | BorderRadiuses | LocalizedBorderRadiuses | { topLeft: 10, topRight: 10, bottomLeft:10, bottomRight:10 } |
privacyAlertAutoCancel | 二次弹窗点击弹窗外区域自动取消弹窗 | boolean | 默认false。
|
privacyAlertAlignment | 二次弹窗居中位置 | DialogAlignment | DialogAlignment.Bottom底部 |
privacyAlertMaskColor | 二次弹窗蒙层颜色 | ResourceColor | #22000000 |
privacyAlertTransition | 二次弹窗弹出动画 | TransitionEffect | TransitionEffect.move(TransitionEdge.BOTTOM).animation({ duration: 100 })底部弹出 |
标题栏属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
privacyAlertTitleText | 二次弹窗标题文本 | string | 请阅读并同意以下条款 |
privacyAlertTitleFontColor | 二次弹窗标题文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertTitleFontSize | 二次弹窗标题文本字体大小 | number | 22 |
privacyAlertTitleFontWeight | 二次弹窗标题文本字体粗细 | FontWeight | FontWeight.Normal |
协议栏属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
privacyAlertContentVisibility | 二次弹窗协议文本是否显示 | Visibility | Visibility.Visible显示 |
privacyAlertContentLineHeight | 二次弹窗协议文本行高 | number | string | Resource | 24 |
privacyAlertContentMargin | 二次弹窗协议文本边距 | Margin | { left: 20, top:40, right: 20 }; |
privacyAlertContentAlignRuleOption | 二次弹窗协议文本相对位置 | AlignRuleOption | { top: { anchor: 'prvacy_title', align: VerticalAlign.Bottom }, middle: { anchor: '__container__', align: HorizontalAlign.Center }, }默认位于标题栏下方 |
privacyAlertOperatorFontColor | 二次弹窗运营商协议文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertOperatorFontSize | 二次弹窗运营商协议文本字体大小 | number | 16 |
privacyAlertOperatorFontWeight | 二次弹窗运营商协议文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanBeforeText | 二次弹窗协议前置文本 | string | 我已阅读并同意 |
privacyAlertSpanBeforeFontSize | 二次弹窗协议前置文本字体大小 | number | 16 |
privacyAlertSpanBeforeFontWeight | 二次弹窗协议前置文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanBeforeFontColor | 二次弹窗协议前置文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertSpanOneText | 二次弹窗协议一文本 | string | '' |
privacyAlertSpanOneUrl | 二次弹窗协议一网址 | string | '' |
privacyAlertSpanOneFontWeight | 二次弹窗协议一文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanOneFontSize | 二次弹窗协议一文本字体大小 | number | 16 |
privacyAlertSpanOneFontColor | 二次弹窗协议一文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertSpanTwoText | 二次弹窗协议二文本 | string | '' |
privacyAlertSpanTwoUrl | 二次弹窗协议二网址 | string | '' |
privacyAlertSpanTwoFontWeight | 二次弹窗协议二文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanTwoFontSize | 二次弹窗协议二文本字体大小 | number | 16 |
privacyAlertSpanTwoFontColor | 二次弹窗协议二文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertSpanThreeText | 二次弹窗协议三文本 | string | '' |
privacyAlertSpanThreeUrl | 二次弹窗协议三网址 | string | '' |
privacyAlertSpanThreeFontWeight | 二次弹窗协议三文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanThreeFontSize | 二次弹窗协议三文本字体大小 | number | 16 |
privacyAlertSpanThreeFontColor | 二次弹窗协议三文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertSpanEndText | 二次弹窗协议后置文本 | string | '' |
privacyAlertSpanEndFontSize | 二次弹窗协议后置文本字体大小 | number | 16 |
privacyAlertSpanEndFontWeight | 二次弹窗协议后置文本字体粗细 | FontWeight | FontWeight.Normal |
privacyAlertSpanEndFontColor | 二次弹窗协议后置文本字体颜色 | ResourceColor | Color.Black 黑色 |
确认按钮属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
privacyAlertConfirmBtnText | 二次弹窗确认按钮文本 | string | 确定 |
privacyAlertConfirmBtnMargin | 二次弹窗确认按钮外边距 | Margin | { left:'40vp', } |
privacyAlertConfirmBtnPadding | 二次弹窗确认按钮内间距 | Padding | {} |
privacyAlertConfirmBtnFontSize | 二次弹窗确认按钮文本字体大小 | number | 18 |
privacyAlertConfirmBtnVisibility | 二次弹窗确认按钮是否显示 | Visibility | Visibility.Visible显示 |
privacyAlertConfirmBtnWidth | 二次弹窗确认按钮宽度 | Length | '32%' |
privacyAlertConfirmBtnHeight | 二次弹窗确认按钮高度 | Length | '48vp' |
privacyAlertConfirmBtnBorder | 二次弹窗确认按钮边框 | Length | BorderRadiuses | LocalizedBorderRadiuses | '4vp' |
privacyAlertConfirmBtnAlignRuleOption | 二次弹窗确认按钮相对位置 | AlignRuleOption | { center: { anchor: '__container__', align: VerticalAlign.Center }, left:{anchor:'__container__',align:HorizontalAlign.Start} } |
privacyAlertConfirmBtnFontColor | 二次弹窗确认按钮触摸点击文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertConfirmBtnDisableFontColor | 二次弹窗确认按钮文本字体颜色 | ResourceColor | Color.Gray |
privacyAlertConfirmBtnBackGroundColor | 二次弹窗确认按钮点击触摸背景色 | ResourceColor | #3791EC |
privacyAlertConfirmBtnDisableBackGroundColor | 二次弹窗确认按钮背景色 | ResourceColor | #80BDF4 |
privacyAlertConfirmBtnBackGroundImage | 二次弹窗确认按钮点击触摸背景图片 | Resource | 无 |
privacyAlertConfirmBtnDisableBackGroundImage | 二次弹窗确认按钮背景图片 | Resource | 无 |
privacyAlertConfirmBtnBorderWidth | 二次弹窗确认按钮点击触摸边框宽度 | Length | '1vp' |
privacyAlertConfirmBtnDisableBorderWidth | 二次弹窗确认按钮边框宽度 | Length | '1vp' |
privacyAlertConfirmBtnBorderColor | 二次弹窗确认按钮点击触摸边框颜色 | ResourceColor | Color.White |
privacyAlertConfirmBtnDisableBorderColor | 二次弹窗确认按钮边框颜色 | ResourceColor | Color.Gray |
取消按钮属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
privacyAlertCancelBtnText | 二次弹窗取消按钮文本 | string | 确定 |
privacyAlertCancelBtnMargin | 二次弹窗取消按钮外边距 | Margin | { left:'50vp', } |
privacyAlertCancelBtnPadding | 二次弹窗取消按钮内间距 | Padding | {} |
privacyAlertCancelBtnFontSize | 二次弹窗取消按钮文本字体大小 | number | 18 |
privacyAlertCancelBtnVisibility | 二次弹窗取消按钮是否显示 | Visibility | Visibility.Visible显示 |
privacyAlertCancelBtnWidth | 二次弹窗取消按钮宽度 | Length | '32%' |
privacyAlertCancelBtnHeight | 二次弹窗取消按钮高度 | Length | '48vp' |
privacyAlertCancelBtnBorder | 二次弹窗取消按钮边框 | Length | BorderRadiuses | LocalizedBorderRadiuses | '4vp' |
privacyAlertCancelBtnAlignRuleOption | 二次弹窗取消按钮相对位置 | AlignRuleOption | { center: { anchor: '__container__', align: VerticalAlign.Center }, left:{anchor:'confirmBtn',align:HorizontalAlign.End} }; |
privacyAlertCancelBtnFontColor | 二次弹窗取消按钮触摸点击文本字体颜色 | ResourceColor | Color.Black 黑色 |
privacyAlertCancelBtnDisableFontColor | 二次弹窗取消按钮文本字体颜色 | ResourceColor | Color.Gray |
privacyAlertCancelBtnBackGroundColor | 二次弹窗取消按钮点击触摸背景色 | ResourceColor | #3791EC |
privacyAlertCancelBtnDisableBackGroundColor | 二次弹窗取消按钮背景色 | ResourceColor | #80BDF4 |
privacyAlertCancelBtnBackGroundImage | 二次弹窗取消按钮点击触摸背景图片 | Resource | 无 |
privacyAlertCancelBtnDisableBackGroundImage | 二次弹窗取消按钮背景图片 | Resource | 无 |
privacyAlertCancelBtnBorderWidth | 二次弹窗取消按钮点击触摸边框宽度 | Length | '1vp' |
privacyAlertCancelBtnDisableBorderWidth | 二次弹窗取消按钮边框宽度 | Length | '1vp' |
privacyAlertCancelBtnBorderColor | 二次弹窗取消按钮点击触摸边框颜色 | ResourceColor | Color.White |
privacyAlertCancelBtnDisableBorderColor | 二次弹窗取消按钮边框颜色 | ResourceColor | Color.Gray |
自定义组件属性
属性名称 | 属性释义 | 属性类型 | 默认值 |
privacyAlertComponent | 二次弹窗自定义组件 | WrappedBuilder<[]> | 无,可参见集成文档示例。 |