我正在为我的Android应用程序中的登录Activity表单布局。 下图是我想要的样子:

1f50240a14935fa5fe2ff76d3c97cdb7.png

我可以使用以下XML来实现此布局。 问题是,它有点骇人听闻。 我必须对主机EditText的宽度进行硬编码。 具体来说,我必须指定:

android:layout_width="172dp"

我真的很想给主机和端口EditText的百分比宽度。 (大约80%用于主机,20%用于端口。)这可能吗? 以下XML在我的Droid上可用,但似乎不适用于所有屏幕。 我真的想要一个更强大的解决方案。

android:id="@+id/main"

android:layout_width="fill_parent"

android:layout_height="fill_parent" >

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" />

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" />

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" />

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" />

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" />

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" />

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" />

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" />

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" />

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

#1楼

有趣的是,基于@olefevre的答案,不仅可以使用“隐形支柱”进行50/50布局,而且还可以进行涉及2的幂的各种布局。

例如,以下布局将宽度切成四个相等的部分(实际上是三个,权重分别为1、1、2):

android:layout_width="match_parent"

android:layout_height="wrap_content" >

android:id="@+id/strut"

android:layout_width="1dp"

android:layout_height="match_parent"

android:layout_centerHorizontal="true"

android:background="#000000" />

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_toLeftOf="@+id/strut" >

android:id="@+id/left_strut"

android:layout_width="1dp"

android:layout_height="match_parent"

android:layout_toLeftOf="@+id/strut"

android:layout_centerHorizontal="true"

android:background="#000000" />

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_alignParentLeft="true"

android:layout_alignRight="@+id/left_strut"

android:text="Far Left" />

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:layout_toRightOf="@+id/left_strut"

android:text="Near Left" />

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_alignLeft="@id/strut"

android:layout_alignParentRight="true"

android:text="Right" />

#2楼

我已经解决了创建自定义视图的问题:

public class FractionalSizeView extends View {

public FractionalSizeView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public FractionalSizeView(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

int width = MeasureSpec.getSize(widthMeasureSpec);

setMeasuredDimension(width * 70 / 100, 0);

}

}

这是不可见的支柱,可用于在RelativeLayout中对齐其他视图。

#3楼

您可以查看新的百分比支持库。

compile 'com.android.support:percent:22.2.0'

#4楼

更新1

正如指出的@EmJiHash API等级26.0.0已被弃用

下面引用谷歌评论:

此类已在API级别26.0.0中弃用。 考虑改用ConstraintLayout和关联的布局。 下面显示了如何使用ConstraintLayout复制百分比布局的功能

然后您可以指定要查看的百分比

添加类似的编译依赖

implementation 'com.android.support:percent:22.2.0

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="match_parent">

app:layout_widthPercent="50%"

app:layout_heightPercent="50%"

app:layout_marginTopPercent="25%"

app:layout_marginLeftPercent="25%"/>

#5楼

您可以使用PercentRelativeLayout ,它是Design Support Library的最新未记录功能,使您不仅可以指定彼此相对的元素,还可以指定可用空间的总百分比 。

RelativeLayout的子类,支持基于百分比的尺寸和边距。 您可以通过使用带有“百分比”后缀的属性来指定尺寸或子项的边距。

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="match_parent">

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_widthPercent="50%"

app:layout_heightPercent="50%"

app:layout_marginTopPercent="25%"

app:layout_marginLeftPercent="25%"/>

Percent软件包提供了API,以支持在应用程序中添加和管理基于百分比的维度。

要使用该库 ,您需要将此库添加到您的Gradle依赖项列表中:

dependencies {

compile 'com.android.support:percent:22.2.0'//23.1.1

}

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐