小程序是越来越开放了，微信版本 6.6.0可以自定义导航？

先了解下app.json中window配置navigationStyle属性，即导航栏样式，仅支持 default/custom。custom 模式可自定义导航栏，只保留右上角胶囊状的按钮

"window":{

    "navigationBarTitleText": "test",

    "navigationBarTextStyle": "black",

    "navigationBarBackgroundColor": "#aa154e",

    "enablePullDownRefresh": true,

    "backgroundColor": "#aa154e",

    "backgroundTextStyle": "dark",

    "onReachBottomDistance":15,

    "navigationStyle": "custom"

  }

如果设置了"navigationStyle": "custom"，则在真机上"navigationBarTitleText": "test"是不起作用的，并且小程序是全屏展示的，因此除了右上角胶囊状的按钮，导航栏处我们可以自由发挥

微信小程序-如何自定义导航栏（navigationStyle）？的更多相关文章

  1. 微信小程序：自定义导航栏

    在小程序开发的时候会遇到一些页面不需要头部导航,或像淘宝的商品详情一样自定义的导航栏.那先要清楚这导航可不能写死,每种手机的导航都各不相同. 一.在app.json的window对象中定义导航的样式: ...

  2. 微信小程序之自定义导航栏（可实现动态添加）以及swiper（swiper-item）实现自动切换，导航标题也跟着切换

    <view class="movie-container"> <!-- 导航栏 --> <view > <scroll-view scro ...

  3. 微信小程序实现navbar导航栏

    一.效果图 二.涉及到组件 1.view组件 2.swiper组件 三.原理 整体来讲是比较简单的,顶部的navbar是使用flex进行布局的:下面的内容区域则是使用到swiper组件,使用方式比较简 ...

  4. 微信小程序之页面导航栏

    效果图: 页面有点丑,作为初次学习,页面可以要求不那么美观,先学会再说.毕竟后面可以优化的很漂亮. 代码实例如下: <view class="section btn-area" ...

  5. 微信小程序入门四: 导航栏样式、tabBar导航栏

    实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...

  6. 微信小程序之顶部导航栏

    wxml: <!--导航条--><view class="navbar"> <text wx:for="{{navbar}}" d ...

  7. 微信小程序添加底部导航栏

    修改 app.json 文件即可 "tabBar": { "selectedColor": "#1296db", "list&qu ...

  8. 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

    参考文章: 微信小程序 修改(自定义) 单选/复选按钮样式 checkbox/radio样式自定义

  9. 微信小程序中自定义modal

    微信小程序中自定义modal .wxml <modal hidden="{{hidden}}" title="这里是title" confirm-text ...

随机推荐

  1. Linux内核中的常用宏container_of其实很简单

    http://blog.csdn.net/npy_lp/article/details/7010752 通过一个结构体变量的地址,求该结构体的首地址. #ifndef CONTAINER_OF #de ...

  2. cgroups 命令集

    cgroups 命令集 最后介绍,功能最为强大的控制组(cgroups)的用法.cgroups 是 Linux 内核提供的一种机制,利用它可以指定一组进程的资源分配. 具体来说,使用 cgroups, ...

  3. 图片上传（方法一：jquery.upload.js）

    一.在JSP页面引入jquery.upload.js 文件: <script type="text/javascript" src="${ctx}/script/j ...

  4. 删除空格-sed

    如下,我需要提取出‘wan’这个字符串.可以发现在‘wan’的前后是有空格,需要将其删除. # lxc list # lxc list | grep lxdbr0 | awk -F "|&q ...

  5. Apple Tree POJ - 3321 dfs序列构造树状数组（好题）

    There is an apple tree outside of kaka's house. Every autumn, a lot of apples will grow in the tree. ...

  6. bzoj 3212 Pku3468 A Simple Problem with Integers 线段树基本操作

    Pku3468 A Simple Problem with Integers Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 2173  Solved:  ...

  7. Android滚动栏控件的优化

    背景 由于普通TextView的跑马灯效果与焦点获取有关 所以不能直接使用 之前查找到的控件在数据设置方面存在问题 所以通过寻找github上的开源控件 并修改源码 得到一个目前感觉不错的效果 原理  ...

  8. [Luogu 3966] TJOI 2013 单词

    经典ACAM. 注意单词之间添加字符,以及对重复单词的处理. #include <cstdio> #include <cstring> #include <queue&g ...

  9. 通过java客户端连接hbase 注意事项

    1.通过Java客户端连接Hbase,其中hbase通过zookeeper去管理,需要注意的是客户端端口. 通过在浏览器端输入地址查看:http://192.168.3.206:60010/maste ...

  10. Ubuntu12.04 SVN安装过程

    一.安装SVN和配置SVN 1.安装SVN apt-get install subversion 2.创建SVN目录,项目目录和配置文件目录 mkdir /var/svn mkdir /var/svn ...