Как центрировать элементы в gridLayout

Question

У меня есть сетка (3 столбца и 3 строки). Я пытаюсь поместить изображение в центр каждого квадрата сетки .Я немного поигрался со значениями полей и получил то, что хотел, в представлении дизайна Activity_main.xml Но когда я запускаю приложение на своем телефоне, изображения не располагаются в правильных местах. вот так это выглядит в моем телефоне .

Я не знаю, что я сделал не так.Я новичок в этом, поэтому все может быть не так на самом деле.Вот код активности_основной.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="360dp"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:columnCount="3"
        android:rowCount="3"
        android:background="@drawable/board"
        android:layout_alignParentEnd="true"
        android:id="@+id/gridLayout">

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView"
            android:layout_row="0"
            android:layout_column="0"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginBottom="10dp"
            android:onClick="dropIn"
            android:tag="0" />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView2"
            android:layout_row="0"
            android:layout_column="1"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="25dp"
            android:onClick="dropIn"
            android:tag="1" />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView3"
            android:layout_row="0"
            android:layout_column="2"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="25dp"
            android:onClick="dropIn"
            android:tag="2" />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView4"
            android:layout_row="1"
            android:layout_column="0"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="24dp"
            android:onClick="dropIn"
            android:tag="3"   />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView5"
            android:layout_row="1"
            android:layout_column="1"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="24dp"
            android:onClick="dropIn"
            android:tag="4" />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView6"
            android:layout_row="1"
            android:layout_column="2"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="24dp"
            android:onClick="dropIn"
            android:tag="5"   />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView7"
            android:layout_row="2"
            android:layout_column="0"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="30dp"
            android:onClick="dropIn"
            android:tag="6" />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView8"
            android:layout_row="2"
            android:layout_column="1"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="30dp"
            android:onClick="dropIn"
            android:tag="7"   />

        <ImageView
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:id="@+id/imageView9"
            android:layout_row="2"
            android:layout_column="2"
            android:layout_marginLeft="25dp"
            android:layout_marginTop="30dp"
            android:onClick="dropIn"
            android:tag="8" />

    </GridLayout>

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#fffaff0b"
        android:padding="30dp"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/playAgainLayout"
        android:visibility="invisible">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Text"
            android:id="@+id/winnerMessage"
            android:layout_gravity="center_horizontal"
            android:textSize="30sp" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Play Again"
            android:id="@+id/playAgainButton"
            android:layout_gravity="center_horizontal"
            android:onClick="playAgain" />
    </LinearLayout>
</RelativeLayout>

Заранее благодарим за помощь.

Answer 1

Для данных xml-файлов и измерений вы не можете добиться того, что требуется, поскольку вы используете жестко закодированные размеры и фоновое изображение может иметь одно разрешение, например xhdpi или xxhdpi.Что вам нужно сделать, это сначала создать размеры для разных разрешений, а затем создать разные изображения для разных разрешений для фонового изображения, которое будет привязано к определенному экрану.

Вы можете использовать альтернативный XML-файл, который я изменил, чтобы получитьПриведенные выше критерии и измените их соответствующим образом, а ниже XML-файл будет использовать жестко закодированные размеры, но вы можете обновить его позже.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:gravity="center"
android:orientation="vertical">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="vertical">

    <LinearLayout
        android:id="@+id/linRow1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/imgView1"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView2"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView3"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />


    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@android:color/background_dark" />

    <LinearLayout
        android:id="@+id/linRow2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/imgView4"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView5"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView6"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />


    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@android:color/background_dark" />


    <LinearLayout
        android:id="@+id/linRow3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/imgView7"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView8"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <View
            android:layout_width="2dp"
            android:layout_height="90dp"
            android:background="@android:color/background_dark" />

        <ImageView
            android:id="@+id/imgView9"
            android:layout_width="90dp"
            android:layout_height="90dp"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />


    </LinearLayout>

</LinearLayout>

<LinearLayout
    android:id="@+id/playAgainLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="#fffaff0b"
    android:orientation="vertical"
    android:padding="30dp"
    android:visibility="invisible">

    <TextView
        android:id="@+id/winnerMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="New Text"
        android:textSize="30sp" />

    <Button
        android:id="@+id/playAgainButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:onClick="playAgain"
        android:text="Play Again" />
</LinearLayout>

Answer 2

вам нужно изменить ширину вашего изображения, а также добавить одно свойство

  android:adjustViewBounds="true"

во все ваши изображения

, потому что вы определяете

 android:layout_height="360dp" 

GridLayout и выустановите высоту просмотра изображений в ширину = 90

, но весь экран не квадратный, поэтому ваш GridLayout создает прямоугольник, а ваш просмотр изображений квадратный, то есть ваш просмотр изображений (квадрат) не помещается в сетку (прямоугольник)

ширина просмотра изображения должна бытьтакая же или меньшая ширина сетки