Programmatically adding a grid of buttons inside Relative layout

Question

My intention is to programmatically create a grid of buttons inside a Relative Layout. The reason why I want to do it programmatically is because the number of buttons varies by situation, ie I might need 12 buttons instead of 9 and so on.

I managed to do this but with a Linear layout

However, this is the desired outcome

As far as I can tell, I need to create the buttons inside a Relative Layout instead but this is what happens when I change the layout to Relative.. They just stack on top of each other.

Here is the code that creates the buttons:

for (int i = 0; i < frows; i++) {
        LinearLayout row = new LinearLayout(this);
        row.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
        row.setGravity(Gravity.CENTER_HORIZONTAL);
        row.setPadding(0, 40, 0, 0);

        for (int j = 0; j < 3; j++) {
            ContextThemeWrapper newContext = new ContextThemeWrapper(getBaseContext(), R.style.ExerciseButtonTheme);
            eBtn = new Button(newContext);
            eBtn.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
            eBtn.setText("" + (j + 1 + (i * 3)));
            eBtn.setId(j + 1 + (i * 3));

            eBtn.setBackgroundResource(R.drawable.exercisebutton);
            row.addView(eBtn);

            eBtn.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View view) {
                    Intent intent = new Intent(getApplicationContext(), ListActivity.class);
                    id = "" + view.getId();
                    intent.putExtra(EXTRA_MESSAGE, id);
                    startActivity(intent);
                }
            });

        }

        layout.addView(row);
    }

I've spent a lot of time trying to figure it out and search for existing answers but to no avail. Any help will be greatly appreciated!

EDIT

<item android:state_pressed="true">
    <shape>
        <solid android:color="#449def"/>
        <stroke android:width="1dp" android:color="#2f6699"/>
        <corners android:radius="6dp"/>
        <padding android:left="10dp" android:top="10dp" android:right="10dp"
            android:bottom="10dp"/>
    </shape>
</item>

<item>
    <shape>
        <gradient android:startColor="#449def" android:endColor="#2f6699" android:angle="270"/>
        <stroke android:width="1dp" android:color="#2f6699"/>
        <corners android:radius="4dp"/>
        <padding android:left="10dp" android:top="10dp" android:right="10dp"
            android:bottom="10dp"/>
    </shape>
</item>

Answer 1

1. findViewById for RelativeLayout

2.add outer LinearLayout

3.add inner LinearLayout and add Button

4.add Button to the inner LinearLayout

5.add inner LinearLayout to the outer LinearLayout

6.add outer LinearLayout to the RelativeLayout .

And I use in the Activity class .And You can change when you use other class . Try this .

private RelativeLayout mRelativeLayout;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_your);
    // findViewById for RelativeLayout
    mRelativeLayout = (RelativeLayout) findViewById(R.id.your_relative);
    // add LinearLayout
    LinearLayout linear = new LinearLayout(this);
    linear.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));
    // set setOrientation
    linear.setOrientation(LinearLayout.VERTICAL);
    for (int i = 0; i < 3; i++) {
        LinearLayout row = new LinearLayout(this);
        row.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
        row.setGravity(Gravity.CENTER_HORIZONTAL);
        row.setPadding(0, 40, 0, 0);

        for (int j = 0; j < 3; j++) {
            Button eBtn = new Button(this);
            eBtn.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
            eBtn.setText("" + (j + 1 + (i * 3)));
            eBtn.setId(j + 1 + (i * 3));

            eBtn.setBackgroundResource(R.drawable.exercisebutton);
            // add view to the inner LinearLayout
            row.addView(eBtn);

            eBtn.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View view) {
                    Intent intent = new Intent(getApplicationContext(), ListActivity.class);
                    id = "" + view.getId();
                    intent.putExtra(EXTRA_MESSAGE, id);
                    startActivity(intent);
                }
            });
        }
        // add view to the outer LinearLayout
        linear.addView(row);
    }
    mRelativeLayout.addView(linear);
}

Edit

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<RelativeLayout
    android:id="@+id/relative"
    android:layout_width="match_parent"
    android:layout_height="match_parent"></RelativeLayout>
</LinearLayout>

Edit

LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
layoutParams.setMargins(10,10,10,10);
yourBtn.setLayoutParams(layoutParams);

OUTPUT

Answer 2

I think u just need to add layout_margin in your button layout file (but using Linear Layout instead of Relative Layout), example:

<Button
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:id="@+id/eBtn"/>