rn-splash-screen 启动页 安卓
1. 进入项目npm install --save rn-splash-screen
2.react-native link rn-splash-screen
3.在项目android/app/src/main/res/ 路径下创建一个名称为drawable的文件夹,并在该文件夹下放置一个名称为splash的png格式的图片(用于启动页面的图片)
4.在android/app/src/main/res/values/路径下的styles.xml文件中加入配置:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">@drawable/splash</item>
</style>
5. 在/android/app/src/main/路径下的AndroidManifest.xml文件中做如下修改
<application
android:name="xxx.MainApplication" //这个xxx跟具体的app的包名有关
android:allowBackup="true"
android:label="@string/app_name"
android:icon="@mipmap/ic_launcher"
- android:theme="@style/AppTheme" //前面的减号表示要删除(如果原来有的话)
+ android:icon="@mipmap/ic_launcher" //前面的加号表示要添加(如果原来没有的话)
>
<activity
android:name="com.skyocean.youjoylife.MainActivity"
android:label="@string/app_name"
+ android:theme="@style/AppTheme" //前面的加号表示要添加(如果原来没有的话)
android:configChanges="keyboard|keyboardHidden|orientation|screenSize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
6.在android/app/src/main/java/com/__APPNAMES__/路径下的MainActivity.java中做如下修改
import android.graphics.Color;
import android.os.Bundle;
import com.facebook.react.ReactInstanceManager; //**********需要添加的************
import com.facebook.react.bridge.ReactContext; //**********需要添加的************
import com.mehcode.reactnative.splashscreen.SplashScreen;//**********需要添加的************
public class MainActivity extends ReactActivity {
// [...]
@Override
protected void onCreate(Bundle savedInstanceState) {
// Show the js-controlled splash screen
SplashScreen.show(this, getReactInstanceManager()); //**********需要添加的************
super.onCreate(savedInstanceState);
}
}
7.在入口文件引入配置:
import SplashScreen from "rn-splash-screen";
componentDidMount(){
//隐藏闪屏页,闪屏页用的是第三方库,rn-splash-screen
setTimeout(() => {
SplashScreen.hide();
}, 2000);//延时2秒消失
}
8.配置结束
注:以上配置是参考其他人的成果,本人已成功配置,只为保存文档。
rn-splash-screen 启动页 安卓的更多相关文章
- 【Android开发笔记】Android Splash Screen 启动界面
public class SplashActivity extends Activity { @Override protected void onCreate(Bundle savedInstanc ...
- Expo大作战(十五)--expo中splash启动页的详细机制
简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...
- React-Native App启动页制作(安卓端)
原文地址:React-Native App启动页制作(安卓端) 这篇文章是根据开源项目react-native-splash-screen来写的.在使用react-native-link命令安装该包后 ...
- Flutter - 给App增加启动屏幕(Splash Screen)并且设置背景颜色
先看一下效果图,启动图最好设置为png格式的透明图,以防图片填充不满的时候背景图会非常的煞白(Flutter 默认背景色是白色). 打开android\app\src\main\res\drawabl ...
- ios 2017启动页(Launch Screen Images)、图标(App Icon)尺寸大小
ios 2017启动页(Launch Screen Images).图标(App Icon)尺寸大小 iPhone Portrait iOS 8,9-Retina HD 5.5 (1242×220 ...
- Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法(转)
转载: Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法 首先感谢博主分享,本文作为学习记录 惊鸿一瞥 微信的启动页,相信大家都不陌生. 不知道大家有没有发现一个现象 ...
- 微信小程序 项目实战(一)生命周期 配置服务器信息 splash启动页
步骤一:小程序 生命周期 //app.js App({ onLaunch: function () { //当小程序初始化完成时,会触发onLaunch(全局只触发一次) }, onShow: fun ...
- WPF应用程序的启动画面[Splash Screen本质分析]
原文:WPF应用程序的启动画面[Splash Screen本质分析] 不经意间发现了wpf的这个小玩意,感觉蛮有意思的.我在项目中添加了一张图片 如图: wpf-1.JPG(10.73 K) 2010 ...
- React Native商城项目实战06 - 设置安卓中的启动页
1.Main 目录下新建LaunchImage.js: /** * 启动页 */ import React, { Component } from 'react'; import { AppRegis ...
随机推荐
- 第三章 Java 的基本程序设计结构
1.Java基本数据类型 Java中一共有8种基本数据类型. 4种整形:int-4字节.long-8字节.short-2字节.byte-1字节 2中浮点型:float-4字节.double-8字节 1 ...
- 阿里妈妈-RAP项目的实践(1)
在同事的推荐下,去了解了一下http://thx.github.io/RAP/study.html#,它是发现在前后端分离开发的神器 下面我们来简单上一组代码,来简单了解一下rap <!DOCT ...
- Promise 源码分析
前言 then/promise项目是基于Promises/A+标准实现的Promise库,从这个项目当中,我们来看Promise的原理是什么,它是如何做到的,从而更加熟悉Promise 分析 从ind ...
- Vue一次性简洁明了引入所有公共组件
使用场景 -在开发过程中,往往会有很多自己定义公用组件,我们通过import 导入,components挂载到实例上就行,项目刚开始还好,但是随着项目迭代,组件越来越多,同一个组件不同的方式用需要重复 ...
- PHP执行外部命令【转】
PHP是完全支持外部命令的,但是出于安全考虑,一般很少使用. PHP提供共了3种方法调用外部命令: (1)调用执行外部命令函数(system(),exec(),passthru(),shell_exe ...
- laravel基础课程---3、路由(Laravel中的常见路由有哪几种)
laravel基础课程---3.路由(Laravel中的常见路由有哪几种) 一.总结 一句话总结: 6种:post,get,put,patch,delete,options Route::get($u ...
- html5--4-3 source元素-解决浏览器的兼容
html5--4-3 source元素-解决浏览器的兼容 学习要点 掌握source元素的用法 source元素-解决浏览器额兼容 HTML5 中新增的元素 video和audio元素的子元素,可指定 ...
- linux系统配置之PATH环境变量的设置(centos)
Centos系统下修改环境变量PATH路径的方法 电脑脑中必不可少的就是操作系统.而Linux的发展非常迅速,有赶超微软的趋势.这里介绍Linux的知识,让你学好应用Linux系统.比如要把/etc/ ...
- get_extension_funcs 返回某个模块下的所有函数
array get_extension_funcs ( string $module_name ) (参数必选) 该函数根据 module_name 返回模块内定义的所有函数的 ...
- codeforces 669A A. Little Artem and Presents(水题)
题目链接: A. Little Artem and Presents time limit per test 2 seconds memory limit per test 256 megabytes ...