码迷,mamicode.com
首页 > 其他好文 > 详细

小程序-导航

时间:2017-03-04 22:27:44      阅读:298      评论:0      收藏:0      [点我收藏+]

标签:src   order   图标   style   lis   参数   pre   log   文件中   

 现在每个小程序的底部基本都会有一个像这样的导航

技术分享

1、需要准备图标(可以去图标库里去下载)

     准备选中和没选中时的2种颜色的图标

技术分享

2、因为是进行全局配置,所以需要在全局的app.js文件中进行设置

  "tabBar": {
    "color":"#a9b7b7",
    "selectedColor":"red",
    "list": [
      {
        "selectedIconPath":"pages/images/movie1.png",
        "iconPath":"pages/images/movie.png",
        "pagePath": "pages/index/index",
        "text": "电影"
      },
      {
        "selectedIconPath":"pages/images/yy1.png",
        "iconPath":"pages/images/yy.png",
        "pagePath": "pages/cinema/cinema",
        "text": "影院"
      },{
        "selectedIconPath":"pages/images/yh1.png",
        "iconPath":"pages/images/yh.png",
        "pagePath": "pages/mine/mine",
        "text": "我的"
      }
    ]
  },

3、tabBar的属性有color,selectedColor,backgroundColor,borderStyle(只接受black/white),list(接受pagePath(页面路径,必须在 pages 中先定义),text,iconPath,selectedIconPath)四个参数,position(默认bottom,设置top则为上面导航)

小程序-导航

标签:src   order   图标   style   lis   参数   pre   log   文件中   

原文地址:http://www.cnblogs.com/zpxm/p/6502738.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!