In this post, we’ll learn about full screen dialog fragment Android. For better understanding, I will create a sample app that app contains full screen dialog in Android. Additionally, we’ll learn how to pass data dialog to fragment or also. So let’s get started.
Full Screen Dialog Fragment (Demo App)
1. Open android studio and create a new project
Create a new android project with Kotlin. Once project get synced up open style file from res=>value=>style.xml. Now create a style for app dialog named is DialogTheme
<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> <!-- Set parent theme as app theme. --> <style name="DialogTheme" parent="AppTheme"> <item name="android:windowNoTitle">true</item> <item name="android:windowFullscreen">false</item> <item name="android:windowIsFloating">false</item> </style> </resources>
2. Let’s create a subclass of dialog fragment
Create a new Kotlin class named is FullScreenDialogExample. Here we are passing a CallbackListener inside constructor just for communicating for activity or fragment.
package com.fullscreendialog import android.os.Bundle import android.view.LayoutInflater import android.view.View import android.view.ViewGroup import androidx.fragment.app.DialogFragment import kotlinx.android.synthetic.main.layout_full_screen_dialog.* class FullScreenDialogExample(private val callbackListener: CallbackListener) : DialogFragment() { override fun onCreateView( inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle? ): View? { isCancelable = false return inflater.inflate(R.layout.layout_full_screen_dialog, container, false) } override fun getTheme(): Int { return R.style.DialogTheme } override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) button.setOnClickListener { //send back data to PARENT fragment using callback callbackListener.onDataReceived(editText.text.toString()) // Now dismiss the fragment dismiss() } } }
3. Open layout_full_screen_dialog layout file and put below code
This layout file we are taking one edit text and button. So in this full screen dialog, we will take input from edit text and send back to the parent (activity or fragment where you want )
<?xml version="1.0" encoding="utf-8"?> <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="match_parent" android:background="@drawable/ic_bg_green" android:padding="16dp"> <EditText android:id="@+id/editText" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="32dp" android:background="@color/colorWhite" android:ems="10" android:hint="Type here" android:inputType="textPersonName" android:padding="8dp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/textView2" /> <Button android:id="@+id/button" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="32dp" android:background="@color/colorAccent" android:text="OK" android:textColor="@color/colorWhite" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/editText" /> <TextView android:id="@+id/textView2" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginTop="32dp" android:gravity="center" android:text="This is a full screen dialog example " android:textAllCaps="true" android:textColor="@color/colorWhite" android:textSize="22sp" android:fontFamily="sans-serif-condensed" android:textStyle="bold" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
4. Here is CallbackListener
Create new Interface named is CallbackListener
package com.fullscreendialog interface CallbackListener { fun onDataReceived(data: String) }
5. Open activity layout file and update below code
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <Button android:id="@+id/buttonShowDialog" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/colorPrimary" android:padding="16dp" android:text="Show Dialog" android:textColor="@color/colorWhite" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="32dp" android:text="Show received data from full screen dialog" android:textSize="17sp" app:layout_constraintBottom_toTopOf="@+id/buttonShowDialog" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>
6. Show dialog using below code
private fun showDialog() { val dialogFragment = FullScreenDialogExample(this) dialogFragment.show(supportFragmentManager, "signature") }
7. Let’s put it into the main activity and see final code look like below
package com.fullscreendialog import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import kotlinx.android.synthetic.main.activity_main.* class MainActivity : AppCompatActivity(), CallbackListener { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) buttonShowDialog.setOnClickListener { showDialog() } } private fun showDialog() { val dialogFragment = FullScreenDialogExample(this) dialogFragment.show(supportFragmentManager, "signature") } override fun onDataReceived(data: String) { textView.text = data } }
Conclusion
In this android example, We have learned the implementation of full screen dialog in android. I hope it’s helpful for you, then help me by sharing this post with all your friends.
Get Solution Code
Keep in touch
If you want to keep in touch and get an email when I write new blog posts, follow me on facebook or subscribe to us. It only takes about 10 seconds to register.
Better way of debugging and logging your android application