Использование RelativeLayout вместо вложенных весов

Question

Я работаю над простым звуковым устройством. Основной дизайн - это изображение для названия, за которым следуют 4 ряда кнопок (по 3 в каждой строке), что делает его похожим на старые кнопки мобильного телефона. Внизу есть кнопка «random» и «stop». Они занимают немного меньше пространства по высоте, чем строки, упомянутые выше, но случайная кнопка была двойной ширины, чтобы заполнить пространство.

Чтобы добиться этого, я использовал вложенные веса и линейные макеты. Однако после дальнейших исследований я обнаружил, что это плохо для производительности, потому что в моем текущем формате каждый элемент измеряется 8 раз. Ниже приведен мой код макета XML. Я исключил множество модификаций интерфейса, таких как поля, текст и тени на кнопках, чтобы уменьшить код. Код может показаться длинным, но он повторяется и прост для понимания.

<?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:orientation="vertical" 
    android:weightSum="23" > 

<!-- Insert Title/Picture in Linear Layout below --> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="9" 
    android:background="@drawable/etho_logo" 
    android:orientation="horizontal" > 
</LinearLayout> 

<!-- Insert Sounds/Buttons in Linear Layout below --> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="5" 
    android:orientation="vertical" 
    android:weightSum="4" > 

    <!-- This is the 1st line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 
    </LinearLayout> 

    <!-- This is the 2nd line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 
    </LinearLayout> 

    <!-- This is the 3rd line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 
    </LinearLayout> 

    <!-- This is the 4th line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 
    </LinearLayout> 
</LinearLayout> 

<!-- Random Button and Stop button below here --> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="9" 
    android:orientation="horizontal" 
    android:weightSum="3" > 

    <Button 
     android:id="@+id/bIntro" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:background="@drawable/hello_real_select" /> 

    <Button 
     android:id="@+id/bIntro" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:background="@drawable/hello_real_select" /> 
</LinearLayout> 

</LinearLayout> 

Я новичок в Android, так что даже если я попытался с помощью Relative макет, у меня было чрезвычайно трудно работать с ним. Я пробовал смотреть учебники онлайн, но все же он никогда не выглядел правильным, когда я использовал его в своем коде. Например, у моего заголовочного изображения есть дополнительное пространство выше и ниже фактического текста, который я хочу отобразить. В Linear Layout с весами он автоматически станет меньше, чтобы соответствовать пространству, которое я ему дал. Однако не в RelativeLayout.

Я предполагаю, что я пытаюсь спросить здесь: как это сделать, поэтому мои элементы RelativeLayout являются равномерно распределенными кнопками на нескольких строках (как показано в примере выше) и как я могу сделать это так, чтобы ImageViews и другие вещи фактически автоматически доходят до места, которое я им даю? Если вам нужна дополнительная информация, пожалуйста, не стесняйтесь спрашивать. Благодарю.

Answer 1

Вы правы, что RelativeLayout трудно сделать в таблицах, таких как тот, который вы сделали выше. LinearLayout действительно идеально подходит для этого, поэтому группы просмотра TableLayout и TableRow являются подклассами LinearLayout. Однако я могу порекомендовать пару альтернатив, кроме RelativeLayout, что увеличит эффективность компоновки.

Во-первых, вы можете устранить второй вертикально ориентированный LinearLayout и изменить вес макета первых 4 рядов кнопок от 1 до 1,25. Это уменьшит количество макетов от 8 до 4, что лучше всего подходит для таблицы.

<?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:orientation="vertical" 
    android:weightSum="23" > 

    <!-- Insert Title/Picture in Linear Layout below --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="9" 
     android:background="@drawable/etho_logo" 
     android:orientation="horizontal" > 
    </LinearLayout> 

    <!-- This is the 1st line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1.25" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <!-- 3 buttons here --> 

    </LinearLayout> 

    <!-- This is the 2nd line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1.25" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <!-- 3 buttons here --> 

    </LinearLayout> 

    <!-- This is the 3rd line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1.25" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <!-- 3 buttons here --> 

    </LinearLayout> 

    <!-- This is the 4th line of buttons --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1.25" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <!-- 3 buttons here --> 

    </LinearLayout> 

    <!-- Random Button and Stop button below here --> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="9" 
     android:orientation="horizontal" 
     android:weightSum="3" > 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 

     <Button 
      android:id="@+id/bIntro" 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@drawable/hello_real_select" /> 
    </LinearLayout> 

</LinearLayout> 

Другой вариант заключается в использовании одного макета, что делает «плоский» сетку (а ViewGroup, которая управляет расположение своих детей в таблицу сама по себе). Если вы ориентируетесь на уровень API 14+ для своего приложения, вы можете посмотреть GridLayout. Если вы ориентируетесь на уровень API до 14, возможно, вам придется сделать свой собственный. В заключительной заметке, пожалуйста, не путайте GridLayout с группой просмотра GridView, которая предназначена для использования со списками и не будет выполнять то, что вы хотите.

Answer 2

Рекомендуется использовать ширину 0dp с весом, который должен сократить вдвое число измерений (как wrap_content требуют измерений, но 0dp не делает)

Кроме того, вам не нужно по мере того, как он уже находится в линейной компоновке (хотя он является более чистым для удобочитаемости, вы можете удалить его для оптимизации и регулировки веса)