CODEWITHSUNDEEP
androidandroid-layoutsvgiconsimagemagick
hajas
hajas

Reputation: 133

Splash Screen logo displayed is of poor quality

I am building an Android Application that has a :

Splash Screen , which displays the logo of the Application

What is working :

The screen is being displayed perfectly well and is going to FirstActivity as desired if I set a ImageView in a layout for the SplashScreenActivity .

What isn't :

However this isn't the correct approach as it produces a delay when the App starts as layout is being inflated . I have used the recommended approach as follows :

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
        android:gravity="center">
        <bitmap
            android:src="@drawable/logo"
            android:gravity="center"/>
    </item>
</layer-list>

styles.xml

<style name="Splash" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowBackground">@drawable/splash</item>
</style>

AndroidManifest.xml

<application
    android:theme="@style/Splash">

But it still isn't as sharp as using a ImageView with a Vector Drawable as its source and finally I can't think of any other way now .

So , how can I achieve the same quality of the image like all other Apps have ? Also is there any way I can make bitmap use the SVG itself ?

Upvotes: 6

Views: 4049

Answers (2)

quealegriamasalegre
quealegriamasalegre

Reputation: 3258

@hrk sing is right, dont even bother trying to display a bitmap correctly. you will always get low resolution images. the best you can do is really create a vectordrawable even online on a page such as vectr. what I did is silmply scale the vectordrawable directly in the xml and it finally worked perfectly for my splash screen

<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
android:viewportWidth="640"
android:viewportHeight="640"
android:width="240dp"
android:height="240dp">
<path
    android:pathData="M320.96 55.9L477.14 345L161.67 345L320.96 55.9Z"
    android:strokeColor="#292929"
    android:strokeWidth="24" />
</vector>

in the code above I am rescaling a drawable I drew on a 640x640 canvas to be 240x240. then i just put in in my splash screen drawable like so and it works great:

<?xml version="1.0" encoding="utf-8"?>


<!-- The background color, preferably the same as your normal theme -->
<item>
    <shape>
        <size android:height="120dp" android:width="120dp"/>
        <solid android:color="@android:color/white"/>
    </shape>
</item>

<!-- Your product logo - 144dp color version of your app icon -->
<item
    android:drawable="@drawable/logo_vect"
    android:gravity="center">

</item>

my code is actually only drawing the triangle in the following picture but here you see what you can achieve with this. Resolution is finally great as opposed to the pixelated edges I was getting when using bitmap.

my apps splash screen

Upvotes: 3

hrk singh
hrk singh

Reputation: 185

You Should use vector instead of png or jpg

to use vector in android use 

app:srcCompat="@drawable/logo"

and you need to add vectorDrawables.useSupportLibrary = true to your build.gradle file

 // Gradle Plugin 2.0+  
   android {  
   defaultConfig {  
   vectorDrawables.useSupportLibrary = true  
  }  
}

for more information and usage REFER TO: https://www.androidhive.info/2017/02/android-working-svg-vector-drawables/

Upvotes: 0

Related Questions