位置: IT常识 - 正文

小程序怎么自定义导航栏,导航栏放图片、设置高度(小程序怎么自定义tabbar)

编辑:rootadmin
小程序怎么自定义导航栏,导航栏放图片、设置高度

推荐整理分享小程序怎么自定义导航栏,导航栏放图片、设置高度(小程序怎么自定义tabbar),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:小程序怎么自定义商家,小程序怎么自定义取景框,小程序怎么自定义商品,小程序怎么自定义查询条件,小程序怎么自定义图标,小程序怎么自定义抽奖次数,小程序怎么自定义tabbar,小程序怎么自定义取景框,内容如对您有帮助,希望把文章链接给更多的朋友!

今天来说一下小程序的自定义导航栏。

1、设置导航栏style为custom:

2、这是刷新页面,页面的内容就跑到了页面的顶端,不留丝毫间隙:

小程序怎么自定义导航栏,导航栏放图片、设置高度(小程序怎么自定义tabbar)

3、然后定义一个components,就是我们自定义的导航栏组件: (1)先在项目根目录创建一个components文件夹,这个文件夹的名称是固定的,就是components: (2)文件夹内创建一个导航栏组件的文件夹: (3)右击创建的“nav”文件夹,点击“新建Component”,会自动在该文件夹下生成四个我们常用的文件: (4)下面是代码时间(后端开发写的前端代码,将就看吧): nav.js:

# data中增加barHeight参数data: { barHeight: wx.getSystemInfoSync().statusBarHeight},

nav.wxml:

<view style="padding-top:{{barHeight + 40}}rpx; padding-bottom: 50rpx;"> <view class="topView" bindtap="jumpToAbout"> <image class="topImage" src="/images/logo.png" mode="aspectFill"></image> <text class="topText">自定义导航栏</text> <image class="topIcon" src="/images/right.png"></image> </view> <text class="topSubText">副标题可以写在这里</text></view>

nav.wxss:

.topView { display: flex;}.topImage { height: 60rpx; width: 130rpx;}.topText { margin-left: 12rpx; font-size: larger;}.topIcon { height: 40rpx; width: 40rpx; margin-top: 8rpx;}.topSubText { color: #999;}

4、导航栏组件就定义好了,然后把它引入页面: (1)要引入的页面json配置文件中引用:

{ "usingComponents": { "nav":"../../components/nav/nav" }}

必须用相对路径。 (2)页面中引入组件:

<nav></nav><text>内容</text>

5、最后看效果:

这样就搞定了,希望你们的logo比我的好看。

本文链接地址:https://www.jiuchutong.com/zhishi/288006.html 转载请保留说明!

上一篇:最贵的照片是什么(最贵的十张照片)

下一篇:springboot:各种下载文件的方式(springboot常用)

  • 论坛营销发帖推广技巧(论坛营销发帖推广文案)

    论坛营销发帖推广技巧(论坛营销发帖推广文案)

  • 荣耀magic3怎么投屏(荣耀magic3怎么投屏到电脑)

    荣耀magic3怎么投屏(荣耀magic3怎么投屏到电脑)

  • 苹果13带不带充电器(苹果13有充电吗)

    苹果13带不带充电器(苹果13有充电吗)

  • 什么是网络协议(什么是网络协议?协议的三要素是什么?)

    什么是网络协议(什么是网络协议?协议的三要素是什么?)

  • 荣耀30pro+防水级别是多少(荣耀30pro防水等级多少)

    荣耀30pro+防水级别是多少(荣耀30pro防水等级多少)

  • qq解除关系(qq解除关系或者添加好友是什么)

    qq解除关系(qq解除关系或者添加好友是什么)

  • 斗鱼直播需要什么设备(斗鱼直播需要什么条件才能开)

    斗鱼直播需要什么设备(斗鱼直播需要什么条件才能开)

  • 网线比wifi快吗(网线网速比wifi快吗)

    网线比wifi快吗(网线网速比wifi快吗)

  • 拼多多退货包运费是商家出还是平台出(拼多多退货包运费规则)

    拼多多退货包运费是商家出还是平台出(拼多多退货包运费规则)

  • 爱奇艺pc什么意思(爱奇艺pcweb端是什么意思)

    爱奇艺pc什么意思(爱奇艺pcweb端是什么意思)

  • 苹果13.2.3系统更新了什么(苹果更新13.2)

    苹果13.2.3系统更新了什么(苹果更新13.2)

  • 安全模式怎么解除魅族(安全模式怎么解除华为)

    安全模式怎么解除魅族(安全模式怎么解除华为)

  • 微信无法实名认证怎么解决(微信无法实名认证 5个)

    微信无法实名认证怎么解决(微信无法实名认证 5个)

  • 苹果手机开不了机怎么办(苹果手机开不了机只显示白苹果)

    苹果手机开不了机怎么办(苹果手机开不了机只显示白苹果)

  • 手机投屏在哪里找到(手机投屏神器)

    手机投屏在哪里找到(手机投屏神器)

  • vivo云服务怎么清空(vivo云服务怎么导出联系人)

    vivo云服务怎么清空(vivo云服务怎么导出联系人)

  • 荣耀手环5i支持哪些运动模式(荣耀手环5i可以无线充电吗)

    荣耀手环5i支持哪些运动模式(荣耀手环5i可以无线充电吗)

  • 手机照片怎么缩小尺寸(手机照片怎么缩放比例)

    手机照片怎么缩小尺寸(手机照片怎么缩放比例)

  • 快手移除粉丝怎么找回(快手移除粉丝怎么对方还在关注)

    快手移除粉丝怎么找回(快手移除粉丝怎么对方还在关注)

  • 钉钉请假怎么撤销(钉钉请假怎么撤销,会通知审批人嘛)

    钉钉请假怎么撤销(钉钉请假怎么撤销,会通知审批人嘛)

  • 快手存储空间怎么清理(快手存储空间怎么清理掉)

    快手存储空间怎么清理(快手存储空间怎么清理掉)

  • oppo下滑搜索怎么取消(oppo手机下拉搜索)

    oppo下滑搜索怎么取消(oppo手机下拉搜索)

  • 控制台警告Invalid prop: type check failed for prop “modelValue“. Expected Number with value 0, got String(warning control)

    控制台警告Invalid prop: type check failed for prop “modelValue“. Expected Number with value 0, got String(warning control)

  • wlan和wifi的区别介绍(wlan和蜂窝版的区别)

    wlan和wifi的区别介绍(wlan和蜂窝版的区别)

  • m级纳税人如何变成b级
  • 主管税务机关是否参与清算
  • 内蒙古注册税务师协会
  • 人力资源公司代招的岗位可以去吗
  • 所得税费用在利润表中应在税金及附加项目中填列
  • 其他应收款科目未经财务会计部门和运行管理部门
  • 未达起征点是什么
  • 售后回租会计处理研究国外相关研究成果
  • 企业所得税减半征收政策
  • 物业公司收到开发代付物业管理费怎么做账
  • 以前年度固定资产入账错误怎么办?
  • 出口商品一定要有条形码吗
  • 境内企业转让境外股权税收
  • 增值税普通发票税率
  • 增值税征收比例和征收方式
  • 收到专票未抵扣,销售方作废怎么处理
  • 教育附加费和地方教育附加费的计算
  • 个人所得税申报错误如何更正申报
  • 税法递延纳税
  • 会计档案保管最新规定
  • 企业年金个税如何计提
  • 未取得发票怎么做纳税调增操作
  • 不动产权时间怎么确认
  • 试用期可以不交五险一金吗
  • 日常服务app
  • 2020年餐饮行业免税政策
  • abs付款是现金吗
  • 出口退税最新规定2021
  • 毛利率与净利率的差额
  • 苹果手机m开头的序列号代表什么
  • 怎么设置静音iphone
  • win10如何删除windows账户
  • 应收账款重分类什么意思
  • 运输发票备注规定
  • 银行承兑汇票背书会计分录
  • 西方会计要素有哪些
  • 其他暂收应付款项有哪些
  • PHP:Memcached::getResultMessage()的用法_Memcached类
  • php dom
  • php excel导入数据
  • cookies方法
  • php获取路径和目录的方法
  • 待提出票据交换及转汇款怎么做账
  • 税控机维护费抵扣分录
  • 局部规划算法
  • 动态内存管理
  • 境外企业在境内提供服务 企业所得税
  • 工会经费月月都缴纳吗?
  • 免税的10万元是什么
  • 酒店周转材料怎么摊销
  • 收到退回的企业所得税,资产负债表如何填
  • 红字发票冲销的申请表是税务局开吗
  • 房产税土地税会减免吗
  • 购买产品样品计入什么科目
  • 劳务税可以抵扣企业税比例
  • 无偿赠送的货物如何申报增值税
  • 去银行更换帐户需要什么
  • 年末进项大于销项怎么结转
  • 增值税纳税申报表在哪里打印
  • 明细账的作用
  • mysql die
  • win10系统怎么调
  • mac怎么保存网页到桌面
  • 惠普台式笔记本一体机电脑bios中文
  • 怎么处理鲍鱼
  • win7电脑老是跳出弹窗广告怎么办
  • linux安装tmux
  • EXTjs4.0的store的findRecord的BUG演示代码
  • .material design
  • 深入解析windows第7版pdf
  • unity 设置物体角度
  • javascript indexOf函数使用说明
  • js中的eval
  • JavaScript Math.round() 方法
  • 国税系统重点领导名单
  • 成效显著的近义词和反义词
  • 国税注销需要什么资料
  • 如何加强木材加工质量
  • 城市建设维护税减免政策
  • 京牌车船税网上可以交吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设