Cordova项目IphoneX适配，结合BUI前端框架项目（需要修改原生代码）

最新推荐文章于 2024-05-18 10:01:30 发布

置顶

伊何底止丶

最新推荐文章于 2024-05-18 10:01:30 发布

阅读量1.3k

点赞数

分类专栏： Cordova项目中使用BUI框架 Cordova项目使用文章标签： Cordova IphoneX适配 Cordova BUI

本文链接：https://blog.csdn.net/qq_33334746/article/details/80942670

版权

本文介绍了如何使Cordova项目在iPhoneX上进行适配，包括添加viewport-fit=cover元标签，更新启动图，替换UIWebView为WKWebView，并调整顶部样式。通过修改MainViewController.m文件和设置顶部颜色，实现了页面在iPhoneX上的良好显示。BUI前端框架在iOS适配方面表现出色，推荐给Hybrid App开发者。

摘要由CSDN通过智能技术生成

先吐槽一下苹果，每年都要出一下幺蛾子，你还没有办法。

Hybrid App适配只能说一开始研究难一点，后面基本没什么问题，下面就把我自己的研究出来的跟大家分享一下。
部分参考：点击打开链接

1、meta 标签中添加 viewport-fit=cover，这是 ios 11 新增的设置，可以让页面全屏展示。

<meta name="viewport" content="initial-scale=1, width=device-width, height=device-height, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover">
这部分BUI是自带的，基本不需要做修改，这里展示是给不是BUI框架的朋友使用的

2、更新启动图

在cordova项目的配置文件config.xml中添加，具体参考：启动图规范

   <platform name="android">
        <allow-intent href="market:*" />
        <preference name="orientation" value="portrait" />
        <icon density="ldpi" src="res/icon/android/mipmap-ldpi/ic_launcher.png" />
        <icon density="mdpi" src="res/icon/android/mipmap-mdpi/ic_launcher.png" />
        <icon density="hdpi" src="res/icon/android/mipmap-hdpi/ic_launcher.png" />
        <icon density="xhdpi" src="res/icon/android/mipmap-xhdpi/ic_launcher.png" />
        <splash density="land-hdpi" src="res/screen/android/splash-port-hdpi.png" />
        <splash density="land-ldpi" src="res/screen/android/splash-port-ldpi.png" />
        <splash density="land-mdpi" src="res/screen/android/splash-port-mdpi.png" />
        <splash density