支付宝小程序导航栏背景颜色全部更换和单个更换

最近在开发支付宝小程序，需求之一是登录页面导航栏变色。打开支付宝API并没有十分理解。写个博客记录解决流程与代码

如果急于看代码。请翻到最下

首先。先祭出支付宝API连接https://docs.alipay.com/mini/api/vzt2xm

先来看API上的：

我拿到支付宝开发工具里试了一下

然后真机上设置颜色的时候会发现报错：颜色不符合什么什么的

支付宝小程序颜色设置支持十六进制。找来找去颜色没问题。然后咱们来看代码

此时估计已经有眼尖的人看到问题了

第一块没有reset

第二块也没有

第三块缺的就更多了。backgroundColor//borderBottomColor//image都没有。真能不报错？大佬是难不住。刚入行的菜鸟呢？

总之。不友好！希望尽快完善下

搞了之后发现只能设置我自创的setnav页面。然后我们举一反三

就可以想到可以

这样控制单个页面的导航栏背景颜色！！！！！！！

同理。如果要全部导航栏变为一个颜色。放到app.js里使用

附加：一个去掉支付宝左上角小房子图标的代码（咱也不知道为啥要去。但是客户要求）

onReady() {
if (my.canIUse('hideBackHome')) {
my.hideBackHome();
}
}，

到此完美收尾。最近应该会更新一些开发支付宝小程序时收获到的其他知识（其他坑）

支付宝小程序导航栏背景颜色全部更换和单个更换相关推荐

支付宝小程序导航栏隐藏及穿透
设置小程序标题栏透明介绍 //uniapp页面设置 "style": {"navigationBarTitleText": ""," ...
html怎么让导航栏背景透明,小程序导航栏背景透明
快速实现导航栏透明依托于WeUI-navigation-bar组件快速时间导航栏透明,效果如下截屏2020-08-19 上午9.20.28.png 话不多说直接上代码: 1.page.json 更 ...
uniapp 微信小程序导航栏设置背景颜色字体颜色
{"path": "pages/company","style":{"navigationBarTitleText": ...
小程序导航栏颜色设置
导航栏的设置在实际的开发过程中,窗口页面的颜色是多样的,小程序默认的导航栏颜色不能满足我们的开发需求,需要自己去设置,刚好,小程序官方文档里提供了解决方法. 在app.json中可以配置全局(默认) ...
android 通知栏背景颜色跟随app导航栏背景颜色变化而变化
原文地址为: android 通知栏背景颜色跟随app导航栏背景颜色变化而变化通知栏(notification)背景颜色跟随app导航栏(top title)背景颜色变化而变化. 这也叫沉浸式状态栏 ...
微信小程序导航栏或菜单栏吸顶效果简单实现
微信小程序导航栏或菜单栏吸顶效果简单实现思路: 1.获取导航栏初始位置距顶部的距离s1(通过获取页面标签方法) 2.监听页面的滑动,获取滑动距离s2(使用onPageScroll) 3.当s2> ...
如何去掉微信小程序导航栏，以及禁止页面滑动
如何去掉微信小程序导航栏,以及禁止页面滑动 1.微信小程序要去掉微信自带的导航栏,只需要在app.json中加上 "navigationStyle": "custom&q ...
微信小程序导航栏高度。分析手机状态栏高度、微信小程序胶囊高度等。
//获取系统信息的概念 console.log(uni.getSystemInfoSync()); let res = uni.getSystemInfoSync() //胶囊按钮的信息 consol ...
【最全IDEA个性化教程】idea设置主题+恢复主题默认设置+设置选中代码颜色+关键字颜色+设置字体大小、样式、颜色+设置背景颜色、图片+设置导航栏背景颜色+设置控制台字体样式及背景+常用快捷键)
目录下载设置主题样式+恢复主题默认设置 1 个性化代码段 1.1设置颜色设置光标颜色自定义图片做背景修改代码段的颜色和背景颜色选中代码块颜色修改,修改括号颜色 1.2 设置字体大小.格式 1 ...
小程序导航栏文字更改
小程序导航栏文字更改在json文件中,对 navigationBarTitleText 进行更改. 如下: {"backgroundTextStyle": "light ...

支付宝小程序导航栏背景颜色全部更换和单个更换

支付宝小程序导航栏背景颜色全部更换和单个更换相关推荐

最新文章

热门文章