请选择 进入手机版 | 继续访问电脑版

首页使用TabLayout布局,配置app.json如何配置导航栏

[复制链接]
areyouok 发表于 2022-1-21 15:45:08
https://docs.apicloud.com/Client-API/api#openTabLayout
配置app.json,如何让导航栏也展示出来呢。
不想写header的情况下如何配置。


默认导航栏的使用
如果您的项目只需要支持App端,不需要支持多端,那么对于导航栏定制要求不高的页面,我们依然推荐您使用TabLayout的导航栏。虽然可以非常简单地通过组件自己实现导航栏,也不会像window + frame布局那样增加内存占用,但是自定义导航栏还是有js解析、布局计算等过程,而且还需要处理安全区域问题,使用TabLayout则会体验更加极致。

8条回复

技术支持-F 管理员 26214Y币
// 创建一个app.json文件,放置在widget目录下
{
  "name": "root",
  "tabBar": {
    "frames": [{
     
      "name": "page1",
      "url": "widget://html/page1.html"
    }, {
     
      "name": "page2",
      "url": "widget://html/page2.html"
    }, {
     
      "name": "page3",
      "url": "widget://html/page3.html"
    }],
    "list": [{
      
      "iconPath": "widget://image/tab_1.png",
      "selectedIconPath": "widget://image/tab_1_hov.png"
    }, {
     
      "iconPath": "widget://image/tab_2.png",
      "selectedIconPath": "widget://image/tab_2_hov.png"
    }, {
      
      "iconPath": "widget://image/tab_3.png",
      "selectedIconPath": "widget://image/tab_3_hov.png"
    }]
  }
}

// config.xml中设置content字段的值为JSON文件的路径:
<content src="app.json" />
areyouok 实习司机 219Y币
本帖最后由 areyouok 于 2022-1-21 16:05 编辑

是创建了这个文件,tabbar是出来了。但是tabbar页面里没有导航栏,默认的avm模板。问题是导航栏能通过配置展示吗。还是说需要自己写header组件。因为看到文档里中有写自己实现的导航栏不如tablayout
技术支持-F · 2022-1-21 15:54// 创建一个app.json文件,放置在widget目录下
{
  "name": "root",

技术支持-F 管理员 26214Y币
navigationBar:

类型:JSON对象
默认值:无
描述:(可选项)顶部navigationBar导航栏配置信息
内部字段:

这个参数配置上
areyouok · 2022-1-21 16:02是创建了这个文件,tabbar是出来了。但是tabbar页面里没有导航栏,默认的avm模板。问题是导航栏能通过配置展示吗。还是说需要自己写header组件。因为看到文档里中有写自己实现的导航栏不如tablayout

...
就叫双双 新手上路 160Y币
可以自己写一个tabbar嘛
特特法爷 管理员 3370Y币
可以,用这个方便点
就叫双双 · 2022-1-21 16:15可以自己写一个tabbar嘛
areyouok 实习司机 219Y币
配置再和 tabbar同级下可以了,多谢
技术支持-F · 2022-1-21 16:14navigationBar:

类型:JSON对象
技术支持-F 管理员 26214Y币
yjy123456 新手上路 73Y币
学会了。。。。。
您需要登录后才可以回帖 登录

本版积分规则