Good day. There are 8 elements (buttons), they need to be placed in tabular order 2 rows of 4 columns. In android:background="@drawable/menu_background" is a picture and under it you need to make sure everything is located. My manipulations led to the code below. Everything seemed to work out, but, unfortunately, when launched on another device with a slightly different screen, it moved the elements. Please tell me what means to use so that what is displayed on different screens remains the same?

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/background" android:orientation="vertical" > <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="0.6" android:gravity="center"> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button" android:layout_centerVertical="true" android:layout_alignParentLeft="true" android:layout_alignParentStart="true" android:layout_gravity="bottom|center" android:background="@drawable/button_menu_africa" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button2" android:layout_alignTop="@+id/button" android:layout_toRightOf="@+id/button" android:layout_toEndOf="@+id/button" android:layout_gravity="bottom|center" android:background="@drawable/button_menu_east" android:layout_marginLeft="17dp" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button3" android:layout_gravity="bottom|center" android:background="@drawable/button_menu_india" android:layout_marginLeft="17dp" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button7" android:layout_gravity="bottom|center" android:background="@drawable/button_menu_japan" android:layout_marginLeft="17dp" /> </LinearLayout> <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="0.4" android:gravity="center"> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button6" android:layout_gravity="top|center" android:background="@drawable/button_menu_canada" android:layout_marginTop="25dp" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button5" android:layout_gravity="top|center" android:background="@drawable/button_menu_usa" android:layout_marginLeft="17dp" android:layout_marginTop="25dp" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button4" android:layout_gravity="top|center" android:background="@drawable/button_menu_samerica" android:layout_marginLeft="17dp" android:layout_marginTop="25dp" /> <Button android:layout_width="110dp" android:layout_height="80dp" android:id="@+id/button8" android:layout_gravity="top|center" android:background="@drawable/button_menu_mexica" android:layout_marginLeft="17dp" android:layout_marginTop="25dp" /> </LinearLayout> </LinearLayout>

UPD

Such code turned out:

 <?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" android:background="@drawable/background" android:orientation="vertical" android:weightSum="1"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="0.5" android:weightSum="4"> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginBottom="0dp" android:layout_marginLeft="50dp" android:layout_marginRight="20dp" android:layout_marginTop="100dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginRight="20dp" android:layout_marginTop="100dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginRight="20dp" android:layout_marginTop="100dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginRight="50dp" android:layout_marginTop="100dp" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="0.5" android:weightSum="4"> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginTop="30dp" android:layout_marginBottom="70dp" android:layout_marginLeft="50dp" android:layout_marginRight="20dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginTop="30dp" android:layout_marginBottom="70dp" android:layout_marginRight="20dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginTop="30dp" android:layout_marginBottom="70dp" android:layout_marginRight="20dp" /> <Button android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="1" android:background="@drawable/button_menu_africa" android:layout_marginTop="30dp" android:layout_marginBottom="70dp" android:layout_marginRight="50dp" /> </LinearLayout> </LinearLayout>

But on different devices, again, everything is shifting ...

240x400

enter image description here

1080x1920

enter image description here

2560x1600

enter image description here

  • will you show the backgroun? - Nikotin N

1 answer 1

Well, in general, if you need to place 2 rows with 4 buttons so that they are the same width, then I would do so (I specified the height for example):

 <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:weightSum="4"> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" android:weightSum="4"> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> <Button android:layout_width="0dp" android:layout_height="match_parent" android:layout_weight="1" /> </LinearLayout>

It turns out like this:

Image Description

  • Hello. It seems to be like this, but you should throw it on the tablet and it all ran away = (Here is the link to the background.png and the picture to the button. The other buttons are the same, so for simplicity you can do one for all. - Pollux
  • @Pollux, well, if I do, as I suggested, then nothing will leave, because my button sizes will vary depending on the screen. The main thing is to choose the right padding on the sides. And if you consider your layout, then you have all the dimensions in static values, so everything leaves. - Nikotin N
  • Could you please give the code to these pictures? The width seems to have turned out nothing, but now it is running away in height ... I get confused while in the complex marking. - Pollux
  • @Pollux, fixed the answer - Nikotin N
  • Updated first post UPD - Pollux