Sets the size of the button as a percentage
Take a look at the code below
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=". HomeScreen" >
<TableLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="*"
android:layout_alignParentTop="true" >
<TableRow
android:id="@+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</TableRow>
<TableRow
android:id="@+id/tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</TableRow>
<TableRow
android:id="@+id/tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="@+id/button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</TableRow>
<TableRow
android:id="@+id/tableRow4"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="@+id/button10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button11"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</TableRow>
</TableLayout>
</RelativeLayout>
This produces the following output.
But that’s not what I need. I need these 12 buttons to fill the entire screen, keeping equal spacing from each other and being the same size. I don’t need to set a fixed size, such as hight=100, width=100, but should adjust the size according to the device screen size. This means that each button can have 8.3% of the space in the screen (100/12 = 8.3).
I tried setting the height of each button to 0dp
and adding android:layout_weight = 0.083.
But that doesn’t work because no buttons are displayed after that.
What should I do?
Solution
You can’t have the dynamic layout you want in XML…
In the activity/fragment where you load the layout: You must set the tableRow height yourself based on the screen size
To get the screen size, you can use
DisplayMetrics metrics = new DisplayMetrics();
Activity aActivity = (Activity) container.getContext();
aActivity.getWindowManager().getDefaultDisplay().getMetrics(metrics);
screen_Width = metrics.widthPixels;
screen_Height = metrics.heightPixels;
Now you can set each table row width to totalHeight/NoOFRows - padding.
tableRow.setMinimumHeight(calculatedHeight);
Similar calculations can be made for widths so that they fill correctly and remain the same size