5. 【Android/Kotlin】 다이얼로그(Dialog)

소개



DreamHanks의 MOON입니다.

전회는 「리스트 뷰」라고 하는 View에 대해 설명했습니다.
4. 【Android/Kotlin】리스트뷰(ListView)

이번에는 목록보기의 항목을 클릭하면,
다이얼로그가 표시되어 리스트의 아이템을 삭제할 수 있도록 해 갑니다.

대화상자란?



대화 상자는 사용자의 의사결정 및 추가 정보 입력을 위해 표시되는 작은 창입니다. 대화 상자는 전체 화면에 표시되지 않으며 일반적으로 사용자가 계속 처리하기 전에 작업을 수행해야 하는 모델 이벤트에 사용됩니다.

종류는 대표적으로 AlertDialogDatePickerDialogTimePickerDialog 가 있습니다.
그 중 이번에는 AlertDailog를 사용합니다.

AlertDialog 추가



마지막으로 만든 코드를 사용하여 수정합니다.
전체 코드를 확인하고 싶다면 마지막 링크에서 확인하십시오.

먼저 Activity 파일을 아래와 같이 수정합니다.

ListViewActivity.kt
package com.example.practiceapplication

import android.app.AlertDialog
import android.content.DialogInterface
import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log.d
import android.view.ContextThemeWrapper
import android.widget.*
import kotlinx.android.synthetic.main.activity_listview.*
import javax.xml.validation.Validator

class ListViewActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_listview)

        var userList = arrayListOf<User>(
            User("佐藤","[email protected]"),
            User("鈴木","[email protected]"),
            User("高橋","[email protected]"),
            User("伊藤","[email protected]"),
            User("渡辺","[email protected]"),
            User("山本","[email protected]"),
            User("中村","[email protected]"),
            User("小林","[email protected]"),
            User("加藤","[email protected]")
        )

        var list_view = findViewById<ListView>(R.id.list_view)
        //リストビューのアイテムを変更
        setListView(userList)

        //リストビューのアイテムのクリックイベントを設定
        list_view.setOnItemClickListener { parent, view, position, id ->
            //クリックされたアイテム
            val element = parent.getItemAtPosition(position)

            //ダイアログを生成
            val builder = AlertDialog.Builder(ContextThemeWrapper(this@ListViewActivity, R.style.Theme_AppCompat_Light_Dialog))
            builder.setTitle("ユーザー名")
            //選択されたアイテムがユーザーオブジェクトの場合
            if(element is User){
                //ダイアログの内容にユーザー名を設定
                builder.setMessage(element.name)
            }
            //確認ボタンを追加(確認ボタンは単純に確認機能)
            builder.setPositiveButton("確認", DialogInterface.OnClickListener { dialog, which ->
            })
            //削除ボタンを追加
            builder.setNegativeButton("削除", DialogInterface.OnClickListener { dialog, which ->
                //ユーザーリストで選択されたアイテムを削除
                userList.remove(element)

                //リストビューのアイテムを変更
                setListView(userList)
            })

            builder.show()
        }
    }

    fun setListView(userList: ArrayList<User>){
        //アダプターにリストを設定
        val Adapter = ListAdapter(this, userList)
        //リストビューにアダプターを設定
        list_view.adapter = Adapter
    }
}

추가분



・리스트 뷰의 아이템 클릭 이벤트 설정
        //リストビューのアイテムのクリックイベントを設定
        list_view.setOnItemClickListener { parent, view, position, id ->
            //クリックされたアイテム
            val element = parent.getItemAtPosition(position)

            //ダイアログを生成
            val builder = AlertDialog.Builder(ContextThemeWrapper(this@ListViewActivity, R.style.Theme_AppCompat_Light_Dialog))
            builder.setTitle("ユーザー名")
            //選択されたアイテムがユーザーオブジェクトの場合
            if(element is User){
                //ダイアログの内容にユーザー名を設定
                builder.setMessage(element.name)
            }
            //確認ボタンを追加(確認ボタンは単純に確認機能)
            builder.setPositiveButton("確認", DialogInterface.OnClickListener { dialog, which ->
            })
            //削除ボタンを追加
            builder.setNegativeButton("削除", DialogInterface.OnClickListener { dialog, which ->
                //ユーザーリストで選択されたアイテムを削除
                userList.remove(element)

                //リストビューのアイテムを変更
                setListView(userList)
            })

            builder.show()
        }

· 리스트 뷰에 어댑터 설정
    fun setListView(userList: ArrayList<User>){
        //アダプターにリストを設定
        val Adapter = ListAdapter(this, userList)
        //リストビューにアダプターを設定
        list_view.adapter = Adapter
    }

①리스트 뷰에 아이템 클릭 이벤트를 설정합니다.
② 이벤트내에 다이얼로그를 생성합니다.
③ 다이얼로그에 타이틀을 설정, 메시지에는 선택한 아이템의 이름을 설정합니다.
④확인 버튼을 설정하고, 확인 버튼은 다른 설정은 불필요합니다.
⑤ 삭제 버튼을 설정하고 삭제 버튼은 사용자 목록의 사용자 중에서 선택한 사용자를 삭제합니다.
⑥ 마지막으로 리스트뷰로 변경한 사용자에게 스트의 어댑터를 설정합니다.

앱 시작



・초기 화면

・사토씨를 클릭했을 경우

・사토씨로부터 이토까지 삭제했을 경우


끝에



이번에는 「다이얼로그」에 대해 설명했습니다.

다음 번은 「스피너」에 대해 설명해 갑니다.
6. 【Android/Kotlin】 스피너(Spinner)

최신 내용은 아래 링크(DreamHanks의 블로그)에서 확인할 수 있습니다.
DreamHanks 블로그(Android/Kotlin 앱 개발)

좋은 웹페이지 즐겨찾기