Front-End/Kotlin

[Kotlin] Dialog

psy_er 2024. 4. 22. 03:34
728x90

[Kotlin] Dialog

 

<토스트 메시지 띄우기>

 

토스트는 화면 아래쪽에 잠깐 보였다가 사라지는 문자열이다.

토스트는 Toast의 makeText() 함수로 만듭니다.

open static fun makeText(context: Context!, text:CharSequence!, duration: Int): Toast!

 

세번째 매개변수는 토스ㅌ가 화면에 출력되는 시간을 뜻한다.

val LENGTH_LONG: Int
val LENGTH_SHORT: Int

 

토스트 출력 예

val toast = Toast.makeText(this, "종료하려면 한번 더 누르세요", Toast.LENGTH_SHORT)
toast.show()

 

 

< 날짜 또는 시간 입력받기 >

날짜를 입력받을 때는 DatePickerDialog를, 시간을 입력받을 때는 TimePickerDialog를 사용

사용자가 설정한 날짜를 콜백 함수로 얻을 수 있습니다.

 

- 데이트 피커 다이얼로그 사용 예

month : 0~11 주의

DatePickerDialog(this, object: DatePickerDialog.OnDateSetListener){
   overrid fun onDateSet(p0: DatePicker?, p1: Int, p2:Int, p3: Int){
      Log.d("kkang", "year : $p1, month : ${p2+1}, dayOfMonth : $p3")
   }
}, 2020, 8, 21).show()

 

- 타임 피커 다이얼로그 사용 예

true : 24시간 주의

TimePickerDialog(this, object: TimePickerDialog.OnTimeSetListener){
   override fun onTimeSet(p0: TimePicker?, p1: Int, p2: Int){
      Log.d("kkang", "time : $p1, minute : &p2")
   }
}, 15, 0, true).show()

 

 

< 알림 창 띄우기 >

 

다이얼로그의 기본은 AlertDialog이다.

제목, 내용, 버튼 영역으로 구분한다.

 

AlertDialog.Builder를 제공하므로 이 빌더를 이용해 알림 창을 만든다.

open fun setIcon(iconId: int):AlertDialog.Builder!
open fun setTitle(title: CharSequence!): AlertDialog.Builder!
open fun setMessage(message:CharSequence!): AlertDialog.Builder!

 

알림 창에 버튼을 지정하는 함수

open fun setPositiveButton(text: CharSequence!, listener: DialogInterface.OnClick Listener!): AlertDialog.Builder!
open fun setNegativeButton(text: CharSequence!, listener: DialogInterface.OnClick Listener!):
AlertDialog.Builder!
open fun setNeutralButton(text: CharSequence!, listener: DialogInterface.OnClick Listener!):
AlertDialog.Builder!

 

알림 창 띄우기

AlertDialog.Builder(this).run {
   setTitle("test dialog")
   setIcon(android.R.drawable.ic_dialog_info)
   show()
}

 

 

< 목록을 제공하고 이 중 하나를 선택받는 알림 창을 만들기 >

setItems()

setMultiChoiceItems(),

setSingleChoiceItems() 함수를 이용

open fun setItems(items: Array<CharSequence!>, listener: DialogInterface.On ClickListener!): AlertDialog.Builder!

open fun setMultiChoiceItems(items: Array<CharSequence!>!, checkedItems: BooleanArray!, listener:DialogInterface. OnMultiChoiseClickListener!): AlertDialog.Builder!

open fun setSingleChoiceItems(items: Array<CharSequence!>, checkedItem: Int, listener:DialogInterface.OnClickListener!): AlertDialog.Builder!

 

setItems() 목록을 출력하는 알림 창

val items = arrayOf<String>("사과", "복숭아", "수박", "딸기")
AlertDialog.Builder(this).run{
   setTitle("items test")
   setIcon(android.R.drawable.ic_dialog_info)
   setItems(items, object: DialogInterface.OnClickListener{
      overrid fun onClick(p0: DialogInterface?, p1:Int){
         Log.d("kkang", "선택한 과일 : ${items[p1]}")
      }
   })
   setPositiveButton("닫기", null)
   show()
}

 

 

setMultiChoiceItems() 다중 선택을 위한 체크박스가 함께 출력되는 항목

setMultiChoiceItems(items, booleanArrayOf(true, false, true, false), object:DialogInterface.OnMultiChoiceClickListener{
   override fun onClick(p0: DialogInterface?, p1: Int, p2: Boolean){
      Log.d("kkang", "${items[p1]} 이${if(p2) "선택되었습니다." else "선택해제되었습니다"}")
   }
})

 

 

setSingleChoiceItems() 함수는 하나만 선택할 수 있는 라디오 버튼 항목

setSingleChoiceItems(items, 1, object: DialogInterface.OnClickListener{
   override fun onClick(p0: DialogInterface?, p1: Int){
      Log.d("kkang", "${items[p1]}이 선택되었습니다.")
   }
})

 

 

 

< 다양한 다이얼로그 >

setCancelable() 함수는 사용자가 기기의 뒤로가기 버튼을 눌렀을 때,

setCanceledOnTouchOutside() 함수는 알림 창의 바깥 영역을 터치했을 때 매개변수가

true이면 닫고, false이면 닫지 않는다.

 

AlertDialog.Builder(this).run{
   setTitle("items test")
   setIcon(android.R.drawable.ic_dialog_info)
   setItems(items, object: DialogInterface.OnClickListener{
      overrid fun onClick(p0: DialogInterface?, p1:Int){
         Log.d("kkang", "선택한 과일 : ${items[p1]}")
      }
   })
   setCancelable(false)
   setPositiveButton("닫기", null)
   show()
}.setCanceledOnTouchOutside(false)

 

 

< 커스텀 다이얼로그 만들기 >

커스텀 다이얼로그도 AlertDialog를 이용

LayoutInflater 클래스는 레이아웃 XML 파일을 코드에서 초기화 (전개라고 표현)하는 기능을 제공

 

getSystemService() 함수로 LayoutInflater를 얻습니다.

inflate() 함수를 호출하면서 초기화할 레이아웃 XML 파일 정보를 매개변수로 전달

 

XML 파일 초기화

val inflater = getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
val rootView = inflater.inflate(R.layout.activity_one, null)

 

뷰 바인딩 기법을 이용한다면 XML 초기화 코드를 조금 더 쉽게 작성

val binding = ActivityOneBinding.inflate(layoutInflater)
val rootView = binding.root

 

 

다이얼로그를 구성하는 레이아웃 XML 파일을 만들어야 합니다.

이 XML 파일을 LayoutInflater로 초기화해서 다이얼로그에 적용

Alert Dialog의 setView() 함수에 매개변수로 뷰 객체를 전달하면 창의 내용 영역에 출력

 

val dialogBinding = DialogInputBinding.inflate(layoutInflater)
AlertDialog.Builder(this).run{
	setTitle("Input")
    setView(dialogBinding.root)
    setPositiveButton("닫기", null)
    show()
}

 

728x90