Xamarin.Forms - FlashLight App


This article demonstrates how to create a FlashLight app in Xamarin.Forms application. This means if the user enables the toggle switch, the LED is turned on. Similarly, the user disables the toggle switch and the LED is turned off.  These features are not listed by default in a Xamarin.Forms application. So, we need to install a plugin for this.
NuGet Package - search Xamarin.Forms 
 Android Output
UWP Output
Let's start.
Step 1

You can create a new Xamarin.Forms app by going to File >> New >> Visual C# >> Cross-Platform >> Cross-Platform App (Xamarin.Forms or Xamarin.Native), give the application name, and location directory path then click OK.
(Eg-Project Name: LampDemo)
Step 2

After the project creation, add the following NuGet package to your project.
  •  kphillpotts.Lamp.Plugin
For that, open Solution Explorer and select your Solution. Right-click and select "Manage NuGet Packages for the Solution". In the popup window, click navigate to "Browse" tab and click browse "kphillpotts.Lamp.Plugin" and select following NuGet packages and select your project, then install it.

Step 3

Now, open MainPage.xaml page. For that, go to Solution Explorer >> LampDemo (PCL) >>double click to open MainPage.xaml and here is the code of this page. In this page, we have designed one Toggle switch and this switch is used to turn on and turn off the LED.
  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"  
  3.              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
  4.              xmlns:local="clr-namespace:LampDemo"  
  5.              x:Class="LampDemo.MainPage">  
  7.     <StackLayout Orientation="Vertical">  
  8.         <Label Text="Lamp Application"   
  9.                FontSize="25"  
  10.                HorizontalOptions="Center"  
  11.                VerticalOptions="Center"></Label>  
  12.         <Label Text="" FontSize="30" x:Name="label"  
  13.                HorizontalOptions="Center"  
  14.                VerticalOptions="Center"/>  
  15.         <Switch Toggled="Switch_OnToggled" x:Name="switch"  
  16.                 HorizontalOptions="Center"  
  17.                 VerticalOptions="Center"  
  18.                 />  
  19.     </StackLayout>  
  22. </ContentPage>  
Step 4

Next, open Solution Explorer >> LampDemo(PCL) >> click open design view of MainPage.Xaml.cs and here is the code for this page.
  • CrossLamp.Current.TurnOn() - To gain access to Turn On the LED.
  • CrossLamp.Current.TurnOff() - To gain access to Turn Off the LED
C# Code Behind 
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Text;  
  5. using System.Threading.Tasks;  
  6. using System.Transactions;  
  7. using Xamarin.Forms;  
  8. using Lamp.Plugin;  
  10. namespace LampDemo  
  11. {  
  12.     public partial class MainPage : ContentPage  
  13.     {  
  15.         public MainPage()  
  16.         {  
  17.             InitializeComponent();  
  18.         }  
  21.         private void Switch_OnToggled(object sender, ToggledEventArgs e)  
  22.         {  
  24.             if (e.Value == true)  
  25.             {  
  26.                 CrossLamp.Current.TurnOn();  
  27.                 label.Text = "Flash Light is Turn On : "+e.Value.ToString();  
  28.             }  
  30.             else  
  31.             {  
  32.                 CrossLamp.Current.TurnOff();  
  33.                 label.Text = "Flash Light is turn Off : "+e.Value.ToString();  
  34.             }  
  36.         }  
  37.     }  
  38. }  
Step 5

Now, let us give the permission to access the FlashLight.
Android Project 

Open AndroidManifest.xml file. For that, go to Solution Explorer >> LampDemo.Android >> double click to open AndroidManifest.xml and add the following permissions are enabled. 
  1. <uses-permission android:name="android.permission.CAMERA" />  
  2. <uses-permission android:name="android.permission.FLASHLIGHT"/>  
  3. <uses-feature android:name="android.hardware.camera" />  
  4. <uses-feature android:name="android.hardware.camera.autofocus" />  
  5. <uses-feature android:name="android.hardware.camera.flash" />  
UWP Project 

Open Package.Appmanifest file. For that, go to Solution Explorer >>LampDemo.UWP >>click open Package.Appmanifest file and navigate to "Capabilities" tab then click the following permission checkbox here. 
Step 6

Now, go to "Build " menu and click "Configure  Manager".Here configure your startup projects. Click F5 or start to build and run your application.
The end result like below,
Android Output
UWP Output
Finally, we have successfully created a Xamarin.Forms LampDemo application using kphillpotts.Lamp.Plugin.

Full Source Code can be found Here.

Similar Articles