2

I have a logo image asset which I am using as splash screen.I am trying to achieve result like instagram , snapchat which shows their logo in splash screen

I have a made a layout with black background and a imageview with my image asset

Logo

AndroidManifest

   <application
        android:name=".BaseApplication"
        android:allowBackup="true"
        android:configChanges="orientation|keyboardHidden|screenSize"
        android:icon="@mipmap/ic_logo_black_no_title"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_logo_black_no_title_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

        <meta-data
            android:name="com.google.mlkit.vision.DEPENDENCIES"
            android:value="ocr" />

        <activity android:name=".SplashActivity"
            android:screenOrientation="portrait">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity
            android:name=".MainActivity"
            android:screenOrientation="portrait">
        </activity>

        <provider
            android:name="androidx.core.content.FileProvider"
            android:authorities="com.pratiksahu.android.fileprovider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/file_paths" />
        </provider>
    </application>

welcome_splash_screen.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="#000000"
    tools:context=".SplashActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="70sp"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/logo_512_512" />

</androidx.constraintlayout.widget.ConstraintLayout>

SplashActivity.kt

class SplashActivity : AppCompatActivity(){

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.welcome_splash_screen)
        val handler = Handler()
        handler.postDelayed({
            val intent = Intent(this, MainActivity::class.java)
            startActivity(intent)
            finish()
        }, 3000)
    }
}

The 3000ms delay is for starting other activity

This is working fine but when I start app , it takes few seconds to load the my splash screen layout.

When app starts

After few seconds

Is there any way I can load the layout faster or any alternative way to show splash screen?

UPDATE 1 - After trying varun's answer Logo size issue

UPDATE 2 - I was using xxxhdpi but now I am using mdpi , the image is not getting out of screen but it is still big . mdpi result Can I change the resolution according to device?

UPDATE 3 SOLVED -

splash_screen.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/black" />
        </shape>
    </item>
    <item
        android:width="80dp"        //mentioned width
        android:height="80dp"       //mentioned height
        android:drawable="@drawable/logo_mdpi"
        android:gravity="center" />
</layer-list>

Image can be resized by mentioning height width in drawable item

Pratik
  • 61
  • 1
  • 8

1 Answers1

4

What you are doing is not correct. The purpose of the Splash screen is to fill in the time which is currently taken by the system to load your app not to make the user wait for one second before the app loads. I always set a splash screen by this method and it works perfectly and does not make users wait.

splash_screen.xml (put this inside the res>drawable folder)

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white" />
        </shape>
    </item>
    <item
        android:drawable="@drawable/ic_logo_full"
        android:gravity="center" />
</layer-list>

In your styles.xml add these line.

<style name="SplashTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
     <item name="android:windowBackground">@drawable/splash_screen</item>
</style>

In your manifest add these

<application
    ...
    android:theme="@style/SplashTheme"/>

In your MainActivity

override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setTheme(R.style.AppTheme)
      setContentView(R.layout.activity_view)
      ...
}

Edit 1:

To fix the size issue you can try this drawable. Set whatever width and height you need.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <size android:height="20dp" android:width="20dp"/>
            <solid android:color="@android:color/white" />
        </shape>
    </item>
    <item
        android:drawable="@drawable/ic_logo_full"
        android:gravity="center" />
</layer-list>
OhhhThatVarun
  • 3,981
  • 2
  • 26
  • 49