How to create Android splash screen with images and percent position

I am trying to create an Android splash screen that has two images: one in the center of the screen and one that is about 20% away from the bottom of the screen. Is there any way to do this?

The approach I tried thus far is to have a SplashActivity as the first activity and the manifest file sets the theme as SplashTheme:

In AndroidManifest.xml:

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


Then in styles.xml I define this theme:

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


Next I create the drawable file background_splash.xml and this is where I have questions:

<?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="@color/dark_gray" />
<padding
android:left="0dip"
android:top="0dip"
android:right="0dip"
android:bottom="0dip" />
</shape>
</item>

<item>
<bitmap
android:gravity="center"
android:src="@mipmap/mainlogo"/>

</item>

<item android:bottom="@dimen/splash_bottom">
<bitmap android:src="@mipmap/bottom_logo"
android:gravity="bottom" />
</item>

</layer-list>


This actually sort-of works, the mainlogo is indeed in the center and the bottom_logo is some distance above the bottom. The problem is that I need to specify values in dp for splash_bottom in dimens.xml. Doing this accurately for ldpi, mdpi, hdpi xhdpi etc is really hard to get right.

Isn't there a way inside the drawable file background_splash.xml to place the bottom_logo 20% from the bottom of the screen?

The desired splash screen looks something like this (not the actual screen - I borrowed this from another SO post - see Android: how to align 2 images on a splash screen):

2 Answers
2

You should change the @dimen/splash_bottom in background_splash.xml file.

@dimen/splash_bottom

background_splash.xml

Now, the position of bottom image is changed according to dimension value.
To fix the issue, you should do as following methods.
I believe anything in the res/ folder can use "Configuration Qualifiers". So for example, you can have a values-xxhdpi, values-sw600dp-mdpi-land/, values-w400dp folder, and so on.

res/

values-xxhdpi

values-sw600dp-mdpi-land/

values-w400dp

Other words, you have to create different values folder for different screens.

values-sw720dp 10.1” tablet 1280x800 mdpi

values-sw600dp 7.0” tablet 1024x600 mdpi

values-sw480dp 5.4” 480x854 mdpi
values-sw480dp 5.1” 480x800 mdpi

values-xxhdpi 5.5" 1080x1920 xxhdpi
values-xxxhdpi 5.5" 1440x2560 xxxhdpi

values-xhdpi 4.7” 1280x720 xhdpi
values-xhdpi 4.65” 720x1280 xhdpi

values-hdpi 4.0” 480x800 hdpi
values-hdpi 3.7” 480x854 hdpi

values-mdpi 3.2” 320x480 mdpi

values-ldpi 3.4” 240x432 ldpi
values-ldpi 3.3” 240x400 ldpi
values-ldpi 2.7” 240x320 ldpi


Thanks.

"layer-list & item" have no percentage properties to set their position.

To implement your idea, you should use layout XML file.

In AndroidManifest.xml

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


In SplashActivity.java

public class SplashActivity extends Activity

@Override
protected void onCreate(@Nullable Bundle savedInstanceState)
super.onCreate(savedInstanceState);

// SET no title , full-screen mode
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);

// SET activity_splash.xml as layout
final View viewSplash = View.inflate(this, R.layout.activity_splash, null);
setContentView(viewSplash);

// Gradient Animation
AlphaAnimation anim = new AlphaAnimation(0.5f, 1.0f); // change alpha from 0.5 to 1.0
anim.setDuration(5000); // animate in 5000ms
viewSplash.setAnimation(anim);
anim.setAnimationListener(
new Animation.AnimationListener()
@Override
public void onAnimationStart(Animation animation)



@Override
public void onAnimationRepeat(Animation animation)



@Override
public void onAnimationEnd(Animation animation)
// redirect to the other screen, such as MainActivity
Intent intent = new Intent(SplashActivity.this, MainActivity.class);
startActivity(intent);

// close SplashActivity
finish();

);




activity_splash.xml might be one of followings;

1. layout_weight of LinearLayout

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/dark_gray">

<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@mipmap/mainlogo"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<View android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.4"/>

<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight="0.6"
android:src="@mipmap/bottom_logo"/>
</LinearLayout>


Screenshot.1

2. layout_constraintGuide_percent of Guidline

<android.support.constraint.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"
android:background="@color/dark_gray">

<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/mainlogo"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>

<android.support.constraint.Guideline
android:id="@+id/bottom_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintGuide_percent=".8"
android:orientation="horizontal" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/bottom_logo"
app:layout_constraintBottom_toBottomOf="@+id/bottom_guideline"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>


Screenshot.2

3. layout_marginLeftPercent of PercentRelativeLayout

But this class was deprecated in API level 26.1.0. so i did not upload the xml about that.

Required, but never shown

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.