Question

我必须在我的一个Android应用程序中实现以下布局：

Layout to build

编辑：

我还需要以类似的方式选择要显示的元素之一：

enter image description here

因此，3个元素中的每一个都必须占据水平空间的1/3，以使选择绘制得足够大。

/编辑

我找不到最有效的方法。

我第一次尝试：

<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

它有效，但它根本没有效率。还有更好的方法吗？

Answer 1

您只需要将RelativeLayout放在首位。

使用android:layout_alignParentLeft="true"进行左侧视图
使用android:layout_centerHorizontal="true"作为中心视图
使用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>

Answer 2

为什么不将relativelayout用作top，然后将三个组放在其linearlayout中。然后对于每个组（linearlayout），您可以将android：layout_alignParent设置为居中，左侧和右侧。

Answer 3

我看到两个选项：

正如 Warpzit 所说，请使用RelativeLayout。这应该很容易做到：只需将中间的一个对齐（android:layout_centerHorizontal="true"），将其他的对齐到左侧和右侧（android:layout_alignParentLeft="true"，右侧相同）。
使用LinearLayout，您可以让三个TextView具有android:layout_width="0px"（是，零像素）和layout_weight="1"。这将使LinearLayout赋予TextView相等的宽度。现在，您只需要在TextView的每个android:gravity中分别对齐左侧，中间和右侧的文本，您可以使用{{1}}执行此操作。

Answer 4

<?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>

实现这种布局的最有效方法是什么

4 个答案: