Android 约束布局 - 将一个 ImageView 移动到另一个 ImageView

Android Constraint Layout - move an ImageView to another ImageView

我有一个 6x5 ImageViews 网格用作我的地图。我需要将我的角色从一个 imageView 移动到另一个。我想在 Java 文件中执行此操作,但我不知道可以使用什么代码在约束布局中移动角色。

这是我的 XML 文件。人物在最底下

<?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:id="@+id/constLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
    android:id="@+id/leftSide"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="horizontal"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@id/tile1_1"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintHorizontal_weight="3">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="leftSide" />
</LinearLayout>
<LinearLayout
    android:id="@+id/rightSide"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="horizontal"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_6"
    app:layout_constraintHorizontal_weight="3">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="rightSide" />
</LinearLayout>
<!-- Row 1 -->

<ImageView
    android:id="@+id/tile1_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile1_2"
    app:layout_constraintBottom_toTopOf="@id/tile2_1"/>

<ImageView
    android:id="@+id/tile1_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_1"
    app:layout_constraintRight_toLeftOf="@+id/tile1_3"
    app:layout_constraintBottom_toTopOf="@id/tile2_2"/>
<ImageView
    android:id="@+id/tile1_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_2"
    app:layout_constraintRight_toLeftOf="@+id/tile1_4"
    app:layout_constraintBottom_toTopOf="@id/tile2_3"/>
<ImageView
    android:id="@+id/tile1_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_3"
    app:layout_constraintRight_toLeftOf="@+id/tile1_5"
    app:layout_constraintBottom_toTopOf="@id/tile2_4"/>
<ImageView
    android:id="@+id/tile1_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_4"
    app:layout_constraintRight_toLeftOf="@+id/tile1_6"
    app:layout_constraintBottom_toTopOf="@id/tile2_5"/>
<ImageView
    android:id="@+id/tile1_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintLeft_toRightOf="@id/tile1_5"
    app:layout_constraintRight_toLeftOf="@+id/rightSide"
    app:layout_constraintBottom_toTopOf="@id/tile2_6"/>
<!-- Row 2 -->

<ImageView
    android:id="@+id/tile2_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_1"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile2_2"
    app:layout_constraintBottom_toTopOf="@id/tile3_1"/>

<ImageView
    android:id="@+id/tile2_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_2"
    app:layout_constraintLeft_toRightOf="@id/tile2_1"
    app:layout_constraintRight_toLeftOf="@id/tile2_3"
    app:layout_constraintBottom_toTopOf="@id/tile3_2"/>
<ImageView
    android:id="@+id/tile2_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_3"
    app:layout_constraintLeft_toRightOf="@id/tile2_2"
    app:layout_constraintRight_toLeftOf="@id/tile2_4"
    app:layout_constraintBottom_toTopOf="@id/tile3_3"/>
<ImageView
    android:id="@+id/tile2_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_4"
    app:layout_constraintLeft_toRightOf="@id/tile2_3"
    app:layout_constraintRight_toLeftOf="@id/tile2_5"
    app:layout_constraintBottom_toTopOf="@id/tile3_4"/>
<ImageView
    android:id="@+id/tile2_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_5"
    app:layout_constraintLeft_toRightOf="@id/tile2_4"
    app:layout_constraintRight_toLeftOf="@id/tile2_6"
    app:layout_constraintBottom_toTopOf="@id/tile3_5"/>
<ImageView
    android:id="@+id/tile2_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile1_6"
    app:layout_constraintLeft_toRightOf="@id/tile2_5"
    app:layout_constraintRight_toLeftOf="@id/rightSide"
    app:layout_constraintBottom_toTopOf="@id/tile3_6"/>
<!-- Row 3 -->

<ImageView
    android:id="@+id/tile3_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_1"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile3_2"
    app:layout_constraintBottom_toTopOf="@id/tile4_1"/>
<ImageView
    android:id="@+id/tile3_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_2"
    app:layout_constraintLeft_toRightOf="@id/tile5_1"
    app:layout_constraintRight_toLeftOf="@id/tile3_3"
    app:layout_constraintBottom_toTopOf="@id/tile4_2"/>
<ImageView
    android:id="@+id/tile3_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_3"
    app:layout_constraintLeft_toRightOf="@id/tile3_2"
    app:layout_constraintRight_toLeftOf="@id/tile3_4"
    app:layout_constraintBottom_toTopOf="@id/tile4_3"/>
<ImageView
    android:id="@+id/tile3_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_4"
    app:layout_constraintLeft_toRightOf="@id/tile3_3"
    app:layout_constraintRight_toLeftOf="@id/tile3_5"
    app:layout_constraintBottom_toTopOf="@id/tile4_4"/>
<ImageView
    android:id="@+id/tile3_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_5"
    app:layout_constraintLeft_toRightOf="@id/tile3_4"
    app:layout_constraintRight_toLeftOf="@id/tile3_6"
    app:layout_constraintBottom_toTopOf="@id/tile4_5"/>
<ImageView
    android:id="@+id/tile3_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile2_6"
    app:layout_constraintLeft_toRightOf="@id/tile3_5"
    app:layout_constraintRight_toLeftOf="@id/rightSide"
    app:layout_constraintBottom_toTopOf="@id/tile4_6"/>
<!-- Row 4 -->

<ImageView
    android:id="@+id/tile4_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_1"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile4_2"
    app:layout_constraintBottom_toTopOf="@id/tile5_1"/>
<ImageView
    android:id="@+id/tile4_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_2"
    app:layout_constraintLeft_toRightOf="@id/tile4_1"
    app:layout_constraintRight_toLeftOf="@id/tile4_3"
    app:layout_constraintBottom_toTopOf="@id/tile5_2"/>
<ImageView
    android:id="@+id/tile4_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_3"
    app:layout_constraintLeft_toRightOf="@id/tile4_2"
    app:layout_constraintRight_toLeftOf="@id/tile4_4"
    app:layout_constraintBottom_toTopOf="@id/tile5_3"/>
<ImageView
    android:id="@+id/tile4_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_4"
    app:layout_constraintLeft_toRightOf="@id/tile4_3"
    app:layout_constraintRight_toLeftOf="@id/tile4_5"
    app:layout_constraintBottom_toTopOf="@id/tile5_4"/>
<ImageView
    android:id="@+id/tile4_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_5"
    app:layout_constraintLeft_toRightOf="@id/tile4_4"
    app:layout_constraintRight_toLeftOf="@id/tile4_6"
    app:layout_constraintBottom_toTopOf="@id/tile5_5"/>
<ImageView
    android:id="@+id/tile4_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile3_6"
    app:layout_constraintLeft_toRightOf="@id/tile4_5"
    app:layout_constraintRight_toLeftOf="@id/rightSide"
    app:layout_constraintBottom_toTopOf="@id/tile5_6"/>
<!-- Row 5 -->

<ImageView
    android:id="@+id/tile5_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_1"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile5_2"
    app:layout_constraintBottom_toTopOf="@id/tile6_1"/>
<ImageView
    android:id="@+id/tile5_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_2"
    app:layout_constraintLeft_toRightOf="@id/tile5_1"
    app:layout_constraintRight_toLeftOf="@id/tile5_3"
    app:layout_constraintBottom_toTopOf="@id/tile6_2"/>
<ImageView
    android:id="@+id/tile5_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_3"
    app:layout_constraintLeft_toRightOf="@id/tile5_2"
    app:layout_constraintRight_toLeftOf="@id/tile5_4"
    app:layout_constraintBottom_toTopOf="@id/tile6_3"/>
<ImageView
    android:id="@+id/tile5_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_4"
    app:layout_constraintLeft_toRightOf="@id/tile5_3"
    app:layout_constraintRight_toLeftOf="@id/tile5_5"
    app:layout_constraintBottom_toTopOf="@id/tile6_4"/>
<ImageView
    android:id="@+id/tile5_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_5"
    app:layout_constraintLeft_toRightOf="@id/tile5_4"
    app:layout_constraintRight_toLeftOf="@id/tile5_6"
    app:layout_constraintBottom_toTopOf="@id/tile6_5"/>
<ImageView
    android:id="@+id/tile5_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile4_6"
    app:layout_constraintLeft_toRightOf="@id/tile5_5"
    app:layout_constraintRight_toLeftOf="@id/rightSide"
    app:layout_constraintBottom_toTopOf="@id/tile6_6"/>
<!-- Row 6 -->

<ImageView
    android:id="@+id/tile6_1"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_1"
    app:layout_constraintLeft_toRightOf="@id/leftSide"
    app:layout_constraintRight_toLeftOf="@id/tile6_2"
    app:layout_constraintBottom_toBottomOf="parent"/>
<ImageView
    android:id="@+id/tile6_2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_2"
    app:layout_constraintLeft_toRightOf="@id/tile6_1"
    app:layout_constraintRight_toLeftOf="@id/tile6_3"
    app:layout_constraintBottom_toBottomOf="parent"/>
<ImageView
    android:id="@+id/tile6_3"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_3"
    app:layout_constraintLeft_toRightOf="@id/tile6_2"
    app:layout_constraintRight_toLeftOf="@id/tile6_4"
    app:layout_constraintBottom_toBottomOf="parent"/>
<ImageView
    android:id="@+id/tile6_4"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_4"
    app:layout_constraintLeft_toRightOf="@id/tile6_3"
    app:layout_constraintRight_toLeftOf="@id/tile6_5"
    app:layout_constraintBottom_toBottomOf="parent"/>
<ImageView
    android:id="@+id/tile6_5"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_5"
    app:layout_constraintLeft_toRightOf="@id/tile6_4"
    app:layout_constraintRight_toLeftOf="@id/tile6_6"
    app:layout_constraintBottom_toBottomOf="parent"/>
<ImageView
    android:id="@+id/tile6_6"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:src="@drawable/box"
    android:scaleType="fitXY"
    app:layout_constraintHorizontal_weight="2"
    app:layout_constraintVertical_weight="2"
    app:layout_constraintTop_toBottomOf="@id/tile5_6"
    app:layout_constraintLeft_toRightOf="@id/tile6_5"
    app:layout_constraintRight_toLeftOf="@id/rightSide"
    app:layout_constraintBottom_toBottomOf="parent"/>

<ImageView
    android:id="@+id/player"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:srcCompat="@drawable/player"
    app:layout_constraintTop_toTopOf="@id/tile1_2"
    app:layout_constraintBottom_toBottomOf="@id/tile1_2"
    app:layout_constraintRight_toRightOf="@id/tile1_2"
    app:layout_constraintLeft_toLeftOf="@id/tile1_2"/>

</android.support.constraint.ConstraintLayout>

我想我需要操作这部分,但是在 Java 文件中。

app:layout_constraintTop_toTopOf="@id/tile1_2"
app:layout_constraintBottom_toBottomOf="@id/tile1_2"
app:layout_constraintRight_toRightOf="@id/tile1_2"
app:layout_constraintLeft_toLeftOf="@id/tile1_2"

我尚未完成的应用程序图片:

您可以使用 ConstraintSet 在代码中操纵约束。将您的播放器移动到 ID 为 tile1_3ImageView 的示例代码如下所示:

    ConstraintLayout layout = findViewById(R.id.constLayout);
    ImageView player = findViewById(R.id.player);
    ImageView target = findViewById(R.id.tile1_3);

    ConstraintSet constraintSet = new ConstraintSet();
    constraintSet.clone(layout);
    constraintSet.connect(player.getId(), ConstraintSet.START, target.getId(), ConstraintSet.START);
    constraintSet.connect(player.getId(), ConstraintSet.END, target.getId(), ConstraintSet.END);
    constraintSet.connect(player.getId(), ConstraintSet.TOP, target.getId(), ConstraintSet.TOP);
    constraintSet.connect(player.getId(), ConstraintSet.BOTTOM, target.getId(), ConstraintSet.BOTTOM);
    constraintSet.applyTo(layout);