Question

在我的应用中，我有一个表单，用户可以输入他/她的姓名和地址详细信息。我已经创建了布局文件，如图所示。它看起来还不错，但我希望它看起来更好，而且如果值足够长的话，城市，州，邮政编码和国家/地区的字段中的值会相互重叠。

我一直在努力使布局更好，但现在我需要一些帮助，因为我在Android编程/设计方面没有太多经验。我附上图片以便更好地理解

How it looks without values Explanation of Layouts involved The values being overlapped in city and state

以下是布局的XML文件：

<?xml version="1.0" encoding="utf-8"?>

<ImageView android:id="@id/top_bar_view"
    android:layout_width="match_parent" android:layout_height="70dp"
    android:background="@drawable/top_bar" android:contentDescription="@string/content" />

<TextView android:id="@+id/txt_recipient"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:layout_alignParentTop="true" android:layout_centerHorizontal="true"
    android:layout_marginTop="18dp" android:padding="8dp"
    android:text="@string/text_recipient" android:textColor="#FFFFFF"
    android:textSize="16sp" />

<RelativeLayout android:id="@+id/Rlayout_recipient"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:layout_below="@id/top_bar_view" android:background="@drawable/bg">

    <EditText android:id="@+id/edt_rec_name"
        android:layout_width="match_parent" android:layout_height="wrap_content"
        android:layout_alignParentTop="true" android:layout_centerHorizontal="true"
        android:layout_marginLeft="20dp" android:layout_marginRight="20dp"
        android:layout_marginTop="22dp" android:background="@drawable/border_email"
        android:ems="10" android:hint="@string/name_hint" android:inputType="text"
        android:padding="6dp" android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />

    <EditText android:id="@+id/edt_rec_addr1"
        android:layout_width="match_parent" android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/edt_rec_name"
        android:layout_alignRight="@+id/edt_rec_name" android:layout_below="@+id/edt_rec_name"
        android:layout_marginTop="15dp" android:background="@drawable/border_email"
        android:ems="10" android:hint="@string/addr1_hint" android:inputType="text"
        android:padding="6dp" android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />

    <EditText android:id="@+id/edt_rec_addr2"
        android:layout_width="match_parent" android:layout_height="wrap_content"
        android:layout_above="@+id/addr_layout" android:layout_alignLeft="@+id/edt_rec_addr1"
        android:layout_alignRight="@+id/edt_rec_addr1"
        android:layout_marginBottom="17dp" android:background="@drawable/border_email"
        android:ems="10" android:hint="@string/addr2_hint" android:inputType="text"
        android:padding="6dp" android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />



    <RelativeLayout android:id="@+id/addr_layout"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/edt_rec_addr2"
        android:layout_alignParentBottom="true" android:layout_alignRight="@+id/edt_rec_addr2"
        android:layout_marginBottom="16dp" android:background="@drawable/border_email">

        <EditText android:id="@+id/edt_rec_city"
            android:layout_width="120dp" android:layout_height="wrap_content"
            android:ems="10" android:hint="@string/city_hint" android:inputType="text"
            android:padding="6dp" android:textColor="#FFFFFF"
            android:layout_alignParentLeft="true" android:textColorHint="#FFFFFF" />

        <EditText android:id="@+id/edt_rec_state"
            android:layout_width="125dp" android:layout_height="wrap_content"
            android:layout_toRightOf="@+id/edt_rec_city" android:ems="10"
            android:hint="@string/state_hint" android:inputType="text"
            android:padding="6dp" android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />

        <EditText android:id="@+id/edt_rec_postcode"
            android:layout_width="125dp" android:layout_height="wrap_content"
            android:layout_toRightOf="@+id/edt_rec_state" android:ems="10"
            android:hint="@string/postcode_hint" android:inputType="number"
            android:padding="6dp" android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />


        <EditText android:id="@+id/edt_rec_ctry"
            android:layout_width="125dp" android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true" android:ems="10"
            android:focusable="false" android:hint="@string/country_hint"
            android:inputType="text" android:padding="6dp" android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />


    </RelativeLayout>


</RelativeLayout>

<ImageButton android:id="@id/btn_save"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:layout_alignParentRight="true" android:layout_alignParentTop="true"
    android:layout_marginRight="14dp" android:contentDescription="@string/content"
    android:src="@drawable/icon_save_iphone" />

<ImageButton android:id="@id/btn_cancel"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:layout_alignParentLeft="true" android:layout_alignParentTop="true"
    android:layout_marginLeft="16dp" android:contentDescription="@string/content"
    android:src="@drawable/icon_cancel_iphone" />

<Button android:id="@+id/btn_contacts" style="?android:attr/buttonStyleSmall"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/txt_recipient"
    android:layout_marginRight="23dp" android:layout_toLeftOf="@id/btn_save"
    android:text="@string/addr_book" />
</RelativeLayout>

我刚做了一些更改，但没有让每个Editext中的文本重叠，但我必须在addr_layout中为Editexts指定固定宽度。我不确定这样做是否合适。另外，如何在relativelayout中平均分隔4个edittexts？

Answer 1

用 LinearLayout 替换id android：id =“@ + id / addr_layout”的 RelativeLayout 并设置其方向< strong> LinearLayout 为水平

android:orientation="horizontal"

<强>更新

将以下xml部分替换为原始xml ...

<RelativeLayout
    android:id="@+id/addr_layout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/edt_rec_addr2"
    android:layout_alignParentBottom="true"
    android:layout_alignRight="@+id/edt_rec_addr2"
    android:layout_marginBottom="16dp"
    android:background="@drawable/border_email" >

    <EditText
        android:id="@+id/edt_rec_city"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="@string/city_hint"
        android:inputType="text"
        android:padding="6dp"
        android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />

    <EditText
        android:id="@+id/edt_rec_state"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/edt_rec_city"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="86dp"
        android:ems="10"
        android:hint="@string/state_hint"
        android:inputType="text"
        android:padding="6dp"
        android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />

    <EditText
        android:id="@+id/edt_rec_ctry"
        android:layout_width="150dp"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/edt_rec_state"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:ems="10"
        android:focusable="false"
        android:hint="@string/country_hint"
        android:inputType="text"
        android:padding="6dp"
        android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />

    <EditText
        android:id="@+id/edt_rec_postcode"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/edt_rec_ctry"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="92dp"
        android:ems="10"
        android:hint="@string/postcode_hint"
        android:inputType="number"
        android:padding="6dp"
        android:textColor="#FFFFFF"
        android:textColorHint="#FFFFFF" />
</RelativeLayout>

Answer 2

// try this way
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    android:orientation="vertical" >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:padding="5dp"
            android:background="@drawable/top_bar">

            <ImageButton android:id="@id/btn_cancel"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:contentDescription="@string/content"
                android:src="@drawable/icon_cancel_iphone" />

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:gravity="right|center_vertical"
                android:layout_marginLeft="5dp"
                android:layout_weight="1">
                <TextView android:id="@+id/txt_recipient"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/text_recipient"
                    android:textColor="#FFFFFF"
                    android:textSize="16sp" />

                <Button android:id="@+id/btn_contacts"
                    style="?android:attr/buttonStyleSmall"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="5dp"
                    android:text="@string/addr_book" />
            </LinearLayout>
            <ImageButton android:id="@id/btn_save"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:contentDescription="@string/content"
                android:src="@drawable/icon_save_iphone" />

        </LinearLayout>

        <EditText android:id="@+id/edt_rec_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@drawable/border_email"
            android:ems="10"
            android:hint="@string/name_hint"
            android:inputType="text"
            android:padding="6dp"
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />

        <EditText android:id="@+id/edt_rec_addr1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@drawable/border_email"
            android:ems="10"
            android:hint="@string/addr1_hint"
            android:inputType="text"
            android:padding="6dp"
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />

        <EditText android:id="@+id/edt_rec_addr2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@drawable/border_email"
            android:ems="10"
            android:hint="@string/addr2_hint"
            android:inputType="text"
            android:padding="6dp"
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp">
            <EditText android:id="@+id/edt_rec_city"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="@string/city_hint" android:inputType="text"
                android:padding="6dp"
                android:textColor="#FFFFFF"
                android:textColorHint="#FFFFFF" />

            <EditText android:id="@+id/edt_rec_state"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="@string/state_hint"
                android:inputType="text"
                android:layout_marginRight="5dp"
                android:gravity="center"
                android:padding="6dp"
                android:textColor="#FFFFFF"
                android:textColorHint="#FFFFFF" />


            <EditText android:id="@+id/edt_rec_ctry"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:ems="10"
                android:focusable="false"
                android:layout_marginRight="5dp"
                android:gravity="center"
                android:hint="@string/country_hint"
                android:inputType="text"
                android:padding="6dp"
                android:textColor="#FFFFFF"
                android:textColorHint="#FFFFFF" />

            <EditText android:id="@+id/edt_rec_postcode"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="@string/postcode_hint"
                android:inputType="number"
                android:layout_marginRight="5dp"
                android:gravity="center"
                android:padding="6dp"
                android:textColor="#FFFFFF"
                android:textColorHint="#FFFFFF" />
        </LinearLayout>
    </LinearLayout>
</ScrollView>

Answer 3

而不是lower Relative Layout如果你为每个孩子给予相同的权重，那么你可以为每个Linear Layout(Horizontal)使用android:weight EditText属性，这些孩子将从父版块中占用相同的空间< / p>

代码示例

<LinearLayout 
        android:id="@+id/addr_layout"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/edt_rec_addr2"
        android:layout_alignParentBottom="true"                 
        android:orientation="horizontal"
        android:layout_alignRight="@+id/edt_rec_addr2"
        android:layout_marginBottom="16dp" 
        android:background="@drawable/border_email">

        <EditText android:id="@+id/edt_rec_city"
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content"
            android:weight="1"
            android:ems="10" 
            android:hint="@string/city_hint" 
            android:inputType="text"
            android:padding="6dp" 
            android:textColor="#FFFFFF"
            android:layout_marginLeft="10dp" 
            android:textColorHint="#FFFFFF" />

        <EditText android:id="@+id/edt_rec_state"
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content"
            android:ems="10"
            android:weight="1"
            android:hint="@string/state_hint" 
            android:inputType="text"
            android:padding="6dp" 
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF"
            android:layout_marginLeft="10dp" />

        <EditText android:id="@+id/edt_rec_postcode"
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content"
            android:weight="1" 
            android:ems="10"
            android:hint="@string/postcode_hint" 
            android:inputType="number"
            android:padding="6dp" 
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF"
            android:layout_marginLeft="10dp" />


        <EditText android:id="@+id/edt_rec_ctry"
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:weight="1" 
            android:ems="10"
            android:focusable="false" 
            android:hint="@string/country_hint"
            android:inputType="text" 
            android:padding="6dp" 
            android:textColor="#FFFFFF"
            android:textColorHint="#FFFFFF" />


</LinearLayout>

如何重新布局以使其更好？

3 个答案: