Unity3d Modal Dialog Asset

With this asset you can create modal dialogs in Unity 5 easily. The dialogs are based on the new Unity UI system and are highly customizable.

You can see the asset in action in this youtube video:

Getting started

When you added the package to your scene the first thing you need to show modal dialogs is the ModalDialogManager. Add it like that:

Add modal dialog manager

After that you need to add a Unity UI canvas:

Add Unity UI Canvas

Select the Canvas and then add the modal dialog from the UI-Contextmenu:

Add modal dialog to canvas

To open a modal dialog for example by a button-click, you can use this script, which is also included in the package:

using UnityEngine;
using System.Collections;
using UnityEngine.UI;

public class BtnOpenModalDialog : MonoBehaviour
{

    // Use this for initialization
    void Awake()
    {
        ModalDialogManager.Instance.DialogClosing += Instance_DialogClosing;

        ModalDialogManager.Instance.DialogClosed += Instance_DialogClosed;
    }

    void Instance_DialogClosed(object sender, Assets.UIModalDialog.Scripts.DialogClosedEventArgs e)
    {
        Debug.Log("Dialog " + e.DialogName + " is closed by button " + e.CloseButton.name);
    }

    void Instance_DialogClosing(object sender, Assets.UIModalDialog.Scripts.DialogClosingEventArgs e)
    {
        if (e.CloseButton.name == "NoButton")
        {
            // Access components of the dialog before closing
            Text errorText = e.DialogPanel.FindChild("ErrorText").GetComponent<Text>();
            errorText.text = "Can't close dialog, error occured!";
            e.Cancel = true;
        }
    }

    public void ShowDialog()
    {
        ModalDialogManager.Instance.ShowDialog();
    }
}

In this sample the dialogs is prevented from being closed when pressing the No-Button.

Another sample-scene is the UILoginDialog. The prefab added to the canvas is the LoginDialog-prefab.

The code for opening the Login dialog is:

using System;
using UnityEngine;
using System.Collections;
using UnityEngine.UI;

public class BtnOpenLoginDialog : MonoBehaviour {

    // Use this for initialization
    void Awake()
    {
        ModalDialogManager.Instance.DialogOpened += Instance_DialogOpened;

        ModalDialogManager.Instance.DialogClosing += Instance_DialogClosing;

        ModalDialogManager.Instance.DialogClosed += Instance_DialogClosed;
    }

    void Instance_DialogOpened(object sender, Assets.UIModalDialog.Scripts.DialogEventArgs e)
    {
        LoginCallback loginCallBack = e.DialogPanel.GetComponent<LoginCallback>();
        loginCallBack.ClearInput();
    }

    void Instance_DialogClosed(object sender, Assets.UIModalDialog.Scripts.DialogClosedEventArgs e)
    {
        if (e.CloseButton.name == "LoginButton")
        {
            Debug.Log("Ok, Login successfull");
        }
    }

    void Instance_DialogClosing(object sender, Assets.UIModalDialog.Scripts.DialogClosingEventArgs e)
    {
        if (e.CloseButton.name == "LoginButton")
        {
            // Access Login callback scripton Login
            LoginCallback loginCallback = e.DialogPanel.GetComponent<LoginCallback>();
            loginCallback.ClearErrors();

            if(String.IsNullOrEmpty(loginCallback.GetUsername()))
            {
                loginCallback.SetErrorUsername("Please enter a username");
            }

            if (String.IsNullOrEmpty(loginCallback.GetPassword()))
            {
                loginCallback.SetErrorPassword("Please enter a password");
            }

            e.Cancel = loginCallback.HasError;
        }
    }

    public void ShowDialog()
    {
        ModalDialogManager.Instance.ShowDialog();
    }
}

With the attached LoginCallback-script you can initiaze the Logindialog on DialogOpened method (C# eventhandler) and react on input when submitting in the method DialogClosing.

But that’s not all. The modal dialog is highly customizable, you can see it in the UISocialDialog scene in which a social overlay for subscribing to a social community like youtube is displayed:

Social modal dialog

Here is the code for displaying this overlay after a special number of seconds:

using UnityEngine;
using System.Collections;

public class OpenSocialTimer : MonoBehaviour
{
    public float TimeToOpen = 2;

    // Use this for initialization
    void Awake()
    {
        Invoke("ShowDialog", TimeToOpen);

        ModalDialogManager.Instance.DialogClosed += Instance_DialogClosed;
    }

    void Instance_DialogClosed(object sender, Assets.UIModalDialog.Scripts.DialogClosedEventArgs e)
    {
        if (e.CloseButton.name == "SubscribeButton")
        {
            Application.OpenURL("http://www.youtube.com/subscription_center?add_user=jayanamgames");
        }
    }

    public void ShowDialog()
    {
        ModalDialogManager.Instance.ShowDialog();
    }
}