uni-app --vue3--TypeScript 微信小程序开发

微信小程序开发文档:

https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/getstart.html#%E7%94%B3%E8%AF%B7%E5%B8%90%E5%8F%B7

字节小程序开发文档

https://microapp.bytedance.com/ 

最新文档:抖音开放平台:

https://developer.open-douyin.com/docs/resource/zh-CN/mini-app/introduction/overview/

 

 TypeScript中文网:

 https://www.tslang.cn/docs/handbook/interfaces.html

UNI-APP   官网

https://zh.uniapp.dcloud.io/quickstart-hx.html

 自定义视频拖动条:

https://blog.csdn.net/maxiaole_z/article/details/109045763

 

小程序:

小程序页面分为三块:

    页面体部分:写代码的位置;

    页面头部:状态栏(显示手机电量的部分) + 导航栏高度(标题栏);

           状态栏高度:通过  const statusBarHeight  = uni.getSystemInfoSync().statusBarHeight ;  //状态栏高度:20 

           导航栏——默认的标题栏:微信小程序的小胶囊在导航栏右边垂直居中     

           导航栏高度不能通过uniapp直接获取到;但是可以拿到获取微信小程序中右上角小胶囊的宽高和定位信息,进而进行计算获取导航栏高度     

    const custom  = uni.getMenuButtonBoundingClientRect();   

// 胶囊的信息:{"width":87,"height":32,"left":320 (胶囊左边框距离窗口左边的距离),"top":24(胶囊上边框距离窗口上边的距离),

"right":407(胶囊右边框距离窗口左边的距离),"bottom":56(胶囊下边框距离窗口上边的距离)}

计算导航栏的高:navHeight =  (custom.top - statusBarHeight ) * 2 + custom.height

    页面尾部:tabbar    uniapp 固定50px 

 

posted @ 2022-09-23 18:40  随身笔记~  阅读(505)  评论(0编辑  收藏  举报