Xamarin.Forms - FlashLight App

Introduction

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 

• kphillpotts.Lamp.Plugin

 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.

 

XAML Code

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:LampDemo"
             x:Class="LampDemo.MainPage">

    <StackLayout Orientation="Vertical">
        <Label Text="Lamp Application"
               FontSize="25"
               HorizontalOptions="Center"
               VerticalOptions="Center"></Label>
        <Label Text="" FontSize="30" x:Name="label"
               HorizontalOptions="Center"
               VerticalOptions="Center"/>
        <Switch Toggled="Switch_OnToggled" x:Name="switch"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                />
    </StackLayout>


</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 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Transactions;
using Xamarin.Forms;
using Lamp.Plugin;

namespace LampDemo
{
    public partial class MainPage : ContentPage
    {

        public MainPage()
        {
            InitializeComponent();
        }


        private void Switch_OnToggled(object sender, ToggledEventArgs e)
        {

            if (e.Value == true)
            {
                CrossLamp.Current.TurnOn();
                label.Text = "Flash Light is Turn On : "+e.Value.ToString();
            }

            else
            {
                CrossLamp.Current.TurnOff();
                label.Text = "Flash Light is turn Off : "+e.Value.ToString();
            }

        }
    }
}

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. 

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.FLASHLIGHT"/>
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />
<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. 

ID_CAP_ISV_CAMERA
ID_CAP_MICROPHONE

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.