相对布局对齐

时间:2015-07-20 08:54:12

标签: android relativelayout

我使用了相对布局和一些视图。我需要水平对齐视图,但视图在所有屏幕尺寸设备中都不显示相同的内容?

<RelativeLayout
        android:id="@+id/layout_relative"
        android:layout_width="fill_parent"
        android:layout_height="90dp"
        android:layout_marginTop="-5dp"
        android:background="#007DD7">

        <TextView
            android:id="@+id/text1_login"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_gravity="center"
            android:layout_marginLeft="45dp"
            android:layout_marginTop="10dp"
            android:background="@drawable/circle"
            android:backgroundTint="@color/white"
            android:gravity="center"
            android:shadowRadius="10.0"
            android:text="1"
            android:textColor="@android:color/holo_blue_dark"
            android:textSize="18sp" />

        <TextView
            android:id="@+id/text2_login"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/text1_login"
            android:layout_marginTop="5dp"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="45dp"
            android:paddingLeft="3dp"
            android:paddingRight="3dp"
            android:text="Login"
            android:textColor="@color/white"
            android:textSize="20sp" />

        <View
            android:id="@+id/1_line"
            android:layout_centerHorizontal="@+id/text1_login"
            android:layout_width="70dp"
            android:layout_height="2dp"
            android:layout_marginLeft="90dp"
            android:layout_marginTop="30dp"
            android:background="@android:color/white"
            android:backgroundTint="@color/add_contact_selected"/>

        <TextView
            android:id="@+id/text1_delivery"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_gravity="center"
            android:layout_marginLeft="170dp"
            android:layout_marginTop="10dp"
            android:background="@drawable/circle"
            android:shadowRadius="10.0"
            android:text="2"
            android:gravity="center"
            android:textColor="@android:color/holo_blue_dark"
            android:textSize="18sp"
            android:backgroundTint="@color/add_contact_selected"/>
        <TextView
            android:id="@+id/text2_delivery"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/text1_delivery"
            android:layout_marginTop="5dp"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="25dp"
            android:gravity="center_horizontal"
            android:maxLines="2"
            android:paddingLeft="3dp"
            android:paddingRight="3dp"
            android:text="Delivery"
            android:textColor="@color/add_contact_selected"
            android:textSize="20sp" />
        <View
            android:id="@+id/2_line"
            android:layout_centerHorizontal="@+id/text1_delivery"
            android:layout_width="80dp"
            android:layout_height="2dp"
            android:layout_marginLeft="215dp"
            android:layout_marginTop="30dp"
            android:background="@android:color/white"
            android:backgroundTint="@color/add_contact_selected"/>

        <TextView
            android:id="@+id/text1_payment"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_gravity="center"
            android:layout_marginLeft="300dp"
            android:layout_marginTop="10dp"
            android:background="@drawable/circle"
            android:gravity="center"
            android:shadowRadius="10.0"
            android:text="3"
            android:textColor="@android:color/holo_blue_dark"
            android:textSize="18sp"
            android:backgroundTint="@color/add_contact_selected"/>
        <TextView
            android:id="@+id/text2_payment"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/text1_payment"
            android:gravity="center_horizontal"
            android:layout_marginTop="5dp"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="260dp"
            android:maxLines="2"
            android:paddingLeft="3dp"
            android:paddingRight="3dp"
            android:text="Payment"
            android:textColor="@color/add_contact_selected"
            android:textSize="20sp"
            />
    </RelativeLayout>

3 个答案:

答案 0 :(得分:0)

要水平对齐视图,您应使用水平方向的线性布局,并为每个子视图指定权重。

查看我使用您的布局编写的示例 -

<LinearLayout
    android:id="@+id/layout_relative"
    android:layout_width="fill_parent"
    android:layout_height="90dp"
    android:layout_marginTop="-5dp"
    android:orientation="horizontal"
    android:background="#007DD7">

    <TextView
        android:id="@+id/text1_login"
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:layout_marginLeft="45dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/circle"
        android:backgroundTint="@color/white"
        android:gravity="center"
        android:shadowRadius="10.0"
        android:text="1"
        android:layout_weight="1"
        android:textColor="@android:color/holo_blue_dark"
        android:textSize="18sp" />

    <TextView
        android:id="@+id/text2_login"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="45dp"
        android:paddingLeft="3dp"
        android:paddingRight="3dp"
        android:text="Login"
        android:textColor="@color/white"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/text1_delivery"
        android:layout_width="0dp"
        android:layout_height="40dp"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:layout_marginLeft="170dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/circle"
        android:shadowRadius="10.0"
        android:text="2"
        android:gravity="center"
        android:textColor="@android:color/holo_blue_dark"
        android:textSize="18sp"
        android:backgroundTint="@color/add_contact_selected"/>

</LinearLayout>

答案 1 :(得分:0)

您需要将LinearLayoutandroid:orientation="horizontal"一起使用并与android:layout_weight一起使用以对齐您的观看次数。

我已编辑了您的代码:

 <LinearLayout
        android:id="@+id/layout_linear"
        android:layout_width="fill_parent"
        android:layout_height="90dp"
        android:layout_marginTop="-5dp"
        android:background="#007DD7"
        android:orientation="horizontal">

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center">
            <TextView
                android:id="@+id/text1_login"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:layout_gravity="center"
                android:layout_marginTop="10dp"
                android:background="@drawable/circle"
                android:backgroundTint="@color/white"
                android:gravity="center"
                android:shadowRadius="10.0"
                android:text="1"
                android:textColor="@android:color/holo_blue_dark"
                android:textSize="18sp" />

            <TextView
                android:id="@+id/text2_login"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/text1_login"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="10dp"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:text="Login"
                android:textColor="@color/white"
                android:textSize="20sp" />

            <View
                android:id="@+id/1_line"
                android:layout_width="fill_parent"
                android:layout_height="2dp"
                android:background="@android:color/white"
                android:backgroundTint="@color/add_contact_selected"/>
        </LinearLayout>
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center">
            <TextView
                android:id="@+id/text1_delivery"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:layout_gravity="center"
                android:layout_marginTop="10dp"
                android:background="@drawable/circle"
                android:shadowRadius="10.0"
                android:text="2"
                android:gravity="center"
                android:textColor="@android:color/holo_blue_dark"
                android:textSize="18sp"
                android:backgroundTint="@color/add_contact_selected"/>
            <TextView
                android:id="@+id/text2_delivery"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/text1_delivery"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="10dp"
                android:gravity="center_horizontal"
                android:maxLines="2"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:text="Delivery"
                android:textColor="@color/add_contact_selected"
                android:textSize="20sp" />
        </LinearLayout>
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center">
            <TextView
                android:id="@+id/text1_payment"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:layout_gravity="center"
                android:layout_marginTop="10dp"
                android:background="@drawable/circle"
                android:gravity="center"
                android:shadowRadius="10.0"
                android:text="3"
                android:textColor="@android:color/holo_blue_dark"
                android:textSize="18sp"
                android:backgroundTint="@color/add_contact_selected"/>
            <TextView
                android:id="@+id/text2_payment"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/text1_payment"
                android:gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="10dp"
                android:maxLines="2"
                android:paddingLeft="3dp"
                android:paddingRight="3dp"
                android:text="Payment"
                android:textColor="@color/add_contact_selected"
                android:textSize="20sp"
                />
        </LinearLayout>
    </LinearLayout>

更新:添加圆圈之间的水平线:

<RelativeLayout
    android:orientation="vertical"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1">
    <TextView
        android:id="@+id/text1_login"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/circle"
        android:backgroundTint="@color/white"
        android:gravity="center"
        android:shadowRadius="10.0"
        android:text="1"
        android:textColor="@android:color/holo_blue_dark"
        android:textSize="18sp"
        android:layout_centerHorizontal="true" />

    <TextView
        android:id="@+id/text2_login"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/text1_login"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="10dp"
        android:paddingLeft="3dp"
        android:paddingRight="3dp"
        android:text="Login"
        android:textColor="@color/white"
        android:textSize="20sp"
        android:layout_centerHorizontal="true" />

    <View
        android:id="@+id/1_line"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/white"
        android:backgroundTint="@color/add_contact_selected"
        android:layout_marginTop="30dp"
        android:layout_toRightOf="@+id/text1_login" />
</RelativeLayout>
<RelativeLayout
    android:orientation="vertical"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1">
    <View
        android:id="@+id/2_line"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/white"
        android:backgroundTint="@color/add_contact_selected"
        android:layout_marginTop="30dp"
        android:layout_toLeftOf="@+id/text1_delivery" />
    <TextView
        android:id="@+id/text1_delivery"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/circle"
        android:shadowRadius="10.0"
        android:text="2"
        android:textColor="@android:color/holo_blue_dark"
        android:textSize="18sp"
        android:backgroundTint="@color/add_contact_selected"
        android:gravity="center"
        android:layout_centerHorizontal="true" />
    <View
        android:id="@+id/22_line"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/white"
        android:backgroundTint="@color/add_contact_selected"
        android:layout_marginTop="30dp"
        android:layout_toRightOf="@+id/text1_delivery" />
    <TextView
        android:id="@+id/text2_delivery"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/text1_delivery"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="10dp"
        android:gravity="center_horizontal"
        android:maxLines="2"
        android:paddingLeft="3dp"
        android:paddingRight="3dp"
        android:text="Delivery"
        android:textColor="@color/add_contact_selected"
        android:textSize="20sp"
        android:layout_centerHorizontal="true" />
</RelativeLayout>
<RelativeLayout
    android:orientation="vertical"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1">
    <View
        android:id="@+id/3_line"
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/white"
        android:backgroundTint="@color/add_contact_selected"
        android:layout_marginTop="30dp"
        android:layout_toLeftOf="@+id/text1_payment" />
    <TextView
        android:id="@+id/text1_payment"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/circle"
        android:gravity="center"
        android:shadowRadius="10.0"
        android:text="3"
        android:textColor="@android:color/holo_blue_dark"
        android:textSize="18sp"
        android:backgroundTint="@color/add_contact_selected"
        android:layout_centerHorizontal="true" />
    <TextView
        android:id="@+id/text2_payment"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/text1_payment"
        android:gravity="center_horizontal"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="10dp"
        android:maxLines="2"
        android:paddingLeft="3dp"
        android:paddingRight="3dp"
        android:text="Payment"
        android:textColor="@color/add_contact_selected"
        android:textSize="20sp"
        android:layout_centerHorizontal="true" />
</RelativeLayout>

答案 2 :(得分:0)

我看到了所有建议使用LinearLayout的人的答案。有一点你必须非常清楚地知道。通过使用相对或线性,我们可以实现所有的布局设计。

首先,你必须分析哪种设计会很好。实现可能取决于三件事。

1.Easy designing
2.Layout performance
3.How much you know about attributes of layout.

我的建议也仅为您的实现线性,但有时多个内部线性布局会导致性能问题,这也是您应该知道的。

我们如何开发代码并不重要,我们如何优化代码非常重要。