Подтвердить что ты не робот

Как центрировать кнопки на экране по горизонтали и вертикали плюс равноотстоящие друг от друга?

Я терзаю свой мозг (новичок в 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

Приветствуется любая помощь/руководство.

4b9b3361

ОТВЕТЫ

Ответ 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>