react-native-splash-screen在GitHub上的地址:https://github.com/crazycodeboy/react-native-splash-screen

react native,对呀app启动屏的生成没有讲解,网上对于启动屏的讲解也是有各种各样的办法;这里讲解一下iOS和android生成启动屏,以及结合第三方插件react-native-splashScreen友好显示启动屏的步骤

  • iOS、android如何生成启动屏

在做iOS开发之前,学习锅ionic,也是一种混合开发框架,ionic和react native开发环境基本类似,对于ionic不多说,简单点讲就是ionic只用两张图片(图标,启动屏)就可以快速生成iOS和android适应各个尺寸的相应图片了。当然,如果不会使用ionic,找设计师作图就行。以后会发个链接讲一下ionic生成启动屏的步骤。

  • 安装和link react-native-splash-screen
npm i react-native-splash-screen --save
  • 安装之后需要在android和iOS上配置:
  1. iOS配置:
  2. android配置:
  • 使用代码:
import SplashScreen from 'react-native-splash-screen'

export default class WelcomePage extends Component {

    componentDidMount() {
// do stuff while splash screen is shown
// After having done stuff (such as async tasks) hide the splash screen
SplashScreen.hide();
}
}

react-native-splash-screen的更多相关文章

  1. Apple & iOS & Device Screen Sizes and Orientations & React Native

    Apple & iOS & Device Screen Sizes and Orientations & React Native iOS devices https://de ...

  2. React Native(ios)项目中logo,启动屏设置

    由于logo和启动屏尺寸多,react native(ios)中没有命令可以自动生成各种的尺寸,所以可以使用以下办法:在ionic项目中生成(使用命令:ionic resources)后,再粘贴到re ...

  3. React Native视频播放(iOS)

    网站链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/learn-react-native-video/ React Nativ ...

  4. React Native 之 项目实战(一)

    前言 本文有配套视频,可以酌情观看. 文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我. 文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关. 如文中内容对 ...

  5. React Native 系列(八) -- 导航

    前言 本系列是基于React Native版本号0.44.3写的.我们都知道,一个App不可能只有一个不变的界面,而是通过多个界面间的跳转来呈现不同的内容.那么这篇文章将介绍RN中的导航. 导航 什么 ...

  6. React Native 系列(九) -- Tab标签组件

    前言 本系列是基于React Native版本号0.44.3写的.很多的App都使用了Tab标签组件,例如QQ,微信等等,就是切换不同的选项,显示不同的内容.那么这篇文章将介绍RN中的Tab标签组件. ...

  7. React Native填坑之旅 -- 使用react-navigation代替Navigator

    Navigator已经被React Native废弃了.也许你可以在另外的一个依赖库里react-native-deprecated-custom-components里找到.不过既然官方推荐的是re ...

  8. React Native学习(三)—— 使用导航器Navigation跳转页面

    本文基于React Native 0.52 参考文档https://reactnavigation.org/docs/navigators/navigation-prop 一.基础 1.三种类型 Ta ...

  9. React Native之使用导航器跳转页面(react-navigation)

    react-navigation是一个导航库,要使用react-navigation来实现跳转页面,首先得在项目中安装此库,由于Yarn是Facebook提供的替代npm的工具,可以加速node模块的 ...

  10. ReactJs和React Native的那些事

    介绍 1,React Js的目的 是为了使前端的V层更具组件化,能更好的复用,它能够使用简单的html标签创建更多的自定义组件标签,内部绑定事件,同时可以让你从操作dom中解脱出来,只需要操作数据就会 ...

随机推荐

  1. google hack使用集锦

    转载:https://blog.csdn.net/weixin_42127015/article/details/84472777 关于google hack的几个基础过滤器使用[请务必谨记,过滤器虽 ...

  2. mp4 格式无法使用html5的video标签播放

     只有视频编码为h264的视频才能在html5中使用video标签播放 我的解决方法为:下载魔影工厂,按照如下图所示步骤操作: width:600px;

  3. 使用Django-environ管理多个配置

    使用Django-environ管理多个配置 https://django-environ.readthedocs.io/en/latest/

  4. C语言实现全排列和回溯法总结

    一.递归实现全排列 #include"cstdio" ]; void print_permutation(int n,int *A,int cur){ if(cur==n){ ;i ...

  5. LinuxShell脚本编程基础2-变量与数值运算、父shell和子shell

    1.变量和数值运算 Shell脚本的变量不需要声明的 对变量赋值有两种方式, 直接用“=” 或者用键盘输入值 #!/bin/bash name1="Jack" echo $name ...

  6. (转载)Eclipse快捷键大全

    Ctrl+1 快速修复(最经典的快捷键,就不用多说了)Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加)Ctrl+Alt+↑ 复制当前行到上一行(复制增加)Alt+↓ 当 ...

  7. 【c++】iostreeam中的类为何不可以直接定义一个无参对象呢

    缘起 #include <iostream> #include <fstream> #include <sstream> using namespace std; ...

  8. 在ASPNETCORE中获得所有Action

    在ASPNETCORE中获得所有Action 本文旨在记录自己在aspnetcore工作中需要获取所有Action,在查询了资料后进行了几种方法的记录.后期有发现其它方式再进行追加. 一.通过 反射 ...

  9. 图像的点运算----底层代码与Halcon库函数

    最基本的图像分析工具----灰度直方图.使用直方图辅助,可以实现4大灰度变换,包括线性灰度变换(灰度拉伸).灰度对数变换.灰度伽马变换.灰度分段线性变换:使用直方图修正技术,可以实现2大变换,包括直方 ...

  10. java web 之Session

    1.Session简单介绍 由于Http是无状态的协议,所以服务端需要记录用户的状态时,就需要某种机制来识别具体的用户,实现这个机制的方式就是session. 典型的场景比如购物车,当你点击下单按钮时 ...