cordova 5.4版本 适配全面屏 底部黑边问题
在全面屏发布之后,Android官方提供了适配方案,即提高App所支持的最大屏幕纵横比,实现很简单,在AndroidManifest.xml中可做如下配置:
更改android.max_aspect值,其中ratio_float为浮点数,官方建议为2.1或更大,因为18.5:9=2.055555555……,如果日后出现纵横比更大的手机,此值将会更大。
<manifest>
<application>
<meta-data android:name="android.max_aspect" android:value="2.1"/>
</application>
</manifest>
因为我们的cordova版本较旧,所以只能用hook的方式,直接修改AndroidManifest.xml,我们是ionic项目所以直接把下面的hook文件放到after_prepare文件夹内即可。
如果hook文件没有执行,需要在config.xml内加一个配置去执行。<hook type="after_prepare" src="hooks/after_prepare/set_full_screen.js"/>
hook文件代码如下
set_full_screen.js
#!/usr/bin/env node
var _ = require('lodash');
var fs = require('fs');
var path = require('path');
var spawnSync = require('child_process').spawnSync;
var rootdir = process.argv[2];
var xml2js = require('xml2js');
//xml->json
//xml2js默认会把子子节点的值变为一个数组, explicitArray设置为false
var xmlParser = new xml2js.Parser({explicitArray : false, ignoreAttrs : false})
//json->xml
var jsonBuilder = new xml2js.Builder(); fs.readFile('platforms/android/AndroidManifest.xml','utf-8',function(err,xml) { // xml -> json
xmlParser.parseString(xml, function (err, result) { // var time=new Date().getTime();
// console.log(result.widget["$"]["version"].replace(/\./,'0').replace(/\./,''))
// result.manifest["meta-data"]=[
// { '$': {
// 'android:name': 'android.max_aspect',
// 'android:value': '2.1'
// }
// }
// ]
result.manifest["application"]["meta-data"]=[
{ '$': {
'android:name': 'android.max_aspect',
'android:value': '2.1'
}
}
]
// result.manifest["application"]["$"]["android:resizeableActivity"]="true"
//将返回的结果再次格式化
// console.log(JSON.stringify(result));
//json --> xml
var builder = new xml2js.Builder( );
var jsonxml = builder.buildObject(result);
fs.writeFileSync('platforms/android/AndroidManifest.xml', jsonxml);
console.log('----------');
console.log('更新AndroidManifest.xml适配全面屏');
console.log('----------'); });
})
cordova 5.4版本 适配全面屏 底部黑边问题的更多相关文章
- react native Expo适配全面屏/Expo识别全面屏和正常屏
一.最新版本的expo已经默认支持了全面屏,即不会像react native cli一样出现底部黑边 二.但是全面屏通过Dimensions.get('window')获取的高度还是不准确,因为全面屏 ...
- Ionic5沉浸式状态栏 适配全面屏
1. 在platforms/android/app/src/main目录中找到AndroidManifest.xml文件,修改文件中manifest → application → activity标 ...
- RN Android全面屏适配
像现在市面上新出的手机,例如华为P30 pro,小米9,iPhone XS MAX,屏占比都惊人的达到90%以上,这些手机具备了以下几个特点 大,屏占比高,长宽比都不再是16:9,都达到了19.5:9 ...
- Flutter全面屏适配
笔者在这篇文章ReactNative全面屏(Android)适配问题提及了现在的全面屏问题,不仅是Android平台,IOS平台也是,给我的感觉就是手机越来越长了. 现在的手机长宽比早就不是之前的16 ...
- Android全面屏适配
什么是全面屏 概念 很多人可能把全面屏跟曲面屏混淆,其实这是两个不同的概念. 一般手机的屏幕纵横比为16:9,如1080x1920.1440x2560等,其比值为1.777777……,全面屏手机出现之 ...
- 微信小程序 自定义导航组件 nav头部 全面屏设计
nav-dynamic 微信小程序自定义nav头部组件:适配全面屏设计: 实现功能 初始进入页面时,展示初始状态下的nav样式: 页面滚动时,监听页面滚动事件,展示滚动状态下的nav样式: 根据配置字 ...
- Android最佳实践之SystemBar状态栏全版本适配方案
前言 自从MD设计规范出来后,关于系统状态栏的适配越受到关注,因为MD在5.0以后把系统状态栏的颜色改为可由开发者配置的,而在5.0之前则无法指定状态栏的颜色,所以这篇就说说使用Toolbar对系统状 ...
- [COCOS2DX-LUA]0-005.cocos2dx中关于全面屏和折叠屏的适配的一些见解
1.随着科技的发展,我们可以看到从iphoneX的刘海屏开始,引发了各种全面屏和异形屏的出现.这是科技的进步,但是对于各大的应用厂商来说,苦不堪言. 2.当然 ,吐槽归吐槽,我们还是要理智的去对待这个 ...
- 版本适配 sdk version MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
随机推荐
- Dubbo重试次数
服务超时后重试次数[retries],不包含第一次调用,0代表不重试 *我们应该在幂等方法上设置重试次数[查询.删除.修改],在非幂等方法上禁止设置重试次数. ★幂等:指多次运行方法所产生的最终效果是 ...
- 【vim】删除标记内部的文字 di[标记]
当我开始使用 Vim 时,一件我总是想很方便做的事情是如何轻松的删除方括号或圆括号里的内容.转到开始的标记,然后使用下面的语法: di[标记] 比如,把光标放在开始的圆括号上,使用下面的命令来删除圆括 ...
- 用rand()和srand()产生伪随机数的方法总结 【转】
转自:http://blog.chinaunix.net/uid-26722078-id-3754502.html 标准库(被包含于中)提供两个帮助生成伪随机数的函数: 函数一:int rand(vo ...
- 005_关于HTTP协议中的保持连接
缘起 中午在群里讨论,用ab测试 一台只提供静态文件服务, 不与其他任何系统交互的时候,为什么也会产生大量的TIME WAIT状态的. 首先,我们可以简单的理解,在TCP连接的两端,谁主动断开连接(先 ...
- mysql的日志及利用mysqldump备份及还原
日志文件:6类 一般查询日志:log,general_log,log_output 慢查询日志: 错误日志 二进制日志 中继日志 ...
- Android:Camera
Android Camera开发 Android手机关于Camera的使用,一是拍照,二是摄像,由于Android提供了强大的组件功能,为此对于在Android手机系统上进行Camera的开发,我们可 ...
- 解执行maven项目出现 SLF4J: Failed to load class “org.slf4j.impl.StaticLoggerBinder”. error
最近再弄maven项目,运行起来没有问题,但是Console控制台会报错,比如说如下的问题异常提示: 由此我们可以看出,报出错误的地方主要是slf4j的jar包,而故障码中“Failed to loa ...
- jmeter之使用代理录制脚本
从loadrunner到jmeter,录制压力测试脚本好像都只支持IE,近来才知道jmeter还有自带的录制脚本元件, 且支持IE.Chrome及Firefox等多种浏览器.这里就记录一下通过jmet ...
- 使用console进行 性能测试 和 计算代码运行时间
原文:http://www.tuicool.com/articles/JrARVjv 对于前端开发人员,在开发过程中经常需要监控某些表达式或变量的值,如果使用用 debugger 会显得过于笨重,最常 ...
- CCF2016092火车购票
问题描述 请实现一个铁路购票系统的简单座位分配算法,来处理一节车厢的座位分配. 假设一节车厢有20排.每一排5个座位.为方便起见,我们用1到100来给所有的座位编号,第一排是1到5号,第二排是6到10 ...