Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Center Android WindowBackground with Activity ImageView

Context

Step1: Currently I have one activity which uses android:windowBackground to set the initial background while we wait for the activity to load. This loads a bitmap which should be center aligned.

Step2: Once the activity is loaded it does a simple setContentView to set the background for the activity which will now replace the android:windowBackground from step1. This loads an imageView which should be center aligned.

The problem is they are not both aligned center, there is some kind of offset on one or the other misaligning them. Maby the statusbar pushing down the one? I am not sure. Any ideas why they are not aligned the same?

I would like to have them both center aligned. I have tried using fitSystemWindows="true" with no luck.

When I add android:layout_marginTop="12dp" to the activity (activity_start_onboarding.xml) layouts imageView both align fine but it does not align for all densities, other densities are misaligned.

Maby there is a way to dynamically calculate this offset to align then for all densities?


Compare Images

Left (Grey) - Step1 (windowBackground):
Right (Blue) - Step2 (activity layout): enter image description here


The Code

AndroidManifest.xml

<activity android:name=".view.onboarding.ActivityStartOnboarding"
            android:launchMode="singleTask"
            android:screenOrientation="portrait"
            android:theme="@style/ColdstartSplashTheme">

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

styles.xml

<style name="ColdstartSplashTheme" parent="SuperbalistTheme.Dark">
    <item name="android:windowBackground">@drawable/splash_background</item>
</style>

@drawable/splash_background

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/grey_mid_dark" />

<item>
    <bitmap
        android:gravity="center"
        android:src="@drawable/ic_delivery_free_raster" />
</item>

ActivityStartOnboarding.java

public class ActivityStartOnboarding extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_start_onboarding);
  }
}

activity_start_onboarding.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/blue_light_darker"
        android:fitsSystemWindows="true">

        <androidx.appcompat.widget.AppCompatImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:src="@drawable/splash_background" />
    </FrameLayout>
</layout>
like image 931
Francois Avatar asked Mar 03 '19 01:03

Francois


3 Answers

android:fitsSystemWindows="true"

That is your problem. Your FrameLayout start to inflate under statusbar, which height ~25dp, therefore AppCompatImageView a bit higher.

First solution: Remove android:fitsSystemWindows="true" from activity_start_onboarding.xml FrameLayout.

Second solution: Add <item name="android:windowDrawsSystemBarBackgrounds">true</item> to your ColdstartSplashTheme. The background starts drawing under status bar and bitmap will be higher.

like image 58
Ilya Lavrov Avatar answered Oct 19 '22 11:10

Ilya Lavrov


Use background instead of windowBackground

<style name="ColdstartSplashTheme" parent="SuperbalistTheme.Dark">
    <item name="android:background">@drawable/splash_background</item>
</style>
like image 25
Vishal Pawar Avatar answered Oct 19 '22 10:10

Vishal Pawar


For me the accepted solution didn' work. But I found this and it worked like a charm. Its also a more flexible solution because it doesn't depend on API 21

like image 3
rimes Avatar answered Oct 19 '22 11:10

rimes