Relative Layout. Between 2 items

Question

relative layout

How can I position an item between 2 other items and align it in the center? (please see the red button in the picture above) - How can I position it between the "Center Button" and "Bottom Button"?

Here is my relative layout code:

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

    <Button 
        android:id="@+id/button_center" 
        android:text="Center" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_centerVertical="true" 
        android:layout_centerInParent="true"/>

    <!-- The new button should be between these 2 items -->

    <Button 
        android:id="@+id/button_bottom" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Bottom" 
        android:layout_centerHorizontal="true" 
        android:layout_alignParentBottom="true"/> 

    <Button 
        android:id="@+id/button_top" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Top" 
        android:layout_alignParentTop="true" 
        android:layout_centerHorizontal="true"/> 

    <Button 
        android:id="@+id/button_left" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Left" 
        android:layout_alignParentLeft="true" 
        android:layout_centerVertical="true"/> 

    <Button 
        android:id="@+id/button_rignt" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Right" 
        android:layout_alignParentRight="true" 
        android:layout_centerVertical="true"/> 

    <Button 
        android:id="@+id/button_rel_right" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_toLeftOf="@id/button_right" 
        android:layout_alignTop="@id/button_rignt" 
        android:text="RelRight"/> 

    <Button 
        android:id="@+id/button_rel_left" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_toRightOf="@id/button_left" 
        android:layout_alignTop="@id/button_left" 
        android:text="RelLeft"/> 

</RelativeLayout>

Jan S. · Accepted Answer · 2011-10-29T22:59:32.613

You will need to add another layout so that the button will be exactly in the middle. For example, add this to your layout:

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_above="@+id/button_bottom"
    android:layout_alignLeft="@+id/button_center"
    android:layout_alignRight="@+id/button_center"
    android:layout_below="@id/button_center" >
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="new" />
</FrameLayout>

score -1 · Answer 2 · answered Oct 29 '11 at 17:12

I came to this solution:

<?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">

  <!-- centered button -->

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

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

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">

      <Button android:text="CenteredButton"
              android:id="@+id/centered_button"         
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_gravity="center"/>

    </FrameLayout>  
  </LinearLayout>

</RelativeLayout>

Just use this code with LinearLayout instead of the Button. I think it is not the best one, but it is good enough.

Relative Layout. Between 2 items

2 Answers2