Проблемы выравнивания с двухстрочной кнопкой

Question

Я пытаюсь выяснить, почему двухстрочная кнопка в моем приложении сдвигается на пару пикселей ниже, чем другие кнопки:

Этого не произойдет, если я укоротю текст на третьей кнопке, пока он не уместится на одной строке, что говорит мне, что это как-то связано с разрывом строки. Добавление android:layout_gravity="top" к макету кнопки, похоже, не помогает. Есть идеи, что может быть причиной этого?

Редактировать: Вот XML-файл макета:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_height="wrap_content"
              android:orientation="vertical"
              android:gravity="center_horizontal"
              android:padding="10dip"
              android:layout_width="wrap_content">

  <TextView android:id="@+id/error_text"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dip"
            android:text="Place holder"
            android:layout_width="wrap_content"
            android:textSize="17dip"/>

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:gravity="center_horizontal"
                android:padding="10dip"
                android:layout_width="wrap_content">
    <Button android:id="@+id/ok_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/ok"
            android:textColor="@color/black"
            android:textStyle="bold"/>

    <Button android:id="@+id/cancel_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dip"
            android:text="@string/cancel_login"
            android:textColor="@color/black"
            android:textStyle="bold"
            android:visibility="gone"/>

    <Button android:id="@+id/third_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dip"
            android:textColor="@color/black"
            android:textStyle="bold"
            android:visibility="gone"/>
  </LinearLayout>
</LinearLayout>

Answer 1

Горизонтальная LinearLayout выравнивает базовые линии всех дочерних элементов управления по умолчанию. Таким образом, первая строка текста в вашей многострочной кнопке выровнена по вертикали с одной строкой текста в других кнопках.

Чтобы отключить это поведение, установите android:baselineAligned="false" на LinearLayout.

Answer 2

Посмотрев на ваш макет (на устройстве), я не уверен, почему он демонстрирует такое странное поведение.При отладке макетов мне нравится помещать фоновые цвета в представления, чтобы вы могли более четко видеть пространство, которое они занимают.Если мы удалим все отступы, мы увидим, что кнопки просто не находятся на одной верхней строке.Если мы применим android:gravity="center_vertical" к содержащему LinearLayout, мы увидим, что первые две кнопки расположены по центру, а последняя плотно прилегает к верхнему краю.

Одним из решений этой проблемы является просто переписать внутренний контейнер, используяa RelativeLayout:

<RelativeLayout
            android:layout_height="wrap_content"
            android:padding="10dip"
            android:layout_width="wrap_content">

<Button android:id="@+id/ok_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/ok"
        android:textColor="@color/black"
        android:textStyle="bold"/>

<Button android:id="@+id/cancel_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dip"
        android:layout_toRightOf="@id/ok_button"
        android:text="@string/cancel_login"
        android:textColor="@color/black"
        android:textStyle="bold"
        android:visibility="gone"/>

<Button android:id="@+id/third_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dip"
        android:layout_toRightOf="@id/cancel_button"
        android:textColor="@color/black"
        android:textStyle="bold"
        android:visibility="gone"/>
</RelativeLayout>

Из моего тестирования, используя RelativeLayout, вы можете заставить все кнопки сидеть на одном верхнем крае.

Answer 3

Я добавил следующие строки к вашей третьей кнопке в XML и установил ее высоту в "fill_parent":

android:paddingTop="4dp"
android:layout_height="fill_parent"

Для меня 4dp работал нормально, вы можете проверить, нужно ли вам больше или меньше.

Внесите эти изменения, и ваша кнопка будет в порядке, как и ее коллеги: -)

Answer 4

Я запустил ваш код со следующим изменением, и он работал нормально: изменил android: гравитация в горизонтальной линейной компоновке с «center_horizontal» на «center».

Answer 5

запись android: layout_height = "fill_parent" для всех трех кнопок