Add Relative Layout below current Relative Layout programmatically in Android

Question

I am trying to create a method where each time I click a button, I want the screen to display a Relative Layout box below one that is currently there or create one at the top if there isn't one there and I want it to keep creating them below from each button click. Currently it just displays the Relative Layout box at the top of the screen as it would expect to do.

Here is the code that I have so far and can someone please help me see what I am doing wrong and what I can do to fix this issue:

onCreate code:

    Resources r = this.getResources();
    dpMargin = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 16, r.getDisplayMetrics()); //Changes pixels to dp of margins
    dpContainerHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 80, r.getDisplayMetrics()); //Changes pixels to dp of container height
    dpContainerPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 10, r.getDisplayMetrics()); //Changes pixels to dp of container padding

    layout = new RelativeLayout(this);

    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
    RelativeLayout.LayoutParams textParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams textParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams textParams3 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams textParams4 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams progressParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams imageButtonParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams newLayoutButtonParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    RelativeLayout.LayoutParams containerParams1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);
    RelativeLayout.LayoutParams containerParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);

    layout.setPadding(dpMargin, dpMargin, dpMargin, dpMargin);

    //Declaring new views
    tv1 = new TextView(this);
    tv2 = new TextView(this);
    containerLayout1 = new RelativeLayout(this);
    containerLayout2 = new RelativeLayout(this);
    tv3 = new TextView(this);
    tv4 = new TextView(this);
    pb1 = new ProgressBar(this);
    ib1 = new ImageButton(this);
    newLayoutButton = new Button(this);

    //Declaring views ID's
    tv1.setId(1);
    tv2.setId(2);
    containerLayout1.setId(3);
    containerLayout2.setId(4);
    tv3.setId(5);
    tv4.setId(6);
    pb1.setId(7);
    ib1.setId(8);
    newLayoutButton.setId(9);

    //Text view 1
    textParams1.addRule(RelativeLayout.ALIGN_PARENT_TOP);
    textParams1.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
    tv1.setText("TextView1");

    //Text view 2
    textParams2.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
    textParams2.addRule(RelativeLayout.BELOW, tv1.getId());
    textParams2.setMargins(0, 0, 0, dpMargin);
    tv2.setText("TextView2");

    //Container 1
    containerParams1.addRule(RelativeLayout.ALIGN_LEFT, tv2.getId());
    containerParams1.addRule(RelativeLayout.ALIGN_RIGHT, tv1.getId());
    containerParams1.addRule(RelativeLayout.BELOW, tv2.getId());
    containerParams1.setMargins(0, 0, 0, dpMargin);
    containerLayout1.setPadding(dpContainerPadding, 0, dpContainerPadding, dpContainerPadding);
    containerLayout1.setBackgroundResource(R.color.display_panels);

    //Container 2
    containerParams2.addRule(RelativeLayout.ALIGN_LEFT, containerLayout1.getId());
    containerParams2.addRule(RelativeLayout.ALIGN_RIGHT, containerLayout1.getId());
    containerParams2.addRule(RelativeLayout.BELOW, containerLayout1.getId());
    containerParams2.setMargins(0, 0, 0, dpMargin);
    containerLayout2.setBackgroundResource(R.color.display_panels);

    //Text view 3
    textParams3.addRule(RelativeLayout.ABOVE, tv4.getId());
    textParams3.addRule(RelativeLayout.ALIGN_LEFT, pb1.getId());
    tv3.setText("TextView3");
    tv3.setTextAppearance(this, android.R.style.TextAppearance_Small); //Need to change text colour to white
    tv3.setTextColor(getResources().getColor(R.color.text_colour));

    //Text view 4
    textParams4.addRule(RelativeLayout.ABOVE, pb1.getId());
    textParams4.addRule(RelativeLayout.CENTER_HORIZONTAL);
    tv4.setText("TextView4");
    tv4.setTextAppearance(this, android.R.style.TextAppearance_Small); //Need to change text colour to white
    tv4.setTextColor(getResources().getColor(R.color.text_colour));

    //Progress bar 1
    progressParams1.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
    progressParams1.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
    progressParams1.addRule(RelativeLayout.LEFT_OF, ib1.getId());
    pb1.setProgress(40);
    pb1.setMax(100);

    //Image button 1
    imageButtonParams1.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
    imageButtonParams1.addRule(RelativeLayout.BELOW, tv4.getId());
    ib1.setBackgroundResource(R.color.display_panels);
    ib1.setImageResource(R.drawable.ic_green_ok);

    newLayoutButtonParams.addRule(RelativeLayout.ABOVE, tv2.getId());
    newLayoutButton.setText("New Layout");
    newLayoutButton.setOnClickListener(this);

    layout.addView(tv1, textParams1);
    layout.addView(tv2, textParams2);
    layout.addView(newLayoutButton, newLayoutButtonParams);
    containerLayout1.addView(tv3, textParams3);
    containerLayout1.addView(tv4, textParams4);
    containerLayout1.addView(pb1, progressParams1);
    containerLayout1.addView(ib1, imageButtonParams1);
    layout.addView(containerLayout1, containerParams1);
    layout.addView(containerLayout2, containerParams2);
    setContentView(layout, layoutParams);

createNewLayout method code:

public RelativeLayout createNewLayout(RelativeLayout newlayout){

    newLayoutContainer = new RelativeLayout(this);
    final RelativeLayout.LayoutParams newLayoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);
    newLayoutContainer.setLayoutParams(newLayoutParams);

    newLayoutParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
    newLayoutParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
    newLayoutParams.addRule(RelativeLayout.BELOW);
    newLayoutParams.setMargins(0, 0, 0, dpMargin);
    newLayoutContainer.setBackgroundResource(R.color.display_panels);

    return newLayoutContainer;

}

onClick code:

    public void onClick(View v) {
    // TODO Auto-generated method stub
    if(v==newLayoutButton){

        layout.addView(createNewLayout(newLayoutContainer), 0);

    }
}

EDIT

new method code:

public void createNewLayout(){

    int currentId = 1;

    for(int i = 1; i <= numberOfLayouts; i++){
        newLayoutContainer = new RelativeLayout(this);
        newLayoutContainer.setId(currentId);

        if(currentId == 1){
            newLayoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);
            newLayoutParams.addRule(RelativeLayout.ALIGN_LEFT, containerLayout2.getId());
            newLayoutParams.addRule(RelativeLayout.ALIGN_RIGHT, containerLayout2.getId());
            newLayoutParams.addRule(RelativeLayout.BELOW, containerLayout2.getId());
            newLayoutParams.setMargins(0, 0, 0, dpMargin);
            newLayoutContainer.setBackgroundResource(R.color.display_panels);
        }

        else{
            newLayoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);
            newLayoutParams.addRule(RelativeLayout.ALIGN_LEFT, newLayoutContainer.getId());
            newLayoutParams.addRule(RelativeLayout.ALIGN_RIGHT, newLayoutContainer.getId());
            newLayoutParams.addRule(RelativeLayout.BELOW, currentId);
            newLayoutParams.setMargins(0, 0, 0, dpMargin);
            newLayoutContainer.setBackgroundResource(R.color.display_panels);
        }

        newLayoutContainer.setLayoutParams(newLayoutParams);
        layout.addView(newLayoutContainer);

        currentId++;
    }

}

rachit · Answer 1 · 2013-07-09T13:40:16.400

You could use a global variable to store currentId assigned to layouts, and update it every time u add a layout.

int currentId = 10;

button click function

public void onClick(View v) {

if(v==newLayoutButton){

    layout.addView(createNewLayout(newLayoutContainer,currentId), 0);
    currentId++;

    }
}

createNewLayout function will have one more attribute as currentId.

public RelativeLayout createNewLayout(RelativeLayout newlayout, int currentId){

newLayoutContainer = new RelativeLayout(this);

final RelativeLayout.LayoutParams newLayoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight);

newLayoutParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
newLayoutParams.addRule(RelativeLayout.BELOW, currentId);
newLayoutParams.setMargins(0, 0, 0, dpMargin);

newLayoutContainer.setLayoutParams(newLayoutParams);

newLayoutContainer.setBackgroundResource(R.color.display_panels);

return newLayoutContainer;
}

Try this working code:

int currentId = 5;
@Override
public void onClick(View v) {
    if(v.getId()==9){
        containerLayout2.addView(createNewLayout(currentId), 0);
        currentId +=10;
    }
}

createNewLayoutFunction

public RelativeLayout createNewLayout(int currentId){

    RelativeLayout newLayoutContainer = new RelativeLayout(this);

    final RelativeLayout.LayoutParams newLayoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);

    newLayoutParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
    newLayoutParams.addRule(RelativeLayout.BELOW, currentId);
    newLayoutParams.setMargins(0, 0, 0, dpMargin);

    newLayoutContainer.setLayoutParams(newLayoutParams);

    RelativeLayout.LayoutParams image = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    ImageView x = new ImageView(this);
    x.setImageResource(android.R.drawable.ic_media_play);

    newLayoutContainer.addView(x, image);

    newLayoutContainer.setId(currentId+10);
    newLayoutContainer.setBackgroundResource(R.color.display_panels);

    return newLayoutContainer;
    }

also change this line in containerParams2

RelativeLayout.LayoutParams containerParams2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, dpContainerHeight+330);

this should work fine. working in my code.

That makes sense to me, I thought that I might need to do something like that, but it still displays the box at the top of the screen and when I keep clicking the button, no more appear. Can you see anything else that could be done to fix this problem? Thank you very much for your help! — James Meade, Jul 09 '13 at 08:36
@JamesMeade: edited the code a bit. please try now if it works. — rachit, Jul 09 '13 at 09:41
Thank you for the updated code, but it is still doing the same thing. Do you have any other ideas? — James Meade, Jul 09 '13 at 09:50
trying the code in a dummy application, will tell u if I find something. — rachit, Jul 09 '13 at 10:00
Thank you very much! I have just edited my question with a new method that I have tried which I think will be more efficient, but that does not work either. It doesn't show up anything when the button is clicked. Could you please look at this method for me please to see what could be done to fix the issue? — James Meade, Jul 09 '13 at 10:58
How did the dummy application go and did you test my edited code? — James Meade, Jul 09 '13 at 12:49
Thank you for the updated code, but it did not work for me. I think the code that I just put into the question under the header 'EDIT:' is more like the sort of thing I need. Although it isn't showing up anything when the button is clicked. Would you please be able to look at that code and see if there's anything that you can see that I can do to fix the issue. — James Meade, Jul 10 '13 at 12:56

Add Relative Layout below current Relative Layout programmatically in Android

1 Answers1