Android tablelayout and button resizing

here you are my problem: I want to make a layout similar to this grid in android:

enter image description here

To do this, I created this layout:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/RelativeLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <TableLayout android:id="@+id/tableLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3"> <Button android:id="@+id/clientimain" android:layout_width="0dip" android:layout_weight="1" android:layout_height="fill_parent"/> <Button android:id="@+id/button1" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3" > <Button android:id="@+id/button2" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button"/> <Button android:id="@+id/button6" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3" > <Button android:id="@+id/button3" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> <Button android:id="@+id/button7" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> </TableLayout> </RelativeLayout> 

Thus, it basically consists of 6 buttons in a table layout with the correct weight setting (or I hope so!). The result looks good until I try to set the background property for each button. In this case, the button accepts the height of the image that is placed (width in order). For example, if I set a background image that is 96px x 96px in size, the result will look like this:

enter image description here

Is there a way to prevent this “stretching” and proper centering of the image? I tried to change the height property for each row of the table to change the maximum button height property, as well as change the button type using the image button (and set the src property with the desired icon), but I did not achieve the desired result.
I also published Google documentation on supporting multiple screens and each basic layout, but I did not find any solution. Thanks in advance to everyone who would like to help me!

Andrea

+6
source share
4 answers

Set the height of the table row as 0dip and set the weight as 1

 <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > 

This should solve your problem.


Change

 <Button android:id="@+id/clientimain" android:layout_width="0dip" android:layout_weight="1" android:layout_height="fill_parent"/> 

to

 <Button android:id="@+id/clientimain" android:layout_width="0dip" android:layout_weight="1" android:layout_height="fill_parent"/> 

it might work, it’s worth a try, in eclipse it’s right for me, as you had it in the first place, maybe you could try to clean your project (Project> clean project), because it should be right, because it


The code should look like this:

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/RelativeLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <TableLayout android:id="@+id/tableLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <Button android:id="@+id/clientimain" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" /> <Button android:id="@+id/button1" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <Button android:id="@+id/button2" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> <Button android:id="@+id/button6" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <Button android:id="@+id/button3" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> <Button android:id="@+id/button7" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" /> </TableRow> </TableLayout> </RelativeLayout> 

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/RelativeLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <TableLayout android:id="@+id/tableLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <ImageButton android:id="@+id/imageButton1" android:layout_width="0dp" android:layout_height="fill_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> <ImageButton android:id="@+id/imageButton2" android:layout_width="0dp" android:layout_height="fill_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <ImageButton android:id="@+id/imageButton3" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> <ImageButton android:id="@+id/imageButton4" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" > <ImageButton android:id="@+id/imageButton5" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> <ImageButton android:id="@+id/imageButton6" android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" android:src="@drawable/ic_launcher" /> </TableRow> </TableLayout> </RelativeLayout> 

still nothing changes, how big is the image size?

+3
source

I know this is not exactly what you wanted, but I recommend using a GridView instead of a TableRow layout.

I think that GridView should work better, because it is implemented using a viewer utility and material inherited from AbsListView. GridView is harder to deploy because you have to use it with an adapter, but it will work efficiently if you have a lot of uploaded images, such as images. Link.

 <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridView1" android:numColumns="auto_fit" android:stretchMode="columnWidth" android:columnWidth="100dp" android:layout_width="fill_parent" android:layout_height="fill_parent" > </GridView> 
+1
source

When I applied the background image as

 android:background="@drawable/ic_launcher" 

It worked fine.

I thought this was due to the image size, so I applied another 160X160 image and the problem returned. Then I applied the same 160X160 image to all the buttons, and they matched perfectly. here is my code (Image Gender.png has 160X160 pixels)

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/RelativeLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center" android:orientation="vertical" > <TableLayout android:id="@+id/tableLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TableRow android:id="@+id/tableRow1" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_weight="0.3"> <Button android:id="@+id/clientimain" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:background="@drawable/Gender" /> <Button android:id="@+id/button1" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender"/> </TableRow> <TableRow android:id="@+id/tableRow2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3" > <Button android:id="@+id/button2" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender"/> <Button android:id="@+id/button6" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender"/> </TableRow> <TableRow android:id="@+id/tableRow3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3" > <Button android:id="@+id/button3" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender" /> <Button android:id="@+id/button7" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender"/> </TableRow> <TableRow android:id="@+id/tableRow4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0.3" > <Button android:id="@+id/button77" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender" /> <Button android:id="@+id/button75" android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="1" android:text="Button" android:background="@drawable/Gender" /> </TableRow> </TableLayout> 

0
source

Source: https://habr.com/ru/post/908108/


All Articles