Question

Dears我正在尝试使用百分比的约束布局来支持不同的屏幕尺寸，如果我只使用图片或按钮，它的工作正常但是当我添加文本时它不会出现在小屏幕上，即使我将其添加为具有中心重力的匹配父级。我添加了xml代码.. 如果我可以使用这种方法来支持不同的屏幕尺寸，或者我必须创建不同的xml文件，你能帮助我。

编辑我

屏幕尺寸为LDPI API 22 240×320：ldpi 22 Android 5.1（Google API）和MDPI Small API 22 320×480：mdpi 22 Android 5.1（Google API）

布局：

<android.support.constraint.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/green_background"
tools:context="com.yaacoach.gymapp.StartExercise">

<android.support.constraint.Guideline
    android:id="@+id/guideline16"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.18" />

<android.support.constraint.Guideline
    android:id="@+id/guideline36"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.2" />

<android.support.constraint.Guideline
    android:id="@+id/guideline37"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.8" />

<android.support.constraint.Guideline
    android:id="@+id/guideline38"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.03" />

<android.support.constraint.Guideline
    android:id="@+id/guideline40"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.08" />

<android.support.constraint.Guideline
    android:id="@+id/guideline41"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.92" />

<android.support.constraint.Guideline
    android:id="@+id/guideline42"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.27" />

<Button
    android:id="@+id/btn_start"
    style="@style/Base.TextAppearance.AppCompat.Medium"
    android:gravity="center"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="2dp"
    android:background="@drawable/stopwatchstyle"
    android:text="start"
    app:layout_constraintBottom_toTopOf="@+id/guideline43"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline39"
    app:layout_constraintVertical_bias="0.833" />

<android.support.constraint.Guideline
    android:id="@+id/guideline43"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.93" />

<android.support.v7.widget.RecyclerView
    android:id="@+id/rv_startExercise_information"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toTopOf="@+id/guideline39"
    app:layout_constraintEnd_toStartOf="@+id/guideline41"
    app:layout_constraintStart_toStartOf="@+id/guideline40"
    app:layout_constraintTop_toTopOf="@+id/guideline42" />

<android.support.constraint.Guideline
    android:id="@+id/guideline39"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.86" />


<android.support.constraint.Guideline
    android:id="@+id/guideline45"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.25" />

<android.support.constraint.ConstraintLayout
    android:id="@+id/CL_stopWatch"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@drawable/stopwatchstyle"
    android:descendantFocusability="beforeDescendants"
    android:focusableInTouchMode="true"
    android:foregroundGravity="center"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline38"
    app:layout_constraintVertical_bias="1.0">


</android.support.constraint.ConstraintLayout>

<Chronometer
    android:id="@+id/chronometer2"
    style="@android:style/TextAppearance.DeviceDefault.Medium"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:gravity="center"
    android:textColor="@color/btnbrainiac"
    android:textStyle="bold"
    app:layout_constraintBottom_toTopOf="@+id/guideline46"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline38" />

<android.support.constraint.Guideline
    android:id="@+id/guideline46"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.11" />

<android.support.constraint.Guideline
    android:id="@+id/guideline47"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.4" />

<android.support.v7.widget.RecyclerView
    android:id="@+id/rv_start_exercise_weight_rep"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintStart_toStartOf="@+id/guideline47"
    app:layout_constraintTop_toTopOf="@+id/guideline46" />

<TextView
    android:id="@+id/textView2"
    style="@android:style/TextAppearance.DeviceDefault.Small"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="@string/Weight"
    app:layout_constraintBottom_toTopOf="@+id/guideline16"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline46" />

<TextView
    android:id="@+id/textView4"
    style="@android:style/TextAppearance.DeviceDefault.Small"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="@string/repetition"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline16" />

<Button
    android:id="@+id/btn_StartExercies_Pause"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="2dp"
    android:background="@drawable/stopwatchstyle"
    android:text="Button"
    app:layout_constraintBottom_toTopOf="@+id/guideline43"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="@+id/guideline47"
    app:layout_constraintTop_toTopOf="@+id/guideline39"
    app:layout_constraintVertical_bias="0.0" />

Answer 1

屏幕尺寸是 LDPI API 22 240×320：ldpi 22 Android 5.1（Google API）和 MDPI Small API 22 320×480：mdpi 22 Android 5.1（Google API）

Answer 2

<android.support.constraint.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/green_background"
tools:context="com.yaacoach.gymapp.StartExercise">

<android.support.constraint.Guideline
    android:id="@+id/guideline16"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.18" />

<android.support.constraint.Guideline
    android:id="@+id/guideline36"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.2" />

<android.support.constraint.Guideline
    android:id="@+id/guideline37"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.8" />

<android.support.constraint.Guideline
    android:id="@+id/guideline38"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.03" />

<android.support.constraint.Guideline
    android:id="@+id/guideline40"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.08" />

<android.support.constraint.Guideline
    android:id="@+id/guideline41"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.92" />

<android.support.constraint.Guideline
    android:id="@+id/guideline42"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.27" />

<Button
    android:id="@+id/btn_start"
    style="@style/Base.TextAppearance.AppCompat.Medium"
    android:gravity="center"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="2dp"
    android:background="@drawable/stopwatchstyle"
    android:text="start"
    app:layout_constraintBottom_toTopOf="@+id/guideline43"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline39"
    app:layout_constraintVertical_bias="0.833" />

<android.support.constraint.Guideline
    android:id="@+id/guideline43"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.93" />

<android.support.v7.widget.RecyclerView
    android:id="@+id/rv_startExercise_information"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toTopOf="@+id/guideline39"
    app:layout_constraintEnd_toStartOf="@+id/guideline41"
    app:layout_constraintStart_toStartOf="@+id/guideline40"
    app:layout_constraintTop_toTopOf="@+id/guideline42" />

<android.support.constraint.Guideline
    android:id="@+id/guideline39"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.86" />


<android.support.constraint.Guideline
    android:id="@+id/guideline45"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.25" />

<android.support.constraint.ConstraintLayout
    android:id="@+id/CL_stopWatch"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@drawable/stopwatchstyle"
    android:descendantFocusability="beforeDescendants"
    android:focusableInTouchMode="true"
    android:foregroundGravity="center"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline38"
    app:layout_constraintVertical_bias="1.0">


</android.support.constraint.ConstraintLayout>

<Chronometer
    android:id="@+id/chronometer2"
    style="@android:style/TextAppearance.DeviceDefault.Medium"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:gravity="center"
    android:textColor="@color/btnbrainiac"
    android:textStyle="bold"
    app:layout_constraintBottom_toTopOf="@+id/guideline46"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline38" />

<android.support.constraint.Guideline
    android:id="@+id/guideline46"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    app:layout_constraintGuide_percent="0.11" />

<android.support.constraint.Guideline
    android:id="@+id/guideline47"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.4" />

<android.support.v7.widget.RecyclerView
    android:id="@+id/rv_start_exercise_weight_rep"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintStart_toStartOf="@+id/guideline47"
    app:layout_constraintTop_toTopOf="@+id/guideline46" />

<TextView
    android:id="@+id/textView2"
    style="@android:style/TextAppearance.DeviceDefault.Small"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="@string/Weight"
    app:layout_constraintBottom_toTopOf="@+id/guideline16"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline46" />

<TextView
    android:id="@+id/textView4"
    style="@android:style/TextAppearance.DeviceDefault.Small"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="@string/repetition"
    app:layout_constraintBottom_toTopOf="@+id/guideline45"
    app:layout_constraintEnd_toStartOf="@+id/guideline47"
    app:layout_constraintStart_toStartOf="@+id/guideline36"
    app:layout_constraintTop_toTopOf="@+id/guideline16" />

<Button
    android:id="@+id/btn_StartExercies_Pause"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="2dp"
    android:background="@drawable/stopwatchstyle"
    android:text="Button"
    app:layout_constraintBottom_toTopOf="@+id/guideline43"
    app:layout_constraintEnd_toStartOf="@+id/guideline37"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="@+id/guideline47"
    app:layout_constraintTop_toTopOf="@+id/guideline39"
    app:layout_constraintVertical_bias="0.0" />

Answer 3

我在Android Studio中粘贴了Layout，我看到它呈现正常。注意我替换了颜色和字符串，因为我没有资源文件。

下图是您提到的LDPI显示的布局。

无论如何，我给你留下了另一种方法，你可以用更少的指导和更少的约束元素达到相同的布局。

布局：

<android.support.constraint.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="#00FF00"
    >

    <android.support.constraint.Guideline
        android:id="@+id/glTop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.03" />


    <android.support.constraint.Guideline
        android:id="@+id/glBottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.93" />

    <android.support.constraint.Guideline
        android:id="@+id/glLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.08" />

    <android.support.constraint.Guideline
        android:id="@+id/glRight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.92" />


    <android.support.constraint.Guideline
        android:id="@+id/glChronoLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.2" />

    <android.support.constraint.Guideline
        android:id="@+id/glChronoRight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.8" />


    <LinearLayout
        android:id="@+id/chronometerContainer"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="vertical"

        app:layout_constraintEnd_toStartOf="@+id/glChronoRight"
        app:layout_constraintStart_toStartOf="@+id/glChronoLeft"
        app:layout_constraintTop_toTopOf="@+id/glTop">
        <Chronometer
            android:id="@+id/chronometer2"
            style="@android:style/TextAppearance.DeviceDefault.Medium"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textColor="000000"
            android:textStyle="bold"
             />
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:weightSum="12">
            <LinearLayout
                android:layout_width="0dp"
                android:layout_weight="4"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:background="#FF0000">
                <TextView
                    android:id="@+id/textView2"
                    style="@android:style/TextAppearance.DeviceDefault.Small"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="Weight" />
                <TextView
                    android:id="@+id/textView4"
                    style="@android:style/TextAppearance.DeviceDefault.Small"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="Repet" />
            </LinearLayout>
            <android.support.v7.widget.RecyclerView
                android:id="@+id/rv_startExercise_information"
                android:layout_width="0dp"
                android:layout_weight="8"
                android:layout_height="match_parent"/>
        </LinearLayout>
    </LinearLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/rv_start_exercise_weight_rep"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="8dp"

        app:layout_constraintStart_toEndOf="@+id/glLeft"
        app:layout_constraintBottom_toTopOf="@+id/btnContainer"
        app:layout_constraintEnd_toStartOf="@+id/glRight"
        app:layout_constraintTop_toBottomOf="@+id/chronometerContainer" />

    <LinearLayout
        android:id="@+id/btnContainer"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="12"

        app:layout_constraintStart_toStartOf="@id/glChronoLeft"
        app:layout_constraintEnd_toEndOf="@+id/glChronoRight"
        app:layout_constraintBottom_toTopOf="@+id/glBottom">

        <Button
            android:id="@+id/btn_start"
            style="@style/Base.TextAppearance.AppCompat.Medium"
            android:gravity="center"
            android:layout_width="0dp"
            android:layout_weight="6"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:background="#FF0000"
            android:layout_margin="1px"
            android:text="start" />

        <Button
            android:id="@+id/btn_StartExercies_Pause"
            style="@style/Base.TextAppearance.AppCompat.Medium"
            android:layout_width="0dp"
            android:layout_weight="6"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:background="#FF0000"
            android:layout_margin="1px"
            android:text="Button"
             />

    </LinearLayout>

</android.support.constraint.ConstraintLayout>

android约束布局支持不同的屏幕尺寸

3 个答案: