[Kotlin][Android] Bottom Sheet Dialog

1. Gradle(meterial design 종속성 추가)

안드로이드 기본 라이브러리에서는 Bottom Sheet 다이얼로그를 제공하지 않는다.

대신, Meterial Design 라이브러리에서 컴포넌트를 사용할 수 있다. 따라서 아래와 같이 앱 레벨 gradle 폴더에 종속성을 추가해 주자.

implementation 'com.google.android.material:material:1.5.0-alpha02'

2. BottomSheet.kt

BottomSheetDialogFragment를 상속 받고 inflate 해주면 된다.

추가로 하단 확인버튼이 클릭 되었을때 다이얼로그가 꺼지도록 처리했다.

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Button
import com.google.android.material.bottomsheet.BottomSheetDialogFragment

class BottomSheet() : BottomSheetDialogFragment() {

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        super.onCreateView(inflater, container, savedInstanceState)
        return inflater.inflate(R.layout.dialog_bottom_sheet, container, false)
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        view?.findViewById<Button>(R.id.button_bottom_sheet)?.setOnClickListener {
            dismiss()
        }
    }
}

3. dialog_bottom_sheet.xml

BottomSheetDialogFramgment를 상속 받은 코드에 inflate 되면 자동으로 크기가 조절된다.

<?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:orientation="vertical"
    android:paddingHorizontal="32dp"
    android:paddingTop="24dp"
    android:paddingBottom="40dp">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:text="Bottom Sheet"
        android:textColor="@android:color/black"
        android:textSize="24sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:text="내용을 수정하여 활용해 보세요."
        android:textColor="@android:color/black"
        android:textSize="16sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:text="더 자세한 설명을 넣을 수도 있습니다.~!"
        android:textColor="@android:color/black"
        android:textSize="16sp" />

    <Button
        android:id="@+id/button_bottom_sheet"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textColor="@android:color/black"
        android:backgroundTint="@color/purple_200"
        android:textStyle="bold"
        android:text="확인"
        />

</LinearLayout>

4. MainActivity.kt

버튼이 클릭 되었을때 인스턴스를 생성해서 show 함수를 호출해주면 된다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        findViewById<Button>(R.id.button).setOnClickListener {
            val bottomSheet = BottomSheet()
            bottomSheet.show(supportFragmentManager, bottomSheet.tag)
        }
    }
}

5. activity_main.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:gravity="center">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Bottom Sheet" />

</LinearLayout>

에러

The minCompileSdk (31) specified in a
dependency's AAR metadata (META-INF/com/android/build/gradle/aar-metadata.properties)
is greater than this module's compileSdkVersion (android-30).
Dependency: androidx.core:core-ktx:1.7.0.
AAR metadata file: C:\Users\leebbr\.gradle\caches\transforms-2\files-2.1\8f6020352678293cdfe7aa6a7fd63f93\jetified-core-ktx-1.7.0\META-INF\com\android\build\gradle\aar-metadata.properties.

위와같은 에러가 날 경우 추가해주기

configurations.all {
    resolutionStrategy { force 'androidx.core:core-ktx:1.6.0' }
}