quickapp_快应用_titleBar

news2025/2/25 9:23:04

titleBar

        • 问题1-titleBar背景设置不支持渐变色
        • 问题2- 状态栏背景颜色设置不支持渐变
        • 问题3-titleBar的标题不支持居中

在这里插入图片描述
如上图所示红色区域就是titleBar,我们可以通过manifest.display设置titleBar的文本、文本颜色、背景色

"display": {
  "titleBar": true, //是否显示titleBar
   "titleBarBackgroundColor": "#f00000", // 全局titleBar背景色
   "titleBarTextColor": "#ffffff", // 全局titleBar的title文本颜色
   "titleBarText": "快应用", // 全局titleBar的title文本内容
   "pages": { // 页面私有UI显示,不设置默认使用全局配置
     "pages/DemoDetail": {
       "titleBarText": "详情页" 
     }
   }
 }
问题1-titleBar背景设置不支持渐变色

如上图想在titleBar想做一个背景渐变色,于是进行如下设置

 "display": {
   "titleBar": true, //是否显示titleBar
    "titleBarBackgroundColor": "linear-gradient(78deg, #FFEBF1 0%, #FEF2F4 48%, #E1EDFF 100%);", // 全局titleBar背景色
}

发现背景颜色显示的是黑色(默认值),说明titleBarBackgroundColor配置项不支持渐变色格式的颜色。

那如果想做渐变色应该如何设置呢?

可以通过titleBar: false关闭配置项的titleBar,在页面上添加一个titleBar的组件!

问题2- 状态栏背景颜色设置不支持渐变

在这里插入图片描述
如上图所示为状态栏

tips:状态栏背景色,默认值同标题栏背景色

由于之前在manifest中配置了titleBar设置了颜色,statusBar颜色默认与titleBar相同,所以看起来没有割裂的感觉。

现在使用自定义titleBar并且给titleBar背景设置了渐变色,此时这两部分就会有被割裂的感觉,如下
在这里插入图片描述

tips: 状态栏的背景不能设置渐变色 且 状态栏不可隐藏不可自定义!

因此状态栏不可以设置为渐变色,若是想看起来不那么割裂,可以设置状态栏背景色为与titleBar背景渐变色初识颜色相近的颜色。

"display":{
  "pages":{
     "pages/main/library": {
        "statusBarBackgroundColor": "#ffe9f2", // 状态栏背景色,默认值同标题栏背景色
        "titleBar": false
      }
   }
}
问题3-titleBar的标题不支持居中

通过manifest配置项设置titleBar的标题默认居左且不支持修改,若是想要标题居中需要使用自定义tabBar;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1285692.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python 模块--详细整理

Python 模块 在开发过程中,我们写的代码越来越多,如果把它们都写在一个文件中,就会变得越来越长,也越来越难以维护。 后来我们学习了函数,它可以将一段重复使用的代码封装到一个函数中,这样我们就可以轻松地…

NSS [NSSCTF 2022 Spring Recruit]babyphp

NSS [NSSCTF 2022 Spring Recruit]babyphp 考点&#xff1a;PHP特性 开局源码直接裸奔 <?php highlight_file(__FILE__); include_once(flag.php);if(isset($_POST[a])&&!preg_match(/[0-9]/,$_POST[a])&&intval($_POST[a])){if(isset($_POST[b1])&&…

视频剪辑方法:AI智剪高效稳定,视频批量处理有技巧

随着社交媒体的兴起和视频制作工具的普及&#xff0c;视频剪辑已经成为一项重要的工作。然而对于许多非专业创作者来说&#xff0c;视频剪辑可能是一项困难的任务。所幸AI智剪提供了一种高效稳定的视频剪辑方法&#xff0c;使得视频批量处理变得更加简单。使用AI智剪可以大大节…

腾讯云轻量应用服务器怎么安装宝塔Linux面板?

腾讯云轻量应用服务器宝塔面板怎么用&#xff1f;轻量应用服务器如何安装宝塔面板&#xff1f;在镜像中选择宝塔Linux面板腾讯云专享版&#xff0c;在轻量服务器防火墙中开启8888端口号&#xff0c;然后远程连接到轻量服务器执行宝塔面板账号密码查询命令&#xff0c;最后登录和…

express中配置swagger并配置token信息

express中配置swagger并配置token信息 1. 安装swagger-jsdoc cnpm install swagger-jsdoc1.3.0 --save2. 在项目根目录下的config目录下新建swagger.js文件并添加配置项 // 引入swagger const swaggerJSDoc require(swagger-jsdoc) // swagger定义 const swaggerDefinitio…

代码签名的工作原理

代码签名的基础是PKI安全体系。代码签名证书由签名证书私钥和公钥证书两部分组成。私钥用于代码的签名&#xff0c;公钥用于私钥签名的验证和证书持有者的身份识别。 1. 发布者从CA机构&#xff08;如JoySSL&#xff09;申请数字证书&#xff1b; 2. 发布者开发出代码&#x…

深入浅出理解kafka ---- 万字总结

1.Kafka简介 Kafka 本质上是一个 MQ&#xff08;Message Queue&#xff09;&#xff0c;使用消息队列的优点&#xff1a; 解耦&#xff1a;允许独立的扩展或修改队列两边的处理过程。可恢复性&#xff1a;即使一个处理消息的进程挂掉&#xff0c;加入队列中的消息仍然可以在系…

300之内的开放式耳机哪款好?超高人气的平价开放式耳机推荐

开放式耳机以其宽广的音场和逼真的音质逐渐成为耳机爱好者们追逐的焦点&#xff0c;在众多选择中&#xff0c;寻找一款既在性能上出众又价格亲民的开放式耳机可谓是一项挑战&#xff0c;为了帮助大家在300之内找到超高人气好用的平价开放式耳机&#xff0c;我们精心筛选了几款备…

山西电力市场日前价格预测【2023-12-05】

日前价格预测 预测说明&#xff1a; 如上图所示&#xff0c;预测明日&#xff08;2023-12-05&#xff09;山西电力市场全天平均日前电价为118.23元/MWh。其中&#xff0c;最高日前电价为305.71元/MWh&#xff0c;预计出现在00:15。最低日前电价为0.00元/MWh&#xff0c;预计出…

自定义TypeHandler 将mysql返回的逗号分隔的String转换到List

sql执行如下&#xff1a; 这里我定义的接受类&#xff1a; 但是这里报了错JSON parse error: Cannot deserialize value of type java.util.ArrayList<java.lang.String>from Object value (token JsonToken.START_OBJECT); nested exception is com.fasterxml.jackson…

MySQL limit导致索引选择(选择的并不是最佳索引)案例分析

mysql limit导致索引选择&#xff08;选择的并不是最佳索引&#xff09;案例分析&#xff1a; 这种情况可能是mysql优化器内部bug造成&#xff1a; bug 触发条件如下: 1.优化器先选择了 where 条件中字段的索引&#xff0c;该索引过滤性较好&#xff1b; 2.SQL 中必须有 orde…

基于vue+node.js智慧校园学生办证系统

基于vuenode.js智慧校园学生办证系统 摘要&#xff1a;随着计算机技术和网络技术的飞快发展&#xff0c;它加速了国内信息化建设的进程&#xff0c;信息技术对管理改革产生了深远的影响。为了适应新时代的发展趋势&#xff0c;各行各业都高度重视信息化建设。在教育领域&#…

优雅草蜻蜓I即时通讯·水银版私有化部署之java服务端搭建教程-01

目录 前言1 1 安装 mongodb2 2 安装 redis3 3. 安装jdk3 4 解压 spring-boot-imapi3 5.开始安装 消息队列组件 rocket4 6. 安装推送服务5 7. 安装 message-push5 8. 安装uplooad 服务5 9&#xff1a; 安装nginx 服务7 1.不需要SSL7 2.需要SSL7 五&#xff1a;编译…

【面试】测试/测开(ING)

63. APP端特有的测试 64. 服务异常情况验证 65. 用什么做性能测试 66. Jmeter如何设计测试场景 67. 压测怎么做 69. UI自动化元素定位方法 参考&#xff1a;UI自动化元素定位 70. gpu和cpu有什么区别 71. gpu性能收哪些因素的影响 72. 共享内存&#xff0c;线程安全吗…

学习pytorch17 pytorch模型保存及加载

pytorch模型保存及加载 代码 import torch import torchvisionvgg16 torchvision.models.vgg16(pretrainedFalse)# 1. save model 1 保存模型结构及模型参数 torch.save(vgg16, ./vgg16_save1.model)# 2. save model 2 只保存模型参数 比第一种保存方法保存的文件要小 t…

整数和浮点数在内存中的存储​(大小端详解)

目录 一、整数在内存中的存储 二、大小端字节序和字节序判断 2.1为什么有大小端?​ 2.2请简述大端字节序和小端字节序的概念&#xff0c;设计一个小程序来判断当前机器的字节序。&#xff08;10分&#xff09;-百度笔试题 方法一&#xff08;char*强制类型转换&#xff09…

【langchain实战】开源项目-RasaGpt

1、概述 RasaGpt是一个建立在 Rasa 和 Langchain 之上的没有显示界面的LMM聊天机器人平台。它是一个Rasa和Telegram这种利用像Langchain这样的LMM库进行索引、检索和上下文注入的样板及参考实现。 开源地址&#xff1a; GitHub - paulpierre/RasaGPT: &#x1f4ac; RasaGPT is…

石原子科技荣登「2024 中国企业服务云图」,引领数据价值在线化革命,助力企业省心省钱更安全

近日&#xff0c;2023 年中国 SaaS 大会在美丽的苏州太湖隆重召开。本次大会由吴中区人民政府、苏州市工信局指导&#xff0c;崔牛会主办&#xff0c;苏州太湖国家旅游度假区管委会协办。会上&#xff0c;知名B2B企业服务平台崔牛会联合火山引擎正式发布了「2024 中国企业服务云…

JS浮点数精度问题及解决方案

前端面试大全JS浮点数精度问题及解决方案 &#x1f31f;经典真题 &#x1f31f;浮点数精度常见问题 &#x1f31f;为什么会有这样的问题 &#x1f31f;真题解答 &#x1f31f;总结 &#x1f31f;经典真题 为什么 console.log(0.20.10.3) 得到的值为 false &#x1f31f;…

C语言之多重循环

目录 二重循环 用break语句强制结束循环 显示图形 绘制等腰直角三角形 多重循环 continue语句 将循环语句的循环体作为循环语句&#xff0c;就可以进行二重、三重循环。这样的循环称为多重循环。 我们先来了解二重循环 二重循环 在之前我们学习到的循环中的程序都比较简…