Какой самый эффективный способ добиться такой раскладки - PullRequest
0 голосов
/ 09 ноября 2011

Мне нужно добиться следующего макета в одном из моих приложений для Android:

Layout to build

Edit:

Мне также нужно, чтобы выбор одного из элементов отображался аналогично следующему:

enter image description here

Таким образом, каждый из 3 элементов должен занимать 1/3 от горизонтального пространства, чтобы выделение было достаточно большим.

/ Edit

Я не могу найти самый эффективный способ сделать это.

Я впервые попробовал:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/forums_navbar"
    android:layout_width="fill_parent" android:layout_height="@dimen/forums_navbar_height"
    android:background="@color/white">
    <TextView android:id="@+id/forums_navbar_TextView_debut"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="@string/forums_nav_debut"
        android:textStyle="bold"
        android:textColor="@color/forum_nav_blue"
        android:textSize="15sp"
        android:drawablePadding="4dip"
        android:drawableLeft="@drawable/nav_fast_backward">
    </TextView>
    <TextView android:id="@+id/forums_navbar_TextView_precedent"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="@string/forums_nav_precedent"
        android:textStyle="bold"
        android:textColor="@color/forum_nav_blue"
        android:textSize="15sp"
        android:drawablePadding="4dip"
        android:drawableLeft="@drawable/nav_backward">
    </TextView>
    <TextView android:id="@+id/forums_navbar_TextView_suivant"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="@string/forums_nav_suivant"
        android:textStyle="bold"
        android:textColor="@color/forum_nav_blue"
        android:textSize="15sp"
        android:drawablePadding="4dip"
        android:drawableRight="@drawable/nav_fast_forward">
    </TextView>
</LinearLayout>

Результат не совсем такой, как ожидалось:

Bad one

Я изменил макет, чтобы он работал:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/forums_navbar"
    android:layout_width="fill_parent" android:layout_height="@dimen/forums_topics_navbar_height"
    android:background="@color/white">
    <RelativeLayout 
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1">
        <TextView android:id="@+id/forums_navbar_TextView_debut"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@string/forums_nav_debut"
            android:textStyle="bold"
            android:textColor="@color/forum_nav_blue"
            android:textSize="15sp"
            android:drawablePadding="4dip"
            android:drawableLeft="@drawable/nav_fast_backward">
        </TextView>
    </RelativeLayout>
    <RelativeLayout 
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1">
        <TextView android:id="@+id/forums_navbar_TextView_precedent"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@string/forums_nav_precedent"
            android:textStyle="bold"
            android:textColor="@color/forum_nav_blue"
            android:textSize="15sp"
            android:drawablePadding="4dip"
            android:drawableLeft="@drawable/nav_backward">
        </TextView>
    </RelativeLayout>
    <RelativeLayout 
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1">
        <TextView android:id="@+id/forums_navbar_TextView_suivant"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@string/forums_nav_suivant"
            android:textStyle="bold"
            android:textColor="@color/forum_nav_blue"
            android:textSize="15sp"
            android:drawablePadding="4dip"
            android:drawableRight="@drawable/nav_fast_forward">
        </TextView>
    </RelativeLayout>
</LinearLayout>

Результат:

good

Это работает, но просто неэффективно. Есть ли лучший способ?

Ответы [ 4 ]

4 голосов
/ 09 ноября 2011

Вам просто нужно иметь RelativeLayout вверху.

  1. использовать android:layout_alignParentLeft="true" для вида слева
  2. использовать android:layout_centerHorizontal="true" для вида центра
  3. используйте android:layout_alignParentRight="true" для правого обзора

Выход:

enter image description here

Вы можете получить вывод выше, используя приведенное ниже решение:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Left"
        android:layout_alignParentLeft="true">   // For view at Left side
    </TextView>

     <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Center"
        android:layout_centerHorizontal="true">  // For view at center
    </TextView>


    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Right"
        android:layout_alignParentRight="true">  // for view at Right side
    </TextView>

</RelativeLayout>
1 голос
/ 09 ноября 2011

Почему бы не использовать относительное расположение как верхнее, а затем поместить три группы в каждую их линейное расположение. Затем для каждой группы (linearlayout) вы можете установить android: layout_alignParent в центр, влево и вправо.

0 голосов
/ 09 ноября 2011
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" 
    android:background="#FFFFFF"
    android:weightSum="1">

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="match_parent"
        android:layout_height="20dp" 
        android:background="#FF0000"
        android:layout_weight="0.33">
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="match_parent"
        android:layout_height="20dp" 
        android:background="#00FF00"
        android:layout_weight="0.34">

    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout3"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:background="#0000FF"
        android:layout_weight="0.33">

    </LinearLayout>
</LinearLayout>
0 голосов
/ 09 ноября 2011

вижу два варианта:

  1. Как сказал Warpzit , используйте RelativeLayout. Это должно легко сработать: просто выровняйте среднюю по середине (android:layout_centerHorizontal="true"), а остальные по левой и правой (android:layout_alignParentLeft="true", то же самое по правой).
  2. С LinearLayout вы можете иметь три TextView с android:layout_width="0px" (да, ноль пикселей) и layout_weight="1". Это заставит LinearLayout дать TextView s равную ширину. Теперь вам просто нужно выровнять текст влево, по центру и справа соответственно в каждом из TextView s, что вы можете сделать, используя android:gravity.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...