You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Android中如何按设备自动分配宽度?双控件同行不重叠实现

实现两个TextInputLayout在ConstraintLayout中各占50%宽度并排显示的方案

方法1:使用垂直Guideline(推荐)

通过在布局中间添加一条垂直百分比Guideline,将两个TextInputLayout分别约束到Guideline两侧,即可实现各占50%宽度的自适应效果。

示例代码:

<androidx.constraintlayout.widget.ConstraintLayout
    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="wrap_content"
    android:padding="16dp">

    <!-- 垂直指南线,位于父布局宽度的50%位置 -->
    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/vertical_guideline"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.5"/>

    <!-- 左侧TextInputLayout -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/left_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/vertical_guideline"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="左侧输入框"/>
    </com.google.android.material.textfield.TextInputLayout>

    <!-- 右侧TextInputLayout -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/right_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        app:layout_constraintStart_toEndOf="@id/vertical_guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="右侧输入框"/>
    </com.google.android.material.textfield.TextInputLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

关键细节:

  • 两个TextInputLayout的layout_width必须设为0dp(即match_constraint),让约束规则决定宽度
  • Guideline的layout_constraintGuide_percent="0.5"确保它处于父布局正中间
  • 用layout_constraintEnd_toStartOf和layout_constraintStart_toEndOf将输入框绑定到Guideline两侧,添加margin避免内容紧贴

方法2:使用水平Chain约束

利用ConstraintLayout的水平Chain特性,通过设置权重让两个输入框平分宽度。

示例代码:

<androidx.constraintlayout.widget.ConstraintLayout
    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="wrap_content"
    android:padding="16dp">

    <!-- 左侧TextInputLayout -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/left_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/right_input"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="左侧输入框"/>
    </com.google.android.material.textfield.TextInputLayout>

    <!-- 右侧TextInputLayout -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/right_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        app:layout_constraintStart_toEndOf="@id/left_input"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintHorizontal_weight="1">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="右侧输入框"/>
    </com.google.android.material.textfield.TextInputLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

关键细节:

  • 输入框的layout_width设为0dp,确保权重规则生效
  • 两个输入框的layout_constraintHorizontal_weight都设为1,让它们平分水平方向的可用宽度
  • 相互绑定start和end约束,自动形成水平Chain

通用注意事项

  • 必须将内部的TextInputEditText的layout_width设为match_parent,否则输入内容无法填满外层布局
  • 添加适当margin可提升视觉舒适度,避免控件紧贴
  • 两种方案均无需硬编码固定宽度,可自动适配不同设备屏幕

内容的提问来源于stack exchange,提问作者Nimesh

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.14 12:10:37