我工作的一种形式布局的登录活动在我的Andr​​oid应用程序。下面的图片是我希望它看起来像：

我能够实现这个布局有以下 XML 。问题是，这是一个有点hackish。我只好硬code主机的EditText的宽度。具体而言，我必须指定：

 机器人：layout_width =172dp
 

我真的想给一个百分比宽度的主机和端口的EditText的。 （喜欢的东西80％为主机，20％的端口）。这可能吗？下面的XML工作在我的Droid的，但它似乎并不适用于所有的屏幕。我真的想一个更强大的解决方案。

 ＆LT; RelativeLayout的的xmlns：机器人=htt​​p://schemas.android.com/apk/res/android
    机器人：ID =@ + ID /主
    机器人：layout_width =FILL_PARENT
    机器人：layout_height =FILL_PARENT＆GT;

    ＆LT;的TextView
        机器人：ID =@ + ID / host_label
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ + ID /家
        机器人：以下属性来=15dp
        机器人：paddingTop =0dp
        机器人：文本=主机
        机器人：文字颜色=＃a5d4e2
        机器人：TEXTSIZE =25sp
        机器人：TEXTSTYLE =正常/＆GT;

    ＆LT;的TextView
        机器人：ID =@ + ID / port_label
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ + ID /家
        机器人：layout_toRightOf =@ + ID / host_input
        机器人：paddingTop =0dp
        机器人：文本=端口
        机器人：文字颜色=＃a5d4e2
        机器人：TEXTSIZE =25sp
        机器人：TEXTSTYLE =正常/＆GT;

    ＆LT;的EditText
        机器人：ID =@ + ID / host_input
        机器人：layout_width =172dp
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ ID / host_label
        机器人：layout_marginLeft =15dp
        机器人：layout_marginRight =15dp
        机器人：layout_marginTop =4DP
        机器人：背景=@机器人：可绘制/ editbox_background
        机器人：inputType =textEmailAddress/＆GT;

    ＆LT;的EditText
        机器人：ID =@ + ID / port_input
        机器人：layout_width =100dp
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ ID / host_label
        机器人：layout_marginTop =4DP
        机器人：layout_toRightOf =@ ID / host_input
        机器人：背景=@机器人：可绘制/ editbox_background
        机器人：inputType =号/＆GT;

    ＆LT;的TextView
        机器人：ID =@ + ID / username_label
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ + ID / host_input
        机器人：以下属性来=15dp
        机器人：paddingTop =15dp
        机器人：文本=用户名
        机器人：文字颜色=＃a5d4e2
        机器人：TEXTSIZE =25sp
        机器人：TEXTSTYLE =正常/＆GT;

    ＆LT;的EditText
        机器人：ID =@ + ID / username_input
        机器人：layout_width =FILL_PARENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ ID / username_label
        机器人：layout_marginLeft =15dp
        机器人：layout_marginRight =15dp
        机器人：layout_marginTop =4DP
        机器人：背景=@机器人：可绘制/ editbox_background
        机器人：inputType =textEmailAddress/＆GT;

    ＆LT;的TextView
        机器人：ID =@ + ID / password_label
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ + ID / username_input
        机器人：以下属性来=15dp
        机器人：paddingTop =15dp
        机器人：文本=密码
        机器人：文字颜色=＃a5d4e2
        机器人：TEXTSIZE =25sp
        机器人：TEXTSTYLE =正常/＆GT;

    ＆LT;的EditText
        机器人：ID =@ + ID / password_input
        机器人：layout_width =FILL_PARENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ ID / password_label
        机器人：layout_marginLeft =15dp
        机器人：layout_marginRight =15dp
        机器人：layout_marginTop =4DP
        机器人：背景=@机器人：可绘制/ editbox_background
        机器人：inputType =textPassword/＆GT;

    ＆LT; ImageView的
        机器人：ID =@ + ID /家
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_alignParentTop =真
        机器人：layout_centerHorizo​​ntal =真
        机器人：layout_centerVertical =假
        机器人：以下属性来=15dp
        机器人：paddingRight =15dp
        机器人：paddingTop =15dp
        机器人：scaleType =fitStart
        机器人：SRC =@可绘制/家/＆GT;

    ＆LT;按钮
        机器人：ID =@ + ID / login_button
        机器人：layout_width =WRAP_CONTENT
        机器人：layout_height =WRAP_CONTENT
        机器人：layout_below =@ + ID / password_input
        机器人：layout_marginLeft =15dp
        机器人：layout_marginTop =15dp
        机器人：文本=登陆
        机器人：TEXTSIZE =18sp＆GT;
    ＆LT; /按钮＆GT;

＆LT; / RelativeLayout的＆GT;
 

解决方案

您正在寻找的android：layout_weight 属性。它可以让你用百分比来定义你的布局。

在下面的例子中，左按钮使用的空间的70％，和右按钮30％

 ＆LT;的LinearLayout
    机器人：layout_width =match_parent
    机器人：layout_height =WRAP_CONTENT＆GT;

    ＆LT;按钮
        机器人：文本=左
        机器人：layout_width =0dp
        机器人：layout_height =WRAP_CONTENT
        70：机器人layout_weight = /＆GT;

    ＆LT;按钮
        机器人：文本=右
        机器人：layout_width =0dp
        机器人：layout_height =WRAP_CONTENT
        30：机器人layout_weight = /＆GT;

＆LT; / LinearLayout中＆GT;
 

它的工作原理相同的任何一种观点，你可以用一些替代的EditText的按钮，以满足您的需求。

请务必将 layout_width 到 0dp 或你的看法可能无法正确​​缩放。

请注意，权重之和不必等于1，我只是觉得它更容易阅读这样。可以设置第一权重到7和第二至3，它会产生相同的结果。

I am working on a form layout for a Login Activity in my Android App. The image below is how I want it to look like:

I was able to achieve this layout with the following XML. The problem is, it's a bit hackish. I had to hard-code a width for the host EditText. Specifically, I had to specify:

android:layout_width="172dp" 

I'd really like to give a percentage width to the host and port EditText's . (Something like 80% for the host, 20% for the port.) Is this possible? The following XML works on my Droid, but it doesn't seem to work for all screens. I would really like a more robust solution.

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

    <TextView
        android:id="@+id/host_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/home"
        android:paddingLeft="15dp"
        android:paddingTop="0dp"
        android:text="host"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <TextView
        android:id="@+id/port_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/home"
        android:layout_toRightOf="@+id/host_input"
        android:paddingTop="0dp"
        android:text="port"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/host_input"
        android:layout_width="172dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/host_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textEmailAddress" />

    <EditText
        android:id="@+id/port_input"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/host_label"
        android:layout_marginTop="4dp"
        android:layout_toRightOf="@id/host_input"
        android:background="@android:drawable/editbox_background"
        android:inputType="number" />

    <TextView
        android:id="@+id/username_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/host_input"
        android:paddingLeft="15dp"
        android:paddingTop="15dp"
        android:text="username"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/username_input"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/username_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textEmailAddress" />

    <TextView
        android:id="@+id/password_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/username_input"
        android:paddingLeft="15dp"
        android:paddingTop="15dp"
        android:text="password"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/password_input"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/password_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textPassword" />

    <ImageView
        android:id="@+id/home"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="false"
        android:paddingLeft="15dp"
        android:paddingRight="15dp"
        android:paddingTop="15dp"
        android:scaleType="fitStart"
        android:src="@drawable/home" />

    <Button
        android:id="@+id/login_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/password_input"
        android:layout_marginLeft="15dp"
        android:layout_marginTop="15dp"
        android:text="   login   "
        android:textSize="18sp" >
    </Button>

</RelativeLayout>

You are looking for the android:layout_weight attribute. It will allow you to use percentages to define your layout.

In the following example, the left button uses 70% of the space, and the right button 30%.

<LinearLayout
    android:layout_width="match_parent" 
    android:layout_height="wrap_content">

    <Button
        android:text="left" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".70" /> 

    <Button
        android:text="right" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".30" />

</LinearLayout>

It works the same with any kind of View, you can replace the buttons with some EditText to fit your needs.

Be sure to set the layout_width to 0dp or your views may not be scaled properly.

Note that the weight sum doesn't have to equal 1, I just find it easier to read like this. You can set the first weight to 7 and the second to 3 and it will give the same result.