Android Dialogs Nedir?

Bir mobil uygulama geliştirirken önemsediğimiz başlıca iki konu uygulamanın görsel tasarımı ve işlevselliği oluyor.İşlevselliği artıran en önemli niteliklerden biri ise uygulamanın interaktif-dinamik olması.Yani uygulamamız, kullanıcıyla etkileşim içinde ve yönlendirilebilir olmalı.Bu özellikleri uygulamamıza arayüzler üzerinde açılan kutucuklar yani Android Dialogs ile kazandırıyoruz.

Dialog sınıfı dialoglar için temel sınıftır.Ancak; başlık, en fazla üç düğme, seçenekler gibi basit bir iletişim kutusu oluşturmak istediğimizde, doğrudan Dialog sınıfın kullanmak yerine alt sınıfı olan AlertDialog’u kullanıyoruz.

Kısaca AlertDialog ile neler yapabileceğimizden bahsedelim;

• Kullanıcıya anlık mesajlar verebiliriz
• İşlemi yönlendirmesi için seçenekler sunabiliriz
• Saat- tarih bilgisi seçtirebiliriz
• Bir liste gösterip checkBoxlar ile seçim yaptırabiliriz
• Custom AlertDialoglar ile inputlar alabilir dialoğun işlevselliğini artırabiliriz.

+Custom AlertDialog: AlertDialogda özel bir tasarım istediğimizde, tasarladığımız layoutu AlertDialog’un setView metodu ile set eder özel dialoğumuzu oluşturabiliriz.Örneğin kullanıcıdan inputlar almak istediğimiz iki editText ekleyebiliriz.

Not: uygulamanın arka planında gerçekleşen işlemler için kullanıcıya durum bilgisi vermek istediğimizde, (en basit örneği indir butonuna tıkladığıızda yüklenme yüzdesini gösteren kutucuk olacaktır) ProgressDialogu kullanıyorduk.ProgressDialog API 26 üzeri için kullanıcının uygulamayla etkileşimi önlemesi sebebiyle kullanımdan kaldırıldı.Artık bunun yerine ProgressBar widgetını kullanacağız. Nasıl kullanıldığınız Progress Bar Nedir? postumdan okuyabilirsiniz

AlertDialog nasıl kullanılır?

AlertDialog’u nasıl kullandığımız örneğine geçmeden önce birkaç cümleyle kullanım mantığını anlatmak istiyorum.

Öncelikle bir fragment oluşturuyoruz ve bu fragmentı DialogFragment sınıfından extend ediyoruz.DialogFragment’ın onCreateDialog metodunu override ediyoruz ve bu metot içerisinde bir AlertDialog.Builder nesnesi oluşturuyoruz.Bu nesne üzerinden dialog kutumuzun içereceği komponentleri, işlevlerini , değerlerini ve yaşam döngüsünü şekillendiriyoruz.İşte bu kadar :)

Şimdi işin kod kısmına geçelim,kodlamayı Kotlin ile yapacağız.

Görseldeki basit dialog örneğiyle başlayalım.Bir başlığımız, pozitif ve negatif olmak üzere iki butonumuz var.

BasicDialogFragment

class BasicDialogFragment : DialogFragment() {
 
     override fun onCreateDialog(savedInstanceState: Bundle): Dialog {
         return activity?.let {
             val builder = AlertDialog.Builder(it)
             builder.setMessage(R.string.dialog_title)
                     .setPositiveButton(R.string.dialog_positive,
                             DialogInterface.OnClickListener { dialog, id ->
                             // pozitif butona tıkladığımızda olacaklar
                             })
                     .setNegativeButton(R.string.dialog_negative,
                             DialogInterface.OnClickListener { dialog, id ->
                              // negatif butona tıkladığımızda olacaklar
                             })
             builder.create()
         } ?: throw IllegalStateException("Activity cannot be null")
     }
 }

Şimdi bir diğer örneğimize geçelim ve kullanıcıdan görseldeki gibi bir seçim yapmasını isteyelim

SelectItemsDialogFragment

override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
    return activity?.let {
        val builder = AlertDialog.Builder(it)
        builder.setTitle(R.string.pick_color)
                .setItems(R.array.colors_array,
                        DialogInterface.OnClickListener { dialog, which ->
       //buraya itemların index pozisyonlarını ve işlevlerini kodluyoruz
                        })
        builder.create()
    } ?: throw IllegalStateException("Activity cannot be null")
}

Şimdi de kullanıcıya checkBoxlar yardımı ile birden fazla seçim yaptırabildiğimiz bir örnek yapalım

MultiChoiceItemsDialogFragment

override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
    return activity?.let {
        val selectedItems = ArrayList<Int>() //itemlarımızı bir array içine atıyoruz
        val builder = AlertDialog.Builder(it)
        builder.setTitle(R.string.pick_toppings)
                // burada default olarak seçili gelmesini istediğimiz itemları belirtebiliriz,  
                .setMultiChoiceItems(R.array.toppings, null,
                        DialogInterface.OnMultiChoiceClickListener { dialog, which, isChecked ->
                            if (isChecked) {
               //kullanıcı bir itemı tiklediğinde seçilen ögelere ekle
                                selectedItems.add(which)
                            } else if (selectedItems.contains(which)) {
               //kullanıcı itemdan tik kaldırdığında o itemı seçilen ögelerden çıkar
                                selectedItems.remove(Integer.valueOf(which))
                            }
                        })
                // Set the action buttons
                .setPositiveButton(R.string.ok,
                        DialogInterface.OnClickListener { dialog, id ->
                            // Kullanıcı pozitif butona tıkladığında selectedItems sonuçlarıyla yapacaklarımız
                            ...
                        })
                .setNegativeButton(R.string.cancel,
                        DialogInterface.OnClickListener { dialog, id ->
                            ...
                        })

        builder.create()
    } ?: throw IllegalStateException("Activity cannot be null")
}

Son olarak görseldeki custom AlertDialog örneği yapalım ve kullanıcıdan iki input isteyelim.Bunun için önce bir layout tasarlayacağız ve xml dosyamızı setView ile set edeceğiz.

customDialogFragment

res/layout/custom_dialog.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:src="@drawable/header_logo"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:scaleType="center"
        android:background="#FFFFBB33"/>
    <EditText
        android:id="@+id/username"
        android:inputType="textEmailAddress"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginBottom="4dp"
        android:hint="@string/username" />
    <EditText
        android:id="@+id/password"
        android:inputType="textPassword"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginBottom="16dp"
        android:fontFamily="sans-serif"
        android:hint="@string/password"/>
</LinearLayout>

.

override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
    return activity?.let {
        val builder = AlertDialog.Builder(it)
        val inflater = requireActivity().layoutInflater;

        builder.setView(inflater.inflate(R.layout.dialog_signin, null))
                .setPositiveButton(R.string.signin,
                        DialogInterface.OnClickListener { dialog, id ->
                        })
                .setNegativeButton(R.string.cancel,
                        DialogInterface.OnClickListener { dialog, id ->
                            getDialog().cancel()
                        })
        builder.create()
    } ?: throw IllegalStateException("Activity cannot be null")
}

Bu örnekler çoğaltılıp .set metotlarıyla AlertDialoglara farklı işlevler eklenebilir.Buradan diğer özelliklerine bakabilirsiniz.

AlertDialog nasıl çağırılır?

Şuana kadar AlertDialoglarımızı tasarladık.Şimdi sıra bu dialogları çağırmaya geldi.Bunun için bir metot yazacağız, bunu en basit şekilde örneklendireceğim.

CustomDialogFragment’ı çağıralım;

fun showDialog() {
    val fragmentManager = supportFragmentManager
    val newFragment = CustomDialogFragment()
    
        val transaction = fragmentManager.beginTransaction()
        transaction.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN)
       
        transaction
                .add(android.R.id.content, newFragment)
                .addToBackStack(null)
                .commit()
    }
}

İşte böyle, en basit haliyle AlertDialog’ları tanımış olduk.Benim anlatacaklarım bu kadar, umarım işinize yarar.

Kaynak;

Dialogs | Android Developers

Burda olduğunuz için teşekkürler :)