在RelativeLayout的百分比宽度 [英] Percentage width in a RelativeLayout
问题描述
我工作的一种形式布局的登录活动
在我的Android应用程序。下面的图片是我希望它看起来像:
我能够实现这个布局有以下 XML 。问题是,这是一个有点hackish。我只好硬code主机的EditText的宽度。具体而言,我必须指定:
机器人:layout_width =172dp
我真的想给一个百分比宽度的主机和端口的EditText的。 (喜欢的东西80%为主机,20%的端口)。这可能吗?下面的XML工作在我的Droid的,但它似乎并不适用于所有的屏幕。我真的想一个更强大的解决方案。
< RelativeLayout的的xmlns:机器人=http://schemas.android.com/apk/res/android
机器人:ID =@ + ID /主
机器人:layout_width =FILL_PARENT
机器人:layout_height =FILL_PARENT>
<的TextView
机器人:ID =@ + ID / host_label
机器人:layout_width =WRAP_CONTENT
机器人:layout_height =WRAP_CONTENT
机器人:layout_below =@ + ID /家
机器人:以下属性来=15dp
机器人:paddingTop =0dp
机器人:文本=主机
机器人:文字颜色=#a5d4e2
机器人:TEXTSIZE =25sp
机器人:TEXTSTYLE =正常/>
<的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 =正常/>
<的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/>
<的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 =号/>
<的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 =正常/>
<的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/>
<的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 =正常/>
<的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/>
< ImageView的
机器人:ID =@ + ID /家
机器人:layout_width =WRAP_CONTENT
机器人:layout_height =WRAP_CONTENT
机器人:layout_alignParentTop =真
机器人:layout_centerHorizontal =真
机器人:layout_centerVertical =假
机器人:以下属性来=15dp
机器人:paddingRight =15dp
机器人:paddingTop =15dp
机器人:scaleType =fitStart
机器人:SRC =@可绘制/家/>
<按钮
机器人: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>
< /按钮>
< / RelativeLayout的>
您正在寻找的android:layout_weight
属性。它可以让你用百分比来定义你的布局。
在下面的例子中,左按钮使用的空间的70%,和右按钮30%
<的LinearLayout
机器人:layout_width =match_parent
机器人:layout_height =WRAP_CONTENT>
<按钮
机器人:文本=左
机器人:layout_width =0dp
机器人:layout_height =WRAP_CONTENT
70:机器人layout_weight = />
<按钮
机器人:文本=右
机器人:layout_width =0dp
机器人:layout_height =WRAP_CONTENT
30:机器人layout_weight = />
< / LinearLayout中>
它的工作原理相同的任何一种观点,你可以用一些替代的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.
这篇关于在RelativeLayout的百分比宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!