Splash-screen not work in react-native app on android - android

I have the react-native app and I need to implement a splash screen on android. My step was: put png images to app/src/main/res/mibmap, create background_splash.xml in app/src/main/res/drawable/, add SplashTheme to app/src/main/res/values/styles.xml, change AndroidManifest.xml, change MainActivity.java, create SplashActivity.java class in src/main/java/. But my splash screen is not appearing in the app. Can you explain to me please what I'm doing wrong?
background_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/black" />
<item>
<bitmap
android:src="mipmap/splash_screen"
android:gravity="center" />
</item>
</layer-list>
styles.xml
<resources xmlns:tools="http://schemas.android.com/tools">
<color name="primary_dark">#27409d</color>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<!--<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:statusBarColor" tools:targetApi="lollipop">#android:color/transparent</item>-->
<!-- fix https://trello.com/c/OuBMJCMI-->
<!-- https://github.com/facebook/react-native/issues/17530-->
<item name="android:editTextBackground">#android:color/transparent</item>
</style>
<style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
</resources>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="black">#000000</color>
</resources>
AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="broker.mapp"
android:fitsSystemWindows="false">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.USE_FINGERPRINT"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
<uses-sdk />
<application
android:name="broker.mapp.MainApplication"
android:allowBackup="false"
android:label="#string/app_name"
android:icon="#mipmap/ic_launcher"
android:theme="#style/AppTheme"
android:networkSecurityConfig="#xml/network_security_config"
android:largeHeap="true"
>
<activity
android:name="broker.mapp.SplashActivity"
android:theme="#style/SplashTheme"
android:label="#string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
<activity
android:name="broker.mapp.MainActivity"
android:label="#string/app_name"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize"
android:screenOrientation="portrait"
android:launchMode="singleTask"
android:exported="true">
<intent-filter android:label="filter_react_native">
<action android:name="android.intent.action.VIEW"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="android.intent.category.BROWSABLE"/>
<data android:scheme="broker" android:host="*"/>
</intent-filter>
</activity>
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity"/>
<meta-data android:name="com.dieam.reactnativepushnotification.notification_channel_name"
android:value="Без категории"/>
android:value=" "/>
<intent-filter>
<action android:name="android.intent.action.BOOT_COMPLETED"/>
</intent-filter>
</receiver>
<meta-data android:name="com.google.firebase.messaging.default_notification_icon"
</application>
</manifest>
MainActivity.java
package broker.mapp;
import android.os.Bundle;
import com.facebook.react.ReactActivity;
import io.fabric.sdk.android.Fabric;
import com.crashlytics.android.core.CrashlyticsCore;
import com.crashlytics.android.Crashlytics;
import android.content.Intent;
import android.content.res.Configuration;
import org.devio.rn.splashscreen.SplashScreen;
public class MainActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript.
* This is used to schedule rendering of the component.
*/
#Override
protected String getMainComponentName() {
return "BrokerMapp";
}
#Override
protected void onCreate(Bundle savedInstanceState) {
SplashScreen.show(this, true);
super.onCreate(savedInstanceState);
CrashlyticsCore core = new
CrashlyticsCore.Builder().disabled(BuildConfig.USE_FABRIC !=
"TRUE").build();
Fabric.with(this, new
Crashlytics.Builder().core(core).build());
}
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
Intent intent = new Intent("onConfigurationChanged");
intent.putExtra("newConfig", newConfig);
this.sendBroadcast(intent);
}
}
SplashActivity.java
package com.app;
import android.content.Intent;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
public class SplashActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent intent = new Intent(this, rshb.broker.mapp.MainActivity.class);
startActivity(intent);
finish();
}
}

Try Below code in onCreate method
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
Intent intent = new Intent(SplashActivity.this,MainActivity.class);
startActivity(intent);
finish();
}
}, 3000);

Related

React Native app takes time for first launch

after using react-native-bootsplash library, my app takes time to launch for the first time, and also after submitting the releasing version on the play store, I'm getting Pre-Launch report as: Your app took 22,761ms to launch for the first time.
I also noticed the same on the iOS too, here is my configuration:
My MainActivity.java file:
package com.qadaapp;
import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import android.os.Bundle;
import com.zoontek.rnbootsplash.RNBootSplash;
public class MainActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript. This is used to schedule
* rendering of the component.
*/
#Override
protected String getMainComponentName() {
return "Qadaapp";
}
/**
* Returns the instance of the {#link ReactActivityDelegate}. There the RootView is created and
* you can specify the renderer you wish to use - the new renderer (Fabric) or the old renderer
* (Paper).
*/
#Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new MainActivityDelegate(this, getMainComponentName());
}
public static class MainActivityDelegate extends ReactActivityDelegate {
public MainActivityDelegate(ReactActivity activity, String mainComponentName) {
super(activity, mainComponentName);
}
#Override
protected ReactRootView createRootView() {
ReactRootView reactRootView = new ReactRootView(getContext());
// If you opted-in for the New Architecture, we enable the Fabric Renderer.
reactRootView.setIsFabric(BuildConfig.IS_NEW_ARCHITECTURE_ENABLED);
return reactRootView;
}
#Override
protected boolean isConcurrentRootEnabled() {
// If you opted-in for the New Architecture, we enable Concurrent Root (i.e. React 18).
// More on this on https://reactjs.org/blog/2022/03/29/react-v18.html
return BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;
}
}
#Override
protected void onCreate(Bundle savedInstanceState) {
RNBootSplash.init(this);
super.onCreate(null);
}
}
My AndroidMainfest.file:
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.qadaapp">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="com.android.vending.BILLING"/>
<application android:name=".MainApplication" android:label="#string/app_name" android:icon="#mipmap/ic_launcher" android:roundIcon="#mipmap/ic_launcher_round" android:allowBackup="false" android:usesCleartextTraffic="true" android:theme="#style/BootTheme">
<activity android:name=".MainActivity" android:label="#string/app_name" android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
<intent-filter>
<action android:name="android.intent.action.VIEW"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="android.intent.category.BROWSABLE"/>
<data android:scheme="qadaapp"/>
</intent-filter>
</activity>
<activity android:name="com.facebook.FacebookActivity" android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation" android:label="#string/app_name"/>
<activity android:name="com.facebook.CustomTabActivity" android:exported="true">
<intent-filter>
<action android:name="android.intent.action.VIEW"/>
<category android:name="android.intent.category.DEFAULT"/>
<category android:name="android.intent.category.BROWSABLE"/>
<data android:scheme="#string/fb_login_protocol_scheme"/>
</intent-filter>
</activity>
<meta-data android:name="com.facebook.sdk.ApplicationId" android:value="#string/facebook_app_id"/>
<meta-data android:name="com.facebook.sdk.ClientToken" android:value="#string/facebook_client_token"/>
<meta-data
android:name="preloaded_fonts"
android:resource="#array/preloaded_fonts" />
</application>
</manifest>
My styles.xml file:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:editTextBackground">#drawable/rn_edit_text_material</item>
</style>
<!-- BootTheme should inherit from Theme.SplashScreen -->
<style name="BootTheme" parent="Theme.SplashScreen">
<item name="windowSplashScreenBackground">#color/bootsplash_background</item>
<item name="windowSplashScreenAnimatedIcon">#mipmap/bootsplash_logo</item>
<item name="postSplashScreenTheme">#style/AppTheme</item>
</style>
</resources>
Also I added this in my build.gradle file:
implementation "androidx.core:core-splashscreen:1.0.0"
My App.js:
const unsubscribe = auth().onUserChanged(async usr => {
if (!usr) {
await _getSlideShows();
setUser(null);
return RNBootSplash.hide({fade: true});
}
if (usr?.uid) {
let dbResult = await DB.collection('users').doc(usr?.uid).get();
setUser(usr);
if (dbResult?.exists) {
let dbUser = dbResult.data();
setUser(dbUser);
}
return RNBootSplash.hide({fade: true});
}
});
return () => unsubscribe();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
When I was not using react-native-bootsplash, the app was working fast, however when I implemeneted the react-native-boot-splash library, my app's cold start time increased on both the platforms.

Splash Screen drawable not found but Drawable clearly in project structure

I am trying to create a splash screen following this guide.
https://www.bignerdranch.com/blog/splash-screens-the-right-way/
I followed the steps line by line, however, I get an error saying the splash_background.xml isn't found.
Can anyone solve the problem? I really don't know what is wrong.
Project Structure:
Manifest:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.dhew6.shopifyinternquestion">
<uses-permission android:name="android.permission.INTERNET" />
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:roundIcon="#mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="#style/AppTheme">
<activity android:name=".SplashActivity"
android:theme="#style/SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".MainActivity"
android:theme="#style/AppTheme" />
</application>
SplashActivity:
package com.example.dhew6.shopifyinternquestion;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
public class SplashActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent intent = new Intent(this, MainActivity.class);
startActivity(intent);
finish();
}}
background_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/colorPrimaryDark"/>
<item>
<bitmap
android:gravity="center"
android:src="#mipmap/ic_launcher"/>
</item>
</layer-list>
I think you should check carefully your code.
From your image, I am seeing you have: background_splash.xml
But your are getting the error:
I followed the steps line by line, however, I get an error saying the splash_background.xml isn't found.
Maybe you typed wrong name somewhere.
Looks like it should be background_splash.xml instead of splash_background.xml?
Try this man:
public class SplashActivity extends AppCompatActivity {
private static int SPLASH_TIME_OUT = 3000;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
Intent mainActivity = new Intent(SplashActivity.this, MainActivity.class);
startActivity(mainActivity);
finish();
}
}, SPLASH_TIME_OUT);
}
}

White screen after Splash Screen react-native

[EDIT] Seems to be that the white screen is generate because MainActivity is to heavy to load, i managed to solve using first a native splash screen and then right after native is killed a js implementation based on the next plugin, i did some modifications to match both splash screens perfectly
https://github.com/crazycodeboy/react-native-splash-screen
White screen after splash screen react native.
splash_screen.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/gray"/>
<item>
<bitmap
android:gravity="center"
android:src="#mipmap/ic_launcher"/>
</item>
</layer-list>
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
</style>
<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/splash_screen</item>
</style>
</resources>
AndroidManifiest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.appba"
android:versionCode="1"
android:versionName="1.0">
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-sdk
android:minSdkVersion="16"
android:targetSdkVersion="22" />
<application
android:name=".MainApplication"
android:allowBackup="true"
android:label="#string/app_name"
android:icon="#mipmap/ic_launcher"
android:theme="#style/AppTheme">
<activity
android:name=".SplashActivity"
android:label="#string/app_name"
android:screenOrientation="portrait"
android:theme="#style/SplashTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name=".MainActivity"
android:label="#string/app_name"
android:screenOrientation="portrait"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize">
</activity>
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>
</manifest>
SplashActivity.java
package com.appba;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
public class SplashActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent intent = new Intent(this, MainActivity.class);
startActivity(intent);
finish();
}
}
MainActivity.java
package com.appba;
import com.facebook.react.ReactActivity;
public class MainActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript.
* This is used to schedule rendering of the component.
*/
#Override
protected String getMainComponentName() {
return "appBa";
}
}
Any idea how to avoid that blank screen?,
I couldn't find a solution on google
My splash is based on the following approach.
https://www.bignerdranch.com/blog/splash-screens-the-right-way/
Firstly load your LauncherActivity as MainActivity
MainActivity.java
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent i = new Intent(this, Splash.class);
startActivity(i);
}
Splash.java
private static int SPLASH_TIME_OUT = 5000;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
Handler handler = new Handler();
handler.postDelayed(new Runnable() {
#Override
public void run() {
finish();
}
}, SPLASH_TIME_OUT);
}
if your activity show data from database It is normal to Freezes (White Screen ) for a while ,If that is what you want you should use ProgressDialog or ProgressBar inside AsyncTask
I know two ways for solve this problem.
1. Write code on java for making more big delay on Splash screen.
2. Add android:theme="#style/AppTheme" in activity .MainActivity (in this case user doesn't have time to see difference between splash and MainActivity activites).

The Splash Screen is Not Shown

I have this code in my activity Splash. But, The thing is it does not show up when I start my application. What could be the " Wrong- step " here and what can I do to get it sorted?
public class Splash extends Activity {
Handler handler;
private long timeDelay = 2500;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
final Intent i = new Intent(this, Quotes.class);
handler = new Handler();
handler.postDelayed(new Runnable() {
public void run() {
startActivity(i);
finish();
}
}, timeDelay);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.splash, menu);
return true;
}
}
Set your Splash activity as starting activity when application starts. Add the below code in manifest.
<activity android:launchMode="singleTop" android:name=".Splash">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
Set your splash screen activity in mainfest
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="Packagename"
android:versionCode="1"
android:versionName="1.0" >
<application
android:allowBackup="false"
android:debuggable="true"
android:icon="#drawable/icon"
android:label="#string/app_name"
android:theme="#android:style/Theme.NoTitleBar" >
<activity
android:name=".SplashActivity"
android:screenOrientation="portrait"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
if your package is current then use_ this android:name=".SplashActivity"
otherwise put android:name="Package name.SplashActivity"
public class SplashActivity extends Activity {
private static final int SPALSH_TIME = 5000;// 5 Seconds
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.splash);
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
Intent intent = new Intent(SplashActivity.this,
MainTabActivity.class);
startActivity(intent);
SplashActivity.this.finish();
}
}, SPALSH_TIME);
}
#Override
public void onBackPressed() {
SplashActivity.this.finish();
super.onBackPressed();
}
}
android:launchMode="singleTop"
android:theme="#style/SplashTheme"
<application
android:name=".MainApplication"
android:label="#string/app_name"
android:icon="#mipmap/logo"
android:allowBackup="false"
android:theme="#style/SplashTheme">
<activity android:launchMode="singleTop" android:name=".Splash">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
styles.xml
<style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
<item name="android:windowBackground">#drawable/background_splash</item>
</style>
background_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/white"/>
<item>
<bitmap
android:gravity="center"
android:src="#drawable/background_768_1024"/>
</item>
</layer-list>

cannot show the android search dialog

I am a newbie in android, I am creating a test program to test the search dialog of android.
this is searchable.xml config file
<?xml version="1.0" encoding="utf-8"?>
<searchable
xmlns:android="http://schemas.android.com/apk/res/android"
android:label="Search"
android:hint="Type text to search">
</searchable>
this is manifest file
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="luan.com.bk"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk android:minSdkVersion="10" />
<application
android:icon="#drawable/ic_launcher"
android:label="#string/app_name" >
<activity android:name=".SearchActivity" >
<intent-filter>
<action android:name="android.intent.action.SEARCH" />
<category android:name="android.intent.category.DEFAULT" />
</intent-filter>
<meta-data
android:name="android.app.searchable"
android:resource="#xml/searchable" />
</activity>
<activity
android:name=".TestActivity"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
<meta-data
android:name="android.app.default_searchable"
android:value=".SearchActivity" />
</activity>
</application>
</manifest>
this is the searchActivity.java to request search
package luan.com.bk;
import android.app.Activity;
import android.os.Bundle;
public class SearchActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
}
}
this is the testActivity.java init the search dialog
package luan.com.bk;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
public class TestActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
But when I press the search key button on android simulator, the search bar not display, what is I wrong? please help. sorry because my english is not good.

Categories

Resources