setNavBarAttr

2022-06-13 14:04 更新

设置导航栏属性

setNavBarAttr({params})

params

background:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)导航栏背景。支持颜色值和图片

shadow:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)导航栏底部阴影线颜色

color:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)导航栏标题文字颜色

fontSize:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)导航栏标题字体大小

fontWeight:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)导航栏标题文字粗细

fontFamily:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)导航栏标题文字字体。只支持iOS。

hideBackButton:

  • 类型:布尔
  • 默认值:无
  • 描述:(可选项)是否隐藏默认返回按钮。可以通过监听 navbackbtn 或 keyback 事件来处理返回按钮的点击事件。

leftButtons:

  • 类型:JSON对象数组
  • 默认值:无
  • 描述:(可选项)导航栏左边按钮组,左边按钮会替换掉默认的返回按钮,按钮按照数组顺序从左至右显示,按钮建议最多2个,可以通过监听 navitembtn 事件来处理按钮点击事件。
  • 内部字段:

[{
    text:                 //(可选项)按钮标题文字,可以和icon同时存在,字符串类型
    color:                //(可选项)按钮标题文字颜色,默认值#000,字符串类型
    fontSize:             //(可选项)按钮标题字体大小。默认值17,数字类型
    fontWeight:           //(可选项)按钮标题字体粗细,默认值normal。字符串类型。Android及iOS8.2以下系统只支持normal、bold,iOS8.2及以上系统支持normal、bold、bolder、lighter、100~900。
    fontFamily:           //(可选项)按钮标题字体。只支持iOS,字符串类型
    iconPath:             //(可选项)按钮 icon 图标路径,可以和 text 同时存在,图片显示大小由图片尺寸和 scale 参数决定,字符串类型
    scale:                //(可选项)图片的缩放倍数,默认为 4,数字类型。显示规则:当 scale 值为 3 时,若设备上面期望显示的图标尺寸为 30*25,则图片实际尺寸需要为 90*75。
}]

rightButtons:

  • 类型:JSON对象数组
  • 默认值:无
  • 描述:(可选项)导航栏右边按钮组。按钮按照数组顺序从右至左显示,按钮建议最多2个,可以通过监听navitembtn事件来处理按钮点击事件。
  • 内部字段:

[{
    text:                 //(可选项)按钮标题文字,可以和icon同时存在,字符串类型
    color:                //(可选项)按钮标题文字颜色,默认值#000,字符串类型
    fontSize:             //(可选项)按钮标题字体大小。默认值17,数字类型
    fontWeight:           //(可选项)按钮标题字体粗细,默认值normal。字符串类型。Android及iOS8.2以下系统只支持normal、bold,iOS8.2及以上系统支持normal、bold、bolder、lighter、100~900。
    fontFamily:           //(可选项)按钮标题字体。只支持iOS,字符串类型
    iconPath:             //(可选项)按钮 icon 图标路径,可以和 text 同时存在,图片显示大小由图片尺寸和 scale 参数决定,字符串类型
    scale:                //(可选项)图片的缩放倍数,默认为 4,数字类型。显示规则:当 scale 值为 3 时,若设备上面期望显示的图标尺寸为 30*25,则图片实际尺寸需要为 90*75。
}]

示例代码

api.setNavBarAttr({
    rightButtons: [{
        text: '完成'
    }]
});

可用性

iOS 系统,Android 系统

可提供的 1.3.2 及更高版本

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号