[android] CardView의 그리드 뷰 표현

15 Dec 2023

android

안드로이드 앱을 개발하다 보면 CardView를 사용하여 그리드 뷰를 구현해야 할 때가 있습니다. CardView는 그리드 뷰 안에서 아이템을 표현하기에 적합한 디자인 요소이며, 사용자에게 아름답고 일관된 UI를 제공합니다.

1. CardView 및 그리드 레이아웃 추가

먼저 build.gradle 파일에 다음 디펜던시를 추가합니다.

dependencies {
    implementation 'androidx.cardview:cardview:1.0.0'
}

다음으로 레이아웃 XML 파일에서 그리드 레이아웃과 CardView를 추가합니다.

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="2">

    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1">

        <!-- Card content goes here -->

    </androidx.cardview.widget.CardView>

    <!-- 다른 CardView 아이템들 -->

</GridLayout>

2. CardView에 콘텐츠 추가

각 CardView에 원하는 콘텐츠를 추가합니다. 예를 들어, 이미지, 텍스트, 버튼 등을 포함할 수 있습니다.

<androidx.cardview.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_columnWeight="1"
    android:layout_rowWeight="1">

    <ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/my_image" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Card title" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Click me" />

</androidx.cardview.widget.CardView>

이제 CardView를 포함한 그리드 레이아웃을 제대로 표현할 수 있습니다.

결론

CardView를 이용하여 안드로이드 앱에서 그리드 뷰를 구현하는 방법을 소개했습니다. CardView를 사용하면 보기 쉽고 사용자 친화적인 인터페이스를 만들 수 있으며, 다양한 형태의 콘텐츠를 포함할 수 있습니다. 안드로이드 개발에 있어서 그리드 뷰를 구현해야 할 때는 CardView를 고려해보세요.

참고 자료: