RelativeLayout insert a view between two others

Question

Let's say I have two buttons in a RelativeLayout. A button labeled "one" at the top and a button labeled "three" underneath "one". The layout is defined like this.

<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:id="@+id/mainContainer"
    tools:context=".MainActivity" >

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

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tvThree"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/tvOne"
        android:text="Three" />
</RelativeLayout>

So I wrote some code in the onCreate of MainActivity to dynamically create a Button, and insert it in between one and three. But it isn't working. Is there something I'm missing? I created this question as a simplified version of a bigger problem I'm having, so it's not acceptable for me to clear the layout and just insert one two and three dynamically.

protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Button one = (Button)findViewById(R.id.tvOne);
    Button three = (Button)findViewById(R.id.tvThree);

    //Dynamically create a button, set it underneath one and above two.
    Button two = new Button(this);
    two.setText("TWO TWO TWO TWO TWO TWO TWO");

    //Create some layout params so that this button is horizontally centered,
    //above button number three and below button number one
    final int WC = RelativeLayout.LayoutParams.WRAP_CONTENT;
    RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(WC, WC);
    params.addRule(RelativeLayout.CENTER_HORIZONTAL, RelativeLayout.TRUE);
    params.addRule(RelativeLayout.BELOW, one.getId());
    params.addRule(RelativeLayout.ABOVE, three.getId());

    two.setLayoutParams(params);

    //Add button number two to the activity.
    RelativeLayout rl = (RelativeLayout)findViewById(R.id.mainContainer);
    rl.addView(two);
}

You don't change layoutparams for button three.. so it's always valid the "android:layout_below="@id/tvOne"". — fasteque, Nov 28 '13 at 08:12
May be this can be of help to you: http://stackoverflow.com/questions/12524589/how-can-we-add-buttons-at-dynamic-positions-in-layout — Sulav Timsina, Nov 28 '13 at 08:17

score 3 · Accepted Answer · edited Dec 18 '14 at 10:50

Working code and I have checked this.

public class Main extends Activity {

    Context ctx;
    RelativeLayout rlayMainContainer;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ctx = this;

        rlayMainContainer = (RelativeLayout) findViewById(R.id.mainContainer);
        Button one = (Button) findViewById(R.id.tvOne);
        Button three = (Button) findViewById(R.id.tvThree);


        // adding button two dynamically
        Button two = new Button(ctx);
        two.setText("hello");
        two.setId(12);

        RelativeLayout.LayoutParams lpSecond = new RelativeLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        lpSecond.addRule(RelativeLayout.CENTER_HORIZONTAL);
        lpSecond.addRule(RelativeLayout.BELOW, one.getId());

        rlayMainContainer.addView(two, lpSecond);

        //align button three below button two

        RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) three
                .getLayoutParams();

        params.addRule(RelativeLayout.BELOW, two.getId());

        three.setLayoutParams(params);
    }
}

enter image description here

Binh Tran · Answer 2 · 2013-11-28T09:29:24.847

In fact, the "two" button is there, but you can not see it because its height = 0. These lines of code make the "two" button's height = 0

params.addRule(RelativeLayout.BELOW, one.getId());
params.addRule(RelativeLayout.ABOVE, three.getId());

Yes, the "two" button layoutParams indicates that it must be between "one" and "three", but there is no space left between those buttons --> no height.

To solve this, you need to remove the line that set "two" is above "three" and add code to indicate that "three" is now below "two"

        final int WC = RelativeLayout.LayoutParams.WRAP_CONTENT;
        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(
                WC, WC);
        params.addRule(RelativeLayout.CENTER_HORIZONTAL, RelativeLayout.TRUE);
        params.addRule(RelativeLayout.BELOW, one.getId());

        two.setLayoutParams(params);

        // Add button number two to the activity.
        RelativeLayout rl = (RelativeLayout) findViewById(R.id.mainContainer);
        rl.addView(two);

        two.setId(1);
        params = (LayoutParams) three.getLayoutParams();
        params.addRule(RelativeLayout.BELOW, two.getId());
        three.setLayoutParams(params);

Now I'm getting a circular reference problem that I can't solve. — Angus Cheng, Nov 28 '13 at 09:21
Oops, sorry, as I comment above: remove the line that set "two" is above "three". (I have edited the code) — Binh Tran, Nov 28 '13 at 09:28

RelativeLayout insert a view between two others

2 Answers2

Linked