ANDROID KOTLIN'de Özel MaterialAlertDialogBuilder Oluşturun

Merhaba Okurlar, umarım hepiniz iyisinizdir. Bu yüzden bugün kotlin'de MaterialAlertDialogBuilder'ın nasıl oluşturulacağını öğreneceğiz.

Başlayalım :

Adım 1: build.Gradle'a Bağımlılık ekleyin

// Material Dialogs
implementation "com.afollestad.material-dialogs:core:3.0.0-rc1
// Material theme
implementation "com.google.android.material:material:1.4.0-rc01"

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/fab_ofdialog"
    android:layout_width="55dp"
    android:layout_height="55dp"
    android:layout_marginBottom="16dp"
    android:backgroundTint="#FF0000"
    android:src="@drawable/fab_location"
    app:rippleColor="#ff492d"
    app:iconTint="#ffffff"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.954"
    app:layout_constraintStart_toStartOf="parent" />

1. backgroundTint , floatAction Düğmesinin arka plan rengini ayarlamak için kullanılır.
2. rippleColor , kullanıcılar düğmeye tıkladığında dalgalanma efektinin oluşacağı ve kendi renk seçiminizden herhangi birini ayarlayabileceğiniz anlamına gelir.
3. iconTint aracılığıyla simgenin rengini değiştirebilirsiniz .

Oluştur custom_fragment.xml biz kendi UI yaratacak bu XML. Lütfen kodu kopyalayın.

<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <androidx.appcompat.widget.AppCompatImageView
        android:id="@+id/iv_locationIcon"
        android:layout_width="45dp"
        android:layout_height="45dp"
        android:src="@drawable/location1"
        android:layout_marginTop="18dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <com.google.android.material.textview.MaterialTextView
        android:id="@+id/tv_DeviceLocationIsOff"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="18dp"
        android:textStyle="bold|normal"
        android:textSize="18sp"
        android:textColor="?android:attr/textColorPrimary"
        android:hint="@string/device_location_is_off"
        app:layout_constraintEnd_toEndOf="@+id/iv_locationIcon"
        app:layout_constraintStart_toStartOf="@+id/iv_locationIcon"
        app:layout_constraintTop_toBottomOf="@+id/iv_locationIcon" />

    <com.google.android.material.textview.MaterialTextView
        android:id="@+id/tv_messageToTurnOn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textStyle="bold"
        android:textColor="?android:attr/textColorSecondary"
        android:layout_marginTop="8dp"
        android:hint="@string/please_turn_on_your_device_location_to_ensure_hassele_free_experience"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tv_DeviceLocationIsOff" />

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btn_turnOnDeviceLoc"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:backgroundTint="#ffffff"
        android:layout_marginTop="8dp"
        android:hint="@string/deviceLocation"
        app:icon="@drawable/ic_turn_on_device_loc"
        app:iconPadding="4dp"
        android:textColor="#000000"
        app:iconGravity="start"
        app:elevation="2dp"
        app:rippleColor="#ff492d"
        app:iconTint="#FF0000"
     style="@style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/tv_messageToTurnOn" />

    <com.google.android.material.button.MaterialButton
        android:id="@+id/btn_turnManuallyOnDeviceLoc"
    style="@style/Widget.MaterialComponents.Button.OutlinedButton.Icon"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:backgroundTint="#ffffff"
        android:hint="@string/manually"
        android:textColor="#000000"
        android:layout_marginBottom="18dp"
        app:elevation="2dp"
        app:icon="@drawable/search"
        app:iconGravity="start"
        app:rippleColor="#ff492d"
        app:iconTint="#FF0000"
        app:iconPadding="4dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toBottomOf="@+id/btn_turnOnDeviceLoc" />

</androidx.constraintlayout.widget.ConstraintLayout>

      

Şimdi gidin HomeFragment.kt ve onViewCreate kodu altında yapıştırın.

//1
fabOfdialog.setOnClickListener {
//2
        val mview = LayoutInflater.from(requireActivity())
            .inflate(R.layout.custom_dialouge, null, false)
//3   val dialog = MaterialAlertDialogBuilder(requireContext())
            .setView(mview)
            .setCancelable(true)
            .setBackground(resources.getDrawable(R.drawable.radius))
            .create()

//4       mview.btn_turnOnDeviceLoc.setOnClickListener {
    Toast.makeText(requireContext(),"You have clicked First  Button",Toast.LENGTH_SHORT).show()
    
// when user click and button and you want to close dialog so you //can use this if not you can remove this dialoge.dismiss()
dialog.dismiss()
//5       mview.btn_turnManuallyOnDeviceLoc.setOnClickListener {
    Toast.makeText(requireContext(),"You have clicked Second Button",Toast.LENGTH_SHORT).show()
    dialog.dismiss()
  
        }
        dialog.show()
    }

}

1. İlk olarak, kullanıcı FAB(FloatingActionButton) üzerine tıkladığında, küme parantezlerinin içine girecektir.
2. Düzenin görünür olması için özel düzeni şişirmemiz gerekiyor.
3. Adı verilen bir yöntem yoktur bir MaterialCustom Diyalog oluşturmak için MaterialAlertDialogBuilder ve parametre bağlamı geçmektedir.

//This will set the view and here view is our custom layout.
.setView(mview)
.setCancelable(true) // If we click anywhere outside the dialoge it will close.
.setBackground(resources.getDrawable(R.drawable.radius)) //Set BackGround color.
.create() //This will create the MaterialDialoge.

//Correct way, Here we are telling that this button is from custom layout. we are giving reference of button.
mview.btn_turnOnDeviceLoc.setOnClickListener {}
//InCorrect way, Here we are not providing the reference it will cost you an error.
btn_turnOnDeviceLoc.setOnClickListener {}

Gelecek Makalede daha birçok şey öğreneceğiz. BAĞLI KALIN ve ÖĞRENMEYE DEVAM EDİN☺😎😁.

Herhangi bir şüpheniz veya öneriniz varsa yorum yapmaktan çekinmeyin.

Ayrıca Twitter ve Instagram'da arkadaş olalım .

Teşekkürler You.