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. 用 Spark 处理复杂数据类型(Array、Map、JSON字符串等)

    split 对列表进行切割,然后生产新的列表 from pyspark.sql.functions import split# 对 key列按照 0-9之间的数字进行风格 重新命名为 s  df.se ...

  2. windows下如何打开.sketch的文件

    1 .sketch的文件只能在苹果mac上支持的一种文件格式,现在越来越多的设计师喜欢用.sketch 2 windows下如果想打开.sketch文件,去Microsoft store 找一个Lun ...

  3. Python的安装和配置(windowns 双版本)

    1.去官网上下载python,注意版本. 官网地址:https://www.python.org/downloads/windows 2.下载安装版或者zip包都可以.安装就按向导一步一步完成即可.z ...

  4. Redis五种数据结构(二)

    Redis数据结构 Redis数据结构介绍 Redis是一种高级的key-value的存储系统,其中value支持五种数据类型. 字符串(String) 哈希(hash) 字符串列表(list) 字符 ...

  5. docker学习系列-jdk基础镜像制作

    准备一台安装有docker服务的机器 1.编辑Dockerfile   vim Dockerfile FROM centos:latest ADD ./jdk-8u141-linux-x64.tar. ...

  6. HDU 6078 - Wavel Sequence | 2017 Multi-University Training Contest 4

    /* HDU 6078 - Wavel Sequence [ DP ] | 2017 Multi-University Training Contest 4 题意: 给定 a[N], b[M] 要求满 ...

  7. 013_linuxC++之_派生类中权限的调整

    (一)在上一篇012_LINUXC++之_类的继承定义中我们知道在派生类中可以访问public和protectd中的数据 (二)那么我们就可以在派生类中将上面两个中的数据进行权限的修改 (三)程序 # ...

  8. locate/find

    locate 从数据库 (/var/lib/mlocate/mlocate.db) 查找命令,使用updatedb更新库. 类似于数据库的索引建立,在首次简历索引的时候,很耗费资源,在建立完成后,查询 ...

  9. springboot 生产环境与开发环境配置

    通过修改yml文件里的active属性,prod(生产环境) 与 dev (开发环境)

  10. maven mvn 命令行 编译打包

    * 配置好jdk * 下载安装maven http://maven.apache.org/download.cgi apache-maven-3.3.3-bin.zip * 解压到G:\apache- ...