Home > Software engineering >  How to match centering of RelativeLayout (centerInParent) and layer-list (gravity:center) as windowB
How to match centering of RelativeLayout (centerInParent) and layer-list (gravity:center) as windowB

Time:10-18

I have created windowBackground using layer-list, where i center item (bitmap) by using android:gravity="center". Then i show same image, but using Relative Layout with ImageView and it is centered using android:layout_centerInParent="true". However image in relative layout is slightly higher. How to center them, so they are at same position?

Layer list as windowBackground in splash_background file:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/appBackground" />
    <item>
        <bitmap
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:src="@raw/splash_animated" />
    </item>
</layer-list>

Activity with this Relative layout (using the style below):

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".LaunchAnimatedActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@raw/splash_animated" />

</RelativeLayout>

Style:

<style name="AppTheme.FullscreenSplash" parent="AppTheme.NoActionBar">
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowBackground">@drawable/splash_background</item>
        <item name="android:windowAnimationStyle">@null</item>
</style>

CodePudding user response:

Ok, there is no pretty way how to do this, but there is a way. What is happening is that the layout ImageView is jumping by the height of the status bar. The first step is to change the RelativeLayout to FrameLayout. (RelativeLayout completely ignores view margins). FrameLayout has the same centering attribute, but different name android:layout_gravity="center".

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".LaunchAnimatedActivity">

    <ImageView
        android:id="@ id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:src="@raw/splash_animated" />

</FrameLayout >

Then in onCreate of the Activity, you will have to check the height of the status bar and add a margin to the ImageView.

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.main_activity)
    val rootView = findViewById<FrameLayout>(R.id.root_view)
    val statusBarHeight = getStatusBarHeightForFullscreen(rootView)
    val imageView = findViewById<ImageView>(R.id.image)
    imageView.updateLayoutParams<FrameLayout.LayoutParams> { topMargin = (statusBarHeight * resources.displayMetrics.density).toInt() }
}

private fun getStatusBarHeightForFullscreen(rootView: View): Int {
    val display: Display = display ?: return 0
    val size: Point = Point()
    display.getSize(size)
    return size.y - rootView.height
}

CodePudding user response:

Frame Layout is the solution.

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<ImageView
    android:src="@drawable/splash"
    android:layout_gravity="center"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

    android:adjustViewBounds="true"
    android:scaleType="fitXY"

</FrameLayout>
  • Related