Bug如下图所示:

iOS显示正常,而安卓出现图片被挤压上去.

最后的解决方法:

比如你的 图片 是 750 x 513 那么 你设置样式的时候 width 为 屏幕的宽 ,高度为 屏幕的 宽 / (750 /513)
这样就保留了原图的宽高比.

var styles = StyleSheet.create({
// 这里是拿不到图片的个数的,需要使用内联样式即可
// contentContainer: {
// width: Util.size.width,
// height: Util.size.height,
// },
backgroundImage: {
width: Util.size.width,
height: Util.size.width / ( / ), // 这么设置是为了:保留了原图的宽高比,否则安卓会拉伸
},
});

不理解的是为什么其他的没有问题,就是在这个引导页的实现上出现问题呢?知道的大神级的告诉我哟!!!

React Native解决安卓图片被挤压的更多相关文章

  1. [RN] React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题

    React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题 解决方法: 添加 size,  line-height ,值为和 height 一样的高度. 例如: ...

  2. React Native运行安卓报错解决记录

    1>Error:Configuration with name ‘default’ not found. 解决链接: http://blog.csdn.net/u011240877/articl ...

  3. React Native 四:图片

    一.展示图片资源  1.在ReactNative中.图片使用Image组件进行展示,以下我们就以静态.混合和网络资源等多种方式演示图片展示. 2.将图片放在代码目录img处:

  4. React Native解决Android的WebView无法执行injectedJavaScript代码

    需求 在用WebView组件写一个东西,要求功能:打开web后进行js代码注入. 开发 代码很简单,示例: const js = ` alert(1); alert(2); `; <WebVie ...

  5. React Native区分安卓/iOS平台

    import { Platform, } from 'react-native'; alert(JSON.stringify(Platform)): android手机弹出:{"OS&quo ...

  6. React Native for Android 热部署图片自己定义方案

    情景 热部署时,我们期望升级包中包括js代码与图片资源. bundle的热部署网上已经有两种方案了,一种是用反射,一种是利用RN自带函数.将bundle初始化时直接放到指定文件夹下,之后通过替换bun ...

  7. 【React Native】进阶指南之一(特定平台、图片加载、动画使用)

    一.特定平台代码 React Native提供了两种方法来区分平台: 使用Platform模块: 使用特定平台扩展名: 1.Platform模块 React Native提供了一个检测当前运行平台的模 ...

  8. React Native 从入门到原理

    React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原理的文章却寥寥无几. 本文分为两个部分:上半部分用通 ...

  9. 关于React Native 火热的话题,从入门到原理

    本文授权转载,作者:bestswifter(简书) React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原 ...

随机推荐

  1. Django 外键、多对多插入数据方法

    models.py class UserInfo(models.Model): username = models.CharField(max_length=64,db_column='usernam ...

  2. RxJava——响应式编程

    自从06年开始,Rxandroid公司项目中陆续就开始使用它了,而它的基础是由Rxjava演变过来的,如今它也是越来越被广泛使用在商业项目中了,而做为"专业"的自己还是一直对它一知 ...

  3. Kafka中的消息是否会丢失和重复消费(转)

    在之前的基础上,基本搞清楚了Kafka的机制及如何运用.这里思考一下:Kafka中的消息会不会丢失或重复消费呢?为什么呢? 要确定Kafka的消息是否丢失或重复,从两个方面分析入手:消息发送和消息消费 ...

  4. String类的format方法的用法

    public class Test { public static void main(String[] args) { String url = "https://api.weixin.q ...

  5. BZOJ 2440 [中山市选2011]完全平方数 二分+容斥

    直接筛$\mu$?+爆算?再不行筛素数再筛个数?但不就是$\mu^2$的前缀和吗? 放...怕不是数论白学了$qwq$ 思路:二分+容斥 提交:两次(康了题解) 题解: 首先答案满足二分性质(递增), ...

  6. triggerHandler(type, [data])

    triggerHandler(type, [data]) 概述 这个特别的方法将会触发指定的事件类型上所有绑定的处理函数.但不会执行浏览器默认动作,也不会产生事件冒泡. 大理石平台价格 这个方法的行为 ...

  7. 在gitlab上删除分支后,本地git branch -r还能看到

    1. git remote prune --dry-run origin 查看当前有哪些是该消失还存在的分支 2. git remote prune origin 删除上面展示的所有分支 3. git ...

  8. Chef and Problems(from Code-Chef FNCS) ( 回 滚 )

    题目: 题意:给定序列,求[l,r]区间内数字相同的数的最远距离. 链接:https://www.codechef.com/problems/QCHEF #include<bits/stdc++ ...

  9. table表格合并列中相同的内容

    方法一: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  10. Java面向对象1(A~F)

    QWQ请假一节课,错过一章内容,只能求助qsh了. C/C++训练1---最大公约数与最小公倍数(SDUT 1131) import java.util.*; class Number { int a ...