Как центрировать кнопки на экране по горизонтали и вертикали плюс равноотстоящие друг от друга?
Я терзаю свой мозг (новичок в Android-игре, так что не трудно сделать), чтобы попытаться выяснить, как это сделать:
![enter image description here]()
с помощью RelativeLayout или чего-то другого, кроме AbsoluteLayout, с которым это было создано. Я исхожу из фона программирования Windows, где устройство настраивает "абсолютное" позиционирование для вас, а макет графического интерфейса - это не проблема.
Первый макет отлично работает в эмуляторе, но не форматирует мой Nexus One или любой другой экран, который отличается от размера эмулятора. Я ожидал этого, потому что он абсолютно позиционирован, но не нашел решение, которое будет правильно отформатировать для разных размеров экрана. Моя цель состоит в том, чтобы работать с макетом для разных размеров экрана и в портретной/альбомной ориентации.
Вот код, который я использую в настоящее время: [main.xml]
<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<Button
android:id="@+id/Button01"
android:layout_width="188px"
android:layout_height="100px"
android:text="A"
android:layout_y="50px" android:layout_x="65px" android:textSize="48sp"/>
<Button
android:id="@+id/Button02"
android:layout_width="188px"
android:layout_height="100px"
android:text="B"
android:layout_y="175px" android:layout_x="65px" android:textSize="48sp"/>
<Button
android:id="@+id/Button03"
android:layout_width="188px"
android:layout_height="100px"
android:text="C"
android:layout_y="300px" android:layout_x="65px" android:textSize="48sp"/>
</AbsoluteLayout>
Используя лакомые кусочки от других вопросов здесь, я придумал это, его ближе, но пока нет.
<?xml version="1.0" encoding="utf-8"?>
<TableLayout
android:gravity="center"
android:id="@+id/widget49"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<Button
android:id="@+id/Button01"
android:layout_width="0dip"
android:layout_weight="1"
android:text="A"
android:textSize="48sp"/>
<Button
android:id="@+id/Button02"
android:layout_width="0dip"
android:layout_weight="1"
android:text="B"
android:textSize="48sp"/>
<Button
android:id="@+id/Button03"
android:layout_width="0dip"
android:layout_weight="1"
android:text="C"
android:textSize="48sp"/>
</TableLayout>
Вот изображение TableLayout:
![enter image description here]()
Приветствуется любая помощь/руководство.
Ответы
Ответ 1
Используя рекомендации от вас обоих, вы отлично работали!
Для тех, кого интересует, вот окончательный код main.xml в формате RelativeLayout, который соответствовал тому, что я пытался сделать с AbsoluteLayout..
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<Button
android:id="@+id/Button02"
android:layout_width="188dip"
android:layout_height="100dip"
android:text="B"
android:layout_centerInParent="true"
android:textSize="48sp" android:textStyle="bold" />
<Button
android:id="@+id/Button01"
android:layout_width="188dip"
android:layout_height="100dip"
android:text="A"
android:layout_centerHorizontal="true"
android:layout_above="@id/Button02"
android:layout_marginBottom="30dip"
android:textSize="48sp" android:textStyle="bold" />
<Button
android:id="@+id/Button03"
android:layout_width="188dip"
android:layout_height="100dip"
android:text="C"
android:layout_centerHorizontal="true"
android:layout_below="@id/Button02"
android:layout_marginTop="30dip"
android:textSize="48sp" android:textStyle="bold" />
</RelativeLayout>
Кроме того, интересно, что может помочь кому-то в будущем. Когда я изменил первый код, который я опубликовал с этими рекомендациями, я получил эту ошибку при попытке скомпилировать: "\res\layout\main.xml: 9: ошибка: ошибка: ресурс не найден, который соответствует указанному имени (в ' layout_above 'со значением' @id/Button02 ').
С небольшим Googling на том, что может быть причиной, я обнаружил, что, поскольку ссылка на Button02 (через код Button01) произошла до того, как Button02 был фактически создан, это породило ошибку. Итак, обратите внимание на окончательный код Button02 объявлен FIRST.
Ответ 2
Используйте RelativeLayout
. Кнопка B имеет android:layout_centerInParent="true"
. Кнопка A имеет android:layout_centerHorizontal="true"
, android:layout_above="@id/Button02"
и некоторые android:layout_marginBottom
, чтобы установить любой пробел пробела, который вы хотите. Кнопка C имеет android:layout_centerHorizontal="true"
, android:layout_below="@id/Button02"
и некоторые android:layout_marginTop
, чтобы установить любой пробел пробела, который вы хотите.
Не используйте AbsoluteLayout
, период.
Ответ 3
Вот хороший пример использования TableLayout. Он имеет три таблицы, каждая из которых имеет layout_weight = 1, которая гарантирует, что каждая строка занимает 1/3 экрана. Средняя строка будет содержать ваши кнопки, а первая и последняя строки таблицы пусты.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<TableRow android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"/>
<TableRow android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 1"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 3"/>
</LinearLayout>
</TableRow>
<TableRow android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"/>
</TableLayout>
Изменить...
И это еще один способ, который позволяет ширине кнопки соответствовать родительскому.
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<TableRow android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 1"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 2"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:padding="24dp"
android:text="Button 3"/>
<TableRow android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp"/>
</TableLayout>