Android - align view center from bottom of another view

Question

The image speaks more than a long speech:

I want to center the center of the red part with the middle of the black part. I have no restrictions on the container (RelativeLayout, FrameLayout, LinearLayout oO).

I tried View with a height of 0dp aligned at the bottom of the black image and aligned the Baseline of the red image to it, but it doesn't work ...

Thank you for your help!

Answer 1

Finally, I use a more programmatic way to solve this problem, since the size of the Views is not fixed.

Here's the solution:

Layout:

<RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" > <View android:id="@+id/black" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true"/> <View android:id="@+id/red" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true"> </RelativeLayout> 

Code:

  red.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { red.getViewTreeObserver().removeOnGlobalLayoutListener(this); LayoutParams params = new LayoutParams( LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT ); params.setMargins(0, 0, 0, red.getHeight()/2); black.setLayoutParams(params); } }); 

Thank you for your help! It helps me find it!

Answer 2

Android now supports layout bindings using CoordinatorLayout :

 <android.support.design.widget.CoordinatorLayout 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"> <View android:id="@+id/black_view" android:layout_width="match_parent" android:layout_height="@dimen/black_height"/> <View android:id="@+id/red_view" android:layout_width="@dimen/red_width" android:layout_height="@dimen/red_height" app:layout_anchor="@id/black_view" app:layout_anchorGravity="bottom|center"/> </android.support.design.widget.CoordinatorLayout> 

If you resize views in Java code, the anchor will also be preserved.

Answer 3

try 2 views in relative layoutout. put 1 below the other (using the property below). also make them like layout_centerHorizontal = true.

u can make a negative addition to the bottom to raise it above the top.

good luck :)

Answer 4

 <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginBottom="25dp" android:background="#EEFFFFFF" android:orientation="vertical"> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="50dp" android:layout_alignParentBottom="true" /> 

Answer 5

Here I use two different View as black and red.

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <View android:layout_width="match_parent" android:layout_height="300dp" android:background="@android:color/black" android:id="@+id/blackContainer" /> <View android:layout_width="match_parent" android:layout_height="100dp" android:background="@android:color/holo_red_light" android:layout_below="@+id/blackContainer" android:layout_marginTop="-50dp"/> </RelativeLayout> 

The trick is that I put the red container under the black container and set its marginTop to the negative half of its height. Thus, the center of the red container is at the bottom of the black container.

Answer 6

Try the opposite. First fix the smaller view and place the other view accordingly. Something like that:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <View android:layout_width="100dp" android:layout_height="200dp" android:layout_centerHorizontal="true" android:layout_alignBottom="@+id/anchor" android:background="@color/black" /> <View android:layout_width="80dp" android:layout_height="50dp" android:layout_centerInParent="true" android:background="@color/light_grey"/> <View android:id="@+id/anchor" android:layout_centerInParent="true" android:layout_width="0dp" android:layout_height="0dp"/> </RelativeLayout>