ImageView 不保持响应

ImageView Not staying responsive

我正在尝试制作一个 10x10 的西洋跳棋游戏,棋盘在 3d 位置有点倾斜。当 40 块棋子在真实设备中排列在棋盘上时,它会停留在正确的方格中。当我在不同的设备上测试相同的代码时,它会移出它们的方块。如何让格子在所有设备上都不会移出正方形

<?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/bkkg"
    tools:context=".New_GameActivity">

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/buard" />

    <ImageView
        android:id="@+id/square1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        android:layout_weight="1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.095"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.930"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.270"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.930"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square3"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.440"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.930"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square4"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.612"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.93"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square5"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.825"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.93"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square6"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.020"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.810"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square7"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.188"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.812"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square8"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.358"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.812"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square9"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.527"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.812"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square10"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.690"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.812"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

    <ImageView
        android:id="@+id/square11"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="116dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_percent="0.09"
        app:layout_constraintHorizontal_bias="0.111"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.692"
        app:layout_constraintWidth_percent="0.05"
        app:srcCompat="@drawable/square" />

   
</androidx.constraintlayout.widget.ConstraintLayout>

I havent implemented anything on the Mainactivity yet.

您在使用水平和垂直偏差的正确轨道上。问题是您将片段限制在父视图 (ConstraintLayout) 并且该父视图将更改其大小和纵横比。只需在横向和纵向模式之间更改方向即可查看情况如何变化(即在方形设备上除外。)

要解决此问题以便布局可以适应各种屏幕,请按您的要求定义电路板布局。现在拿起棋子并将它们限制在棋盘的开始、顶部、末端和底部。完成后,调整棋子的偏差可以将其移动到棋盘上的任何位置。根据您绘制棋盘的方式,您可能需要一些额外的余量才能使其正确。这也假设正方形位置是规则间隔的。

这是一个示例布局:

<androidx.constraintlayout.widget.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/board"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/checkerboard" />

    <ImageView
        android:id="@+id/checker1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_margin="28dp"
        app:layout_constraintVertical_bias="0.0"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintBottom_toBottomOf="@id/board"
        app:layout_constraintEnd_toEndOf="@id/board"
        app:layout_constraintStart_toStartOf="@id/board"
        app:layout_constraintTop_toTopOf="@id/board"
        app:srcCompat="@drawable/checker" />

    <ImageView
        android:id="@+id/checker2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_margin="28dp"
        app:layout_constraintVertical_bias="0.14"
        app:layout_constraintHorizontal_bias="0.14"
        app:layout_constraintBottom_toBottomOf="@id/board"
        app:layout_constraintEnd_toEndOf="@id/board"
        app:layout_constraintStart_toStartOf="@id/board"
        app:layout_constraintTop_toTopOf="@id/board"
        app:srcCompat="@drawable/checker" />

    <ImageView
        android:id="@+id/checker3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_margin="28dp"
        app:layout_constraintVertical_bias="0.28"
        app:layout_constraintHorizontal_bias="0.28"
        app:layout_constraintBottom_toBottomOf="@id/board"
        app:layout_constraintEnd_toEndOf="@id/board"
        app:layout_constraintStart_toStartOf="@id/board"
        app:layout_constraintTop_toTopOf="@id/board"
        app:srcCompat="@drawable/checker" />

    <ImageView
        android:id="@+id/checker4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:layout_margin="28dp"
        app:layout_constraintVertical_bias="0.28"
        app:layout_constraintHorizontal_bias="0.43"
        app:layout_constraintBottom_toBottomOf="@id/board"
        app:layout_constraintEnd_toEndOf="@id/board"
        app:layout_constraintStart_toStartOf="@id/board"
        app:layout_constraintTop_toTopOf="@id/board"
        app:srcCompat="@drawable/checker" />

    <ImageView
        android:id="@+id/checker5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="28dp"
        app:layout_constraintVertical_bias="0.43"
        app:layout_constraintHorizontal_bias="0.57"
        app:layout_constraintBottom_toBottomOf="@id/board"
        app:layout_constraintEnd_toEndOf="@id/board"
        app:layout_constraintStart_toStartOf="@id/board"
        app:layout_constraintTop_toTopOf="@id/board"
        app:srcCompat="@drawable/checker" />
</androidx.constraintlayout.widget.ConstraintLayout>

如下所示:

现在是Android Studio 设计师,我将抓取第一个片段并更改垂直和水平偏差以在屏幕上移动它。

根据您的棋盘,您可能需要进行一些调整以移动棋盘内指定的棋子位置。也许你的棋盘不 top-bottom/left-right 对称。在最坏的情况下,您可以为数组中的每个正方形定义偏置量并使用它。