[react-native]spalsh-screen

kiten Jung·2022년 8월 10일
0

라이브러리

목록 보기
7/9

라이브러리 react-native-splash-screen

ios

AppDelegate.m에
1. #import "RNSplashScreen.h"
2. didFinishLaunchingWithOptions에 [RNSplashScreen show]; 추가

android

  • 모든 이미지에 splash_icon으로 변경

app/src/main/res/drawable/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/splashscreen_bg"/>
    <item
        android:width="300dp"
        android:height="300dp"
        android:drawable="@mipmap/splash_icon"
        android:gravity="center" />

</layer-list>

/app/src/main/res/values

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="splashscreen_bg">#ffffff</color>
    <color name="app_bg">#ffffff</color>
</resources>

app/src/main/res/values/styles.xml

아래부분 추가
  <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:statusBarColor">@color/splashscreen_bg</item>
        <item name="android:background">@drawable/background_splash</item>
 </style>

android/app/src/main/AndroidManifest.xml

        <activity
          android:name=".SplashActivity"
          android:theme="@style/SplashTheme"
          android:label="@string/app_name"
          android:exported="true">
          <intent-filter>
              <action android:name="android.intent.action.MAIN" />
              <category android:name="android.intent.category.LAUNCHER" />
          </intent-filter>
        </activity>

기존에 activity안에 있는 intent-filter태그를 빼서 위에 SplashActivity 를 추가하고 안에 intent-filter태그 이동

SplashActivity.java 파일을 생성

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, MainActivity.class);
        startActivity(intent);
        finish();
    }
}

MainActivity에 아래 부분 추가

import org.devio.rn.splashscreen.SplashScreen;
import android.os.Bundle;


  @Override
    protected void onCreate(Bundle savedInstanceState) {
        SplashScreen.show(this);
        super.onCreate(savedInstanceState);
    }

app/src/main/res/layout/launch_screen.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/background_splash"
    android:orientation="vertical">
</LinearLayout>

react-native App에 추가

SplashScreen.hide();

참조블로그) https://ingg.dev/rn-splash/

profile
느림느림

0개의 댓글