ConstraintLayout的constraintDimensionRatio属性记录

最新推荐文章于 2025-02-01 22:29:08 发布

原创最新推荐文章于 2025-02-01 22:29:08 发布 · 800 阅读

0 ·

CC 4.0 BY-SA版权

Android 专栏收录该内容

5 篇文章

订阅专栏

本文详细解析了Android ConstraintLayout中布局元素宽高比的设定规则与逻辑，包括不同情况下的默认约束方向及如何通过属性调整实现精确的尺寸控制。

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
    tools:ignore="MissingConstraints">

    <!--
    w:0dp
    h:wrap_content/具体数值
    此时默认是以h作为标准来约束w,"w,2:1"="2:1"都是宽:高=2:1,若此时你写"h,2:1"则代表高:宽=2:1；-->
    <TextView
        android:id="@+id/tv1"
        android:layout_width="0dp"
        android:layout_height="100dp"
        android:background="@color/colorAccent"
        app:layout_constraintDimensionRatio="3:1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

    <!--
    w:wrap_content/具体数值
    h:0dp
    此时默认是以w作为标准来约束h,"h,2:1"="2:1"都是宽:高=2:1,若此时你写"w,2:1"则代表高:宽=2:1；-->
    <TextView
        android:id="@+id/tv2"
        android:layout_width="200dp"
        android:layout_height="0dp"
        android:layout_marginTop="20dp"
        android:background="@color/colorAccent"
        app:layout_constraintDimensionRatio="2:1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/tv1"/>
    <!--
       w:0dp
       h:0dp
       此时默认是以w作为标准来约束h,"h,2:1"="2:1"都是宽:高=2:1,若此时你写"w,2:1"则代表高:宽=2:1。
       私以为ratio比例值并非一定是h,
       ratio代表h = w * ratio，w,ratio代表w = h * ratio，
       而是你写的是否和官方默认的规则相同，若相反才是反比。
       -->
    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginTop="20dp"
        android:background="@color/colorAccent"
        app:layout_constraintDimensionRatio="3:1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/tv2"/>


</android.support.constraint.ConstraintLayout>