Android responsive layout

android, android-layout, android-resolution, android-tablelayout

Solution

Over and all, you need to create different layouts/drawable for supporting all the screens. It depends on your requirement, say for example, if you would want to include 2 buttons in small screen and 4 buttons on large screens then obvious you have to create different layouts.

If you would want to display same number of buttons in all screens then I would suggest you to prepare different set of images/drawables and include them in your project. here you don't need to do anything other than placing images in particular drawable folders.

One more thing, If its a plain background then you can create 9-patch image so that it can stretch with whatever size you want or your device supports.

More study:

- https://developer.android.com/guide/practices/screens_support.html

- Supporting Different Screen Sizes

- Supporting Different Densities

- Implementing Adaptative UI Flows

Problem

I am building application (calculator). I use table layout with buttons inside. It looks perfect on screen of Samsung Galaxy II, however it looks very bad on bigger screens. The buttons hight is very small. How I can stretch the buttons on bigger screens? The layout XML is bellow: ``` <ScrollView xmlns:android="http://schemas.an xmlns:tools="http://schemas.android.com/ android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="right" android:paddingBottom="@dimen/activity_v android:paddingLeft="@dimen/activity_hor android:paddingRight="@dimen/activity_ho android:paddingTop="@dimen/activity_vert tools:context=".MainActivity" > <TableLayout android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="right" > <TableRow android:id="@+id/tableRow1" android:layout_width="match_parent" android:layout_height="0dp"> <Button android:id="@+id/Button01" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_1" android:visibility="visible" /> <Button android:id="@+id/Button02" android:layout_width="0dp" android:layout_weight="0.34" android:layout_height="fill_pare android:text="@string/button_2" <Button android:id="@+id/Button03" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_3" </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="match_parent" android:layout_height="0dp" > <Button android:id="@+id/Button04" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_parent" android:text="@string/button_4" /> <Button android:id="@+id/Button05" android:layout_width="0dp" android:layout_weight="0.34" android:layout_height="fill_parent" android:text="@string/button_5" /> <Button android:id="@+id/Button06" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_parent" android:text="@string/button_6" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="match_parent" android:layout_height="0dp" > <Button android:id="@+id/Button07" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_7" <Button android:id="@+id/Button08" android:layout_width="0dp" android:layout_weight="0.34" android:layout_height="fill_pare android:text="@string/button_8" <Button android:id="@+id/Button09" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_9" </TableRow> <TableRow android:id="@+id/tableRow4" android:layout_width="match_parent" android:layout_height="0dp" > <Button android:id="@+id/ButtonUndo" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_und <Button android:id="@+id/Button00" android:layout_width="0dp" android:layout_weight="0.34" android:layout_height="fill_pare android:text="@string/button_0" <Button android:id="@+id/ButtonCheck" android:layout_width="0dp" android:layout_weight="0.33" android:layout_height="fill_pare android:text="@string/button_che </TableRow> <TableRow android:id="@+id/ResTable" android:layout_width="match_parent" android:layout_height="0dp" > <TableLayout android:layout_weight="0.3" android:id="@+id/table_score_cor <TableRow android:id="@+id/tableRow5_11" android:layout_width="wrap_conte android:layout_height="fill_pare android:gravity="center_vertical <TextView android:id="@+id/labelCorrec android:layout_width="wrap_c android:layout_height="fill_ android:ems="4" android:text="@string/correc android:gravity="center_vertic android:textSize="15sp" /> </TableRow> <TableRow android:id="@+id/tableRow5_12" android:layout_width="wrap_conte android:layout_height="0dp" > <TextView android:id="@+id/scoreCorr android:layout_width="0dp" android:layout_height="fil android:ems="4" android:gravity="center_ve android:text="" android:textSize="30sp" android:textStyle="bold" / </TableRow> </TableLayout> <ImageView android:id="@+id/imageView1" android:layout_width="wrap_content android:layout_height="fill_parent android:layout_weight="0.3" android:contentDescription="@strin android:fitsSystemWindows="true" android:scaleType="fitCenter" android:src="@drawable/trees" /> <TableLayout android:id="@+id/table_score_inc android:layout_weight="0.3"> <TableRow android:id="@+id/tableRow5_21" android:layout_width="wrap_conte android:layout_height="fill_pare android:gravity="center_vertical <TextView android:id="@+id/labelIncorrec android:layout_width="wrap_con android:layout_height="fill_pa android:ems="4" android:text="@string/incorrec android:gravity="center_vertic android:textSize="15sp" /> </TableRow> <TableRow android:id="@+id/tableRow5_22" android:layout_width="wrap_conte android:layout_height="fill_pare <TextView android:id="@+id/scoreInco android:layout_width="0dp" android:layout_height="fil android:ems="4" android:gravity="center_ve android:text="" android:textSize="30sp" android:textStyle="bold" / </TableRow> </TableLayout> </TableRow> <TableRow android:id="@+id/tableRow_menu" android:layout_width="wrap_content android:layout_height="fill_parent <Button android:id="@+id/ButtonPlus" android:layout_width="0dp" android:layout_height="38dp" android:layout_weight="0.25" android:text="@string/action_p <Button android:id="@+id/ButtonMinus" android:layout_width="0dp" android:layout_height="38dp" android:layout_weight="0.25" android:text="@string/action_m <Button android:id="@+id/ButtonMult" android:layout_width="0dp" android:layout_height="38dp" android:layout_weight="0.25" android:text="@string/action_m <Button android:id="@+id/ButtonDivide" android:layout_width="0dp" android:layout_height="38dp" android:layout_weight="0.25" android:text="@string/action_d </TableRow> </TableLayout> </ScrollView> ```

Original source