首页 > 编程语言 >app直播源码,uniapp之自定义顶部样式

app直播源码,uniapp之自定义顶部样式

时间:2023-11-27 14:13:10浏览次数:39  
标签:uniapp 自定义 样式 app 源码 navPadTop menuInfo

app直播源码,uniapp之自定义顶部样式

 

//需要自定义顶部样式的页面配置
{
"path" : "pages/case/index",
"style" :                                                                                    
{
    "navigationBarTitleText": "案例",
"navigationStyle": "custom",
    "enablePullDownRefresh": true
}
},
 
//默认顶部样式
{
"path":"pages/houseVideo/index",
"style" :
{
"navigationBarTitleText": "云看房",
"enablePullDownRefresh": true
}
},
 
 
 
//两者的区别就是navigationStyle参数
  

 

接下来就是自己在需要自定义头部样式的页面   自己编写相关css样式即可

 

涉及到数据就是幸好栏需要的高度和padding值


// 计算自定义头部的高度和padding
calcCustomPosi() {
const systemInfo = uni.getSystemInfoSync(); //获取系统信息同步接口。
const menuInfo = uni.getMenuButtonBoundingClientRect(); //
let navPadTop = systemInfo.statusBarHeight,
navHeight = 0;
navHeight = menuInfo.height + (menuInfo.top - navPadTop) + (menuInfo.bottom - menuInfo.height - navPadTop);
this.navPadTop = navPadTop + 'px';
this.navHeight = navHeight + 'px';
}

以上就是app直播源码,uniapp之自定义顶部样式, 更多内容欢迎关注之后的文章 

 

标签:uniapp,自定义,样式,app,源码,navPadTop,menuInfo
From: https://www.cnblogs.com/yunbaomengnan/p/17859102.html

相关文章

  • Vue中自定义组件监听事件传参
    自定义数字框组件如下<template><divclass="count-box"><button@click="handleSub"class="minus">-</button><input:value="value"@change="handleChange"class="inp"typ......
  • uniapp中的computed
    在UniApp中,computed是一个特殊的属性,用于计算属性。它与Vue.js中的computed属性类似,用于根据已有的数据计算出一个新的属性值。在UniApp中,使用computed属性可以方便地根据多个变量或表达式计算出一个新的变量值,并且当依赖的数据变化时,computed属性会自动更新。<template><......
  • Netty 源码分析
    ServerBootstrap主要介绍服务端的启动流程以及如何绑定端口号、开启服务端Socket并让其进入接收连接状态的启动模板如下;try{ChannelFuturefuture=newServerBootstrap().group(bossGroup,workerGroup).channel(NioServerSocketChannel.class)......
  • uniapp接入腾讯地图实现定位导航功能。
    转自:https://blog.csdn.net/qq_54753561/article/details/129500254 打开腾讯地图的官网注册账号登陆进入,滑入我的头像开发者信息:https://lbs.qq.com/service/webService/webServiceGuide/webServiceOverview 2找到添加的应用,添加key 3 webService API查询 4然后......
  • PIP换源_Pycharm快捷键_自定义文件头模板
    【一】PIP更换国内源永久换源打开控制台或终端,并输入以下命令:pipconfigsetglobal.index-urlhttps://mirrors.aliyun.com/pypi/simple/更改pip源后,可以通过以下命令验证:pipconfiggetglobal.index-url如果返回值为https://mirrors.aliyun.com/pypi/simple/,则表......
  • socket.on可以直接添加自定义事件吗,理解socket的事件触发与响应
    在Web开发中,socket.on通常是用于注册处理特定事件的回调函数的方法。它主要用于处理Socket.IO库中的预定义事件,例如"connect"、"disconnect"、"message"等。然而,Socket.IO也允许你添加自定义事件,以便在客户端和服务器之间进行自定义的双向通信。要使用socket.on来处理自定义事件,......
  • 函数中的库函数与自定义函数
    1.函数是什么:在计算机科学中,子程序也就是函数,是一个大型程序中的某部分代码,由一个或多个语句组成。负责完成某项特定任务,而且相对于其他代码,具有相对的独立性。一般会有输入参数并有返回值,提供对过程的封装和细节的隐藏,这些代码通常被集成为软件库。2.库函数举例:lo函数字符串操作函......
  • Java开发者的Python快速进修指南:自定义模块及常用模块
    好的,按照我们平常的惯例,我先来讲一下今天这节课的内容,以及Java和Python在某些方面的相似之处。Python使用import语句来导入包,而Java也是如此。然而,两者之间的区别在于Python没有类路径的概念,它直接使用.py文件的文件名作为导入路径,并将其余的工作交给Python解释器来扫描和处理。另......
  • Linux-源码下载地址
    【https://mirrors.edge.kernel.org/pub/linux/kernel/v2.4/】【https://www.kernel.org/】......
  • 基于springboot的医护人员排班系统-计算机毕业设计源码+LW文档
    选题的意义、研究内容及方法:(后面附主要参考文献)选题意义目的科学合理地安排医护人员工作,提高医护人员排班效率,在满足各病区个性化的基础上保证医护人员的统一管理。方法采用软件生命周期开发方法,自顶向下,逐步细化。对各个科室医护人员的排班信息进行维护,维护好相关信息后进行......