Android 创建对齐的字段布局答案

【问题标题】：Android Create aligned fields LayoutAndroid 创建对齐的字段布局
【发布时间】：2011-08-04 06:51:08
【问题描述】：

这是我的问题，我有一个登录名并想排列 EditText 字段。见附件的样机图片。
我尝试了几种方法，无法弄清楚如何制作字段阵容。

我真的很讨厌 Android 中的布局，我会花更多的时间来弄乱排列正确的东西。希望他们放弃它并使用更直观的东西，因为它更像是在 HTML 中使用表格。所以提前感谢您的帮助和欢呼！

【问题讨论】：

理解你的挫败感，我也喜欢 Android 的方式，它处理与代码分开的 xml 中的所有布局内容。两个编辑框看起来已经对齐了，你能说清楚你想要什么吗？
@bob 我认为那是画笔中的绘图，而不是 android 活动的屏幕截图：P
是的，这是一个使用 WireFrameSketcher 绘制的草图，这是最好的工具来预构建屏幕并将它们展示给客户以显示屏幕流程和设计，价值 75.00 美元。

标签： android layout alignment android-edittext

【解决方案1】：

您或许可以玩弄RelativeLayout 并得到您想要的。

这是TableLayout 的近似值。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TableLayout
        android:layout_marginTop="40dip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center">
        <TableRow>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="right"
                android:padding="10dip"
                android:text="UserID:" />
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="10dip"
                android:text="USER ID" />
        </TableRow>
        <TableRow>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="right"
                android:padding="10dip"
                android:text="Password:" />
            <EditText
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:padding="10dip"
                android:text="PASSWORD" />
        </TableRow>
    </TableLayout>
    <LinearLayout
        android:layout_marginTop="50dip"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:weightSum="3"
        android:gravity="center">
        <Button
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="LOGIN" />
        <Button
            android:layout_width="0dip"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:text="REGISTER" />
    </LinearLayout>
</LinearLayout>

【讨论】：

谢谢你成功了！如果没有stackoverflow，我该怎么办，这个网站是最好的。干杯！
唯一的问题是当您添加或删除文本时 EditText 字段会动态变化。取出字段中的两个文本，edittext 字段即时调整大小为一个字符宽。
将EditTexts的layout_width属性改为fill_parent。

【解决方案2】：

看看这是否适合你。它的居中不是很完美，但在多种屏幕尺寸上都能很好地对齐。

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent" android:background="#FFFF0000">
  <LinearLayout android:id="@+id/top_row"
            android:layout_height="wrap_content" 
            android:layout_alignParentTop="true"
            android:orientation="vertical" android:layout_centerHorizontal="true" android:layout_width="wrap_content" android:layout_marginTop="25dip">
            <LinearLayout  android:layout_height="wrap_content"  android:orientation="horizontal" android:layout_width="fill_parent">
                <TextView android:layout_height="wrap_content" android:text="User Id" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
                <EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
            </LinearLayout>
            <LinearLayout  android:layout_height="wrap_content"  android:orientation="horizontal" android:layout_width="fill_parent">
                <TextView android:layout_height="wrap_content" android:text="Password" android:gravity="right" android:layout_marginRight="10dip" android:layout_width="fill_parent" android:layout_weight="2" android:textColor="#FF000000"></TextView>
                <EditText android:layout_height="wrap_content" android:layout_width="fill_parent" android:ems="10" android:layout_weight="1"></EditText>
            </LinearLayout>
  </LinearLayout>
  <LinearLayout
            android:layout_height="wrap_content" 
            android:orientation="horizontal" android:layout_width="wrap_content" android:layout_below="@+id/top_row" android:layout_centerHorizontal="true" android:layout_marginTop="20dip">
        <Button android:layout_width="wrap_content" android:text="LOGIN" android:layout_height="wrap_content" android:layout_marginRight="10dip"></Button>
        <Button android:text="REGISTER" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_marginLeft="10dip"></Button>
  </LinearLayout>
</RelativeLayout>

这是它在我的 IDE 中的样子...

【讨论】：

喜欢你的方法，但选择了上面的方法，因为按钮看起来更干净了。

【解决方案3】：

您可以使用 TableLayout 快速而肮脏地做到这一点，只需为用户 ID 添加一个带有 TextView 和一个 EditText 的 TableRow 并为密码重复相同的操作。

见http://developer.android.com/resources/tutorials/views/hello-tablelayout.html

【讨论】：