ActionSheet In Xamarin.Forms Application For Android And UWP

ActionSheet displays a list of buttons along with an optional title to the user. They allow an application to prompt a user for the action to take, such as confirming or canceling an operation.

Reading this article, you will learn how to use ActionSheet in Xamarin.Forms application for Android and Universal Windows Platform with XAML and Visual C# in cross platform application development.

The following important tools are required for developing UWP.

  1. Windows 10 (Recommended)
  2. Visual Studio 2017 RC Community/Enterprise/Professional edition (It is a Free trial software available online).
  3. Using Visual Studio 2017 Installer, enable the feature of Mobile development with .NET.

Now, we can discuss step by step app development.

Step 1

Open Visual Studio 2017 RC -> Start -> New Project-> Select Cross-Platform (under Visual C#->Cross Platform App-> Give a suitable name for your App (XamFormActSheet) -> OK.

Step 2

Select the Cross Platform template as Blank APP ->Set UI Technology as Forms and Sharing as PCL. Afterwards, Visual Studio creates 4 projects (Portable, Droid, iOS, UWP) and displays Getting Started.XamarinPage.



Step 3

In MainPage.Xaml page, add Label and Buttons for ActionSheet Demo.
  1. <StackLayout>  
  2.   
  3.    <Label Text="Xamarin Forms ActionSheet Demo - Android and UWP " VerticalOptions="Center" HorizontalOptions="Center" />  
  4.   
  5.    <Button x:Name="BtnActShe" Text="Share (Action Sheet) " Clicked="BtnActShe_Clicked" TranslationX="0" TranslationY="50"/>  
  6.   
  7. </StackLayout>   


Step 4

Add the following code in MainPage.Xaml.cs.
  1. private async void BtnActShe_Clicked(object sender, EventArgs e) {  
  2.     var action = await DisplayActionSheet("ActionSheet: Send to?""Cancel"null"Email""Twitter""Facebook");  
  3.     switch (action) {  
  4.         case "Email":  
  5.             Device.OpenUri(new Uri("https://www.google.com/gmail/about/"));  
  6.             break;  
  7.         case "Twitter":  
  8.             Device.OpenUri(new Uri("https://twitter.com/login"));  
  9.             break;  
  10.         case "Facebook":  
  11.             Device.OpenUri(new Uri("https://www.facebook.com/login/"));  
  12.             break;  
  13.         default:  
  14.             break;  
  15.     }  


Step 5

We will test Android and UWP. So, we can set the Multiple Startup Projects as XamFormActSheet.Droid and XamFormActSheet.UWP (Universal Windows).


Step 6

Change the Configuration Manager settings. Go to Build -> Configuration Manager, and uncheck the "Build" and "Deploy" options to the iOS and check for Droid and UWP.
 


Step 7

Deploy your app to Android Emulator and Local Machine (UWP). The output of the XamFormActSheet App is shown below.


Click the Share (Action Sheet) button control, when Switch is ON status.

 

After click the Email.

 
After click Twitter.


Summary

Now, you have successfully tested ActionSheet in Xamarin.Forms application for cross-platform application development, using Visual C# and Xamarin.


Similar Articles