react native Expo适配全面屏/Expo识别全面屏和正常屏
一、最新版本的expo已经默认支持了全面屏,即不会像react native cli一样出现底部黑边
二、但是全面屏通过Dimensions.get('window')获取的高度还是不准确,因为全面屏的statusBar高度问题。
三、适配方案
通过获取屏幕纵横比来判断是否为全面屏
1、获取宽高
const {width,height} = Dimensions.get('window')
2、计算纵横比
const wh = height/width
3、全面屏手机一般纵横比wh大于1.8,正常手机屏幕小于1.8
4、获取statusBar高度
const { StatusBarManager } = NativeModules;
5、纵横比减去2个statusBar高度就是正常的了
react native Expo适配全面屏/Expo识别全面屏和正常屏的更多相关文章
- 从React Native到微服务,落地一个全栈解决方案
Poplar是一个社交主题的内容社区,但自身并不做社区,旨在提供可快速二次开发的开源基础套件.前端基于React Native与Redux构建,后端由Spring Boot.Dubbo.Zookeep ...
- React Native 性能优化指南【全网最全,值得收藏】
2020 年谈 React Native,在日新月异的前端圈,可能算比较另类了.文章动笔之前我也犹豫过,但是想到写技术文章又不是赶时髦,啥新潮写啥,所以还是动笔写了这篇 React Native 性能 ...
- react native中的欢迎页(解决首加载白屏)
参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...
- Expo大作战(三)--针对已经开发过react native项目开发人员有针对性的介绍了expo,expo的局限性,开发时项目选型注意点等
简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...
- React Native 开发豆瓣评分(五)屏幕适配方案
前言 React Native 是以实际像素 dp 为单位的,这导致在不同分辨率的屏幕会有不一样的显示情况. 在原生 Android 中,可以根据不同的分辨率添加不同的样式目录,以解决不同分辨率的问题 ...
- React Native & Google & Proxy
React Native & Google & Proxy https://snack.expo.io/ https://expo.io/snacks/@xgqfrms https:/ ...
- Expo大作战(二)--expo的生命周期,expo社区交流方式,expo学习必备资源,开发使用expo时关注的一些问题
简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...
- React Native踩坑日记 —— tailwind-rn
项目背景 在项目的初始阶段,我们需要建立自己的design system,我们spike了一些方案,tailwind-rn就是其中一种,如果有用到或者即将用到tailwind-rn的,可以进来看一看, ...
- React Native纯干货总结
随着项目也渐渐到了尾声,之前的项目是mobile开发,采用的是React Native.为即将要开始做RN项目或者已经做过的小伙伴可以参考借鉴,也顺便自己做一下之前项目的总结. 文章比较长,可以选择自 ...
- 腾讯优测优分享 | 探索react native首屏渲染最佳实践
腾讯优测是专业的移动云测试平台,旗下的优分享不定时提供大量移动研发及测试相关的干货~ 此文主要与以下内容相关,希望对大家有帮助. react native给了我们使用javascript开发原生app ...
随机推荐
- 【转】DELPHI开始支持LINUX DOCKER
这是咏南翻译Marco Cantu的文章. 在过去的几年中,将服务器端解决方案(实际上是任何类型的应用程序)部署到轻量级DOCKER而不是物理机器或虚拟机已经变得越来越普遍,因为这允许更大的灵活性(在 ...
- springboot的简单热部署
最近开始学习使用springboot但springboot项目和之前的ssm等各种框架项目有所不同,本身集成了很多繁琐的东西,但 一些小功能还需自己配置.下面开始配置热部署. 首先当然是导入热部署的依 ...
- Scrapy 中常用的中间件和管道组件
Pipeline用法 储存到MongoDB pipline.py中的代码 import pymongo class MongoPipeline(object): def __init__(self, ...
- Orangepi 修改 Debian国内源
1.导出sources.list 1 cat /etc/apt/sources.list > sources.list 2.修改sources.list内容为如下: 1234 deb ...
- Python中的对象与参考
参考 当创建一个对象并给它赋一个变量的时候,这个变量仅仅参考哪个对象,而不是表示这个对象本身!也就是说,变量名指向你计算机中存储那个对象的内存.这被称作名称到对象的绑定. 对象与参考的例子 注意两次不 ...
- EF Migraiton错误解决
System.Runtime.Serialization.SerializationException: Type is not resolved for member 'Oracle.Managed ...
- 【tomcat】同一个服务器,搭建多个tomcat服务
1. 下载apache-tomcat-7.0.63,下载地址:http://tomcat.apache.org/download-70.cgi下载下来的文件为apache-tomcat-7.0.63. ...
- Java基础 继承的方式创建多线程 / 线程模拟模拟火车站开启三个窗口售票
继承的方式创建多线程 笔记: /**继承的方式创建多线程 * 线程的创建方法: * 1.创建一个继承于Thread 的子类 * 2.重写Thread类的run()方法 ,方法内实现此子线程 要完成的功 ...
- unittest简单使用的介绍
无论是paython+request接口测试.ui自动化测试等,都常会用到unittest的框架,简单的介绍如下:
- Mongo Backup
#!/bin/sh # This script is run on every mongo node. However, it checks to see if this node is the pr ...