[EN] Displaying three button alert in Xamarin.Forms

Xamarin.Forms DisplayAlert method allows only to set two buttons for platform specific alert. Displaying three buttons is easy with platform specific code.

Xamarin.Forms DisplayAlert method allows only setting two buttons for platform specific alert. In order to do that you can use following code:

private async void Button_Clicked(System.Object sender, System.EventArgs e)
{
     await DisplayAlert("Title", "Message", "OK", "Cancel");
}

What about displaying more buttons? We need to dig into platform specific code.

Xamarin.Forms

First we need to create interface IAlert that will be used in Xamarin.Forms project. This interface will have platform specific implementations.

public interface IAlert
{
    Task<string> Display(string title, string message, string firstButton, string secondButton, string cancel);
}

private async void Button_Clicked(System.Object sender, System.EventArgs e)
{
    var alert = DependencyService.Get<IAlert>();
    var result = await alert.Display("Title", "Message", "First Button", "Second button", "Cancel");

    await DisplayAlert("", "clicked on: " + result, "OK");
}

iOS

On iOS we can use UIAlertController to display three buttons in alert.

[assembly: Dependency(typeof(IosAlert))]
namespace ThreeButtonAlertForXamarinForms.iOS
{
    public class IosAlert : IAlert
    {
        public Task<string> Display(string title, string message, string firstButton, string secondButton, string cancel)
        {
            var taskCompletionSource = new TaskCompletionSource<string>();
            var alerController = UIAlertController.Create(title, message, UIAlertControllerStyle.Alert);
            
            alerController.AddAction(UIAlertAction.Create(firstButton, UIAlertActionStyle.Default, alert =>
            {
                taskCompletionSource.SetResult(firstButton);
            }));

            alerController.AddAction(UIAlertAction.Create(secondButton, UIAlertActionStyle.Default, alert =>
            {
                taskCompletionSource.SetResult(secondButton);
            }));

            alerController.AddAction(UIAlertAction.Create(cancel, UIAlertActionStyle.Cancel, alert =>
            {
                taskCompletionSource.SetResult(cancel);
            }));

            UIApplication.SharedApplication.KeyWindow.RootViewController.PresentViewController(alerController, animated: true, completionHandler: null);

            return taskCompletionSource.Task;
        }
    }
}

Android

To display three buttons in alert on Android we can use AlertDialog.

[assembly: Dependency(typeof(AndroidAlert))]
namespace ThreeButtonAlertForXamarinForms.Droid
{
    public class AndroidAlert : IAlert
    {
        public Task<string> Display(string title, string message, string firstButton, string secondButton, string cancel)
        {
            var taskCompletionSource = new TaskCompletionSource<string>();
            var alertBuilder = new AlertDialog.Builder(Platform.CurrentActivity);

            alertBuilder.SetTitle(title);
            alertBuilder.SetMessage(message);

            alertBuilder.SetPositiveButton(firstButton, (senderAlert, args) =>
            {
                taskCompletionSource.SetResult(firstButton);
            });

            alertBuilder.SetNegativeButton(secondButton, (senderAlert, args) =>
            {
                taskCompletionSource.SetResult(secondButton);
            });

            alertBuilder.SetNeutralButton(cancel, (senderAlery, args) =>
            {
                taskCompletionSource.SetResult(cancel);
            });

            var alertDialog = alertBuilder.Create();
            alertDialog.Show();

            return taskCompletionSource.Task;
        }
    }
}

Summary

Displaying three buttons alert is easy with platform specific code. I’ve created GitHub repository with example. Feel free to use it in your projects 🙂

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *