约束布局不适用于所有android设备的屏幕尺寸

Question

我具有以下布局，它适用于Note 9 Samsung等大屏幕，但不会缩小以适合小型手机的屏幕尺寸，请参阅随附的图片和代码。我喜欢使用约束布局，我确实将所有项目选择为WRAPCONTENT或MATCHCONSTRAIN的形式，但是在小型手机中，开始按钮仍然跳出屏幕。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/scroll"
    tools:context=".teamselect">

    <EditText
        android:id="@+id/team1EdtTxt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="148dp"
        android:layout_marginLeft="148dp"
        android:layout_marginTop="7dp"
        android:layout_marginEnd="49dp"
        android:layout_marginRight="49dp"
        android:layout_marginBottom="22dp"
        android:ems="10"
        android:hint="اللاعب 1"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/team1EdtTxt2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

    <EditText
        android:id="@+id/team1EdtTxt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="148dp"
        android:layout_marginLeft="148dp"
        android:layout_marginTop="7dp"
        android:layout_marginEnd="49dp"
        android:layout_marginRight="49dp"
        android:layout_marginBottom="54dp"
        android:clickable="false"
        android:editable="false"
        android:ems="10"
        android:hint="اللاعب 2"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/textView2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/team1EdtTxt1" />

    <EditText
        android:id="@+id/team2EdtTxt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="148dp"
        android:layout_marginLeft="148dp"
        android:layout_marginTop="7dp"
        android:layout_marginEnd="49dp"
        android:layout_marginRight="49dp"
        android:layout_marginBottom="22dp"
        android:clickable="false"
        android:ems="10"
        android:hint="اللاعب 1"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/team2EdtTxt2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView2" />

    <EditText
        android:id="@+id/team2EdtTxt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="148dp"
        android:layout_marginLeft="148dp"
        android:layout_marginTop="7dp"
        android:layout_marginEnd="49dp"
        android:layout_marginRight="49dp"
        android:clickable="false"
        android:ems="10"
        android:hint="اللاعب 2"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/team2EdtTxt1" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="209dp"
        android:layout_marginLeft="209dp"
        android:layout_marginTop="129dp"
        android:layout_marginEnd="41dp"
        android:layout_marginRight="41dp"
        android:layout_marginBottom="24dp"
        android:text="الفريق الاول"
        android:textSize="36sp"
        app:fontFamily="@font/advent_pro_thin"
        app:layout_constraintBottom_toTopOf="@+id/team1EdtTxt1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="209dp"
        android:layout_marginLeft="209dp"
        android:layout_marginTop="44dp"
        android:layout_marginEnd="41dp"
        android:layout_marginRight="41dp"
        android:layout_marginBottom="24dp"
        android:text="الفريق الثاني"
        android:textSize="36sp"
        app:layout_constraintBottom_toTopOf="@+id/team2EdtTxt1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/team1EdtTxt2" />

    <Button
        android:id="@+id/startBtn"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="110dp"
        android:layout_marginLeft="110dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="110dp"
        android:layout_marginRight="110dp"
        android:layout_marginBottom="10dp"
        android:background="@drawable/buttondomeno"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/team2EdtTxt2" />
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

由于文本大小和页边距固定，因此不适合您可以尝试以下两种方法之一：1）使用ScrollView使布局可滚动2）删除硬编码的尺寸，并针对不同的屏幕尺寸使用不同的尺寸

Answer 2

添加到@Hamza Khan答案中，请尝试避免在视图上使用任何固定大小，您可以使用以下布局：

 <androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:layout_editor_absoluteX="0dp"
    tools:layout_editor_absoluteY="0dp">


    <EditText
        android:id="@+id/team1EdtTxt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="اللاعب 1"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/team1EdtTxt2"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintTop_toBottomOf="@+id/textView" />

    <EditText
        android:id="@+id/team1EdtTxt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:clickable="false"
        android:editable="false"
        android:ems="10"
        android:hint="اللاعب 2"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/textView2"
        app:layout_constraintEnd_toEndOf="@+id/textView"
        app:layout_constraintTop_toBottomOf="@+id/team1EdtTxt1" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:text="الفريق الاول"
        android:textSize="36sp"
        app:layout_constraintBottom_toTopOf="@+id/team1EdtTxt1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline2" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:text="الفريق الثاني"
        android:textSize="36sp"
        app:layout_constraintBottom_toTopOf="@+id/team2EdtTxt1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline3" />

    <EditText
        android:id="@+id/team2EdtTxt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:clickable="false"
        android:ems="10"
        android:hint="اللاعب 1"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/team2EdtTxt2"
        app:layout_constraintEnd_toEndOf="@+id/textView2"
        app:layout_constraintTop_toBottomOf="@+id/textView2" />

    <EditText
        android:id="@+id/team2EdtTxt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="false"
        android:ems="10"
        android:hint="اللاعب 2"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/startBtn"
        app:layout_constraintEnd_toEndOf="@+id/textView2"
        app:layout_constraintTop_toBottomOf="@+id/team2EdtTxt1" />

    <Button
        android:id="@+id/startBtn"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="start"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintWidth_percent="0.3" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.50" />

    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.10" />


</androidx.constraintlayout.widget.ConstraintLayout>

它将看起来像这样：

注意，我已经使用了2个非常有用的属性：

  app:layout_constraintHeight_percent="0.1"
  app:layout_constraintWidth_percent="0.3"

此外，我已经使用Guidelines，所以现在如果您想更改布局的外观，只需更改此属性即可：

  app:layout_constraintGuide_percent="0.x"