如何在ConstraintLayout中实现两个ImageView水平并排，解决预览正常真机异常问题

问题原因 #

• tools:layout_editor_absoluteX属于tools命名空间属性，仅作用于Android Studio预览界面，打包运行时会被完全忽略，不生效
• 两个ImageView仅配置了垂直方向约束，没有添加合法的水平方向约束，运行时系统无法确定两张图片的水平位置，默认会全部堆叠在屏幕左侧
• 固定写死340dp的图片宽度，两张图片总宽度达680dp，远超多数安卓设备的屏幕宽度，即便加了约束也会出现显示不全的问题

修正方案 #

以下是适配所有设备、可实现两张图片水平并排居中显示的XML代码：

<?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:padding="10dp"
    android:background="#ffffff"
    tools:context=".SplashActivity">

    <ImageView
        android:id="@+id/iv_left"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:src="@drawable/ic_2"
        android:tint="#ff0000"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@id/iv_right"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintHorizontal_weight="1" />

    <ImageView
        android:id="@+id/iv_right"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:src="@drawable/ic_karo"
        android:tint="#0000b3"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@id/iv_left"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintHorizontal_weight="1" />

</androidx.constraintlayout.widget.ConstraintLayout>

修正说明 #

• 移除了仅预览生效的tools定位属性，替换为运行时生效的标准约束属性
• 给两张图片添加了水平方向约束，实现左图贴屏幕左边缘、右图贴屏幕右边缘、两张并排展示的效果
• 宽度设置为0dp配合layout_constraintHorizontal_weight属性，让两张图片平分屏幕可用宽度，适配所有分辨率的设备
• layout_constraintDimensionRatio="1:1"保证图片保持正方形比例，和原有需求一致

内容的提问来源于stack exchange，提问作者Nisha Atram