Как отобразить изображения в сетке на виде карты?

#android #xml #android-layout #android-cardview #android-gridlayout

Вопрос:

Я пытаюсь отобразить изображения на виде карты, как показано на рисунке ниже:

введите описание изображения здесь

Вот мой код, но при запуске я могу просто видеть вид карты, изображения и текст не отображаются.

   <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardCornerRadius="8dp"
                app:cardUseCompatPadding="true"
                android:layout_gravity="center_horizontal"
                app:cardBackgroundColor="@color/white"
                app:cardElevation="5dp"
                >
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="10dp"
                        android:layout_marginTop="10dp"
                        android:fontFamily="@font/allerta"
                        android:text="Search by Speciality"
                        android:textSize="16sp"
                        android:textColor="@color/icontintblack" />

                    <GridLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="20dp"
                        android:columnCount="3"
                        android:rowCount="6">

                            <RelativeLayout
                                android:id="@ id/rlDermatologist"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="fill"
                                android:layout_columnWeight="1"
                                android:layout_rowWeight="1">

                                <de.hdodenhof.circleimageview.CircleImageView
                                    android:id="@ id/imgDerm"
                                    android:layout_width="60dp"
                                    android:layout_height="60dp"
                                    android:src="@drawable/ic_derma"
                                    app:civ_border_width="1dp"
                                    app:civ_border_color="@color/e_cure_blue"
                                    android:layout_centerHorizontal="true"/>

                                <TextView
                                    android:layout_below="@ id/imgDerm"
                                    android:layout_centerHorizontal="true"
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:textSize="16sp"
                                    android:text="SkinnSpecialist"
                                    android:textAlignment="center"/>

                            </RelativeLayout>
                    </GridLayout>
</androidx.cardview.widget.CardView>

 

Я попытался реализовать элементы сетки (изображение и текстовое представление) с линейной компоновкой, и они были видны, но при линейной компоновке дизайн не реагирует, а изображение и текстовое представление не выровнены по центру должным образом.
Я новичок в разработке Android.

Ответ №1:

Для достижения такого типа компоновки вы можете использовать recyclerview с GridLayoutmanager или StaggerLayoutManager

Если вы используете GridLayout, вам нужно добавить одно представление, как указано в GridLayout . Для получения информации о GridLayout Проверьте эту ссылку