This blog explains how to create a simple Wi-Fi demo application using the Tizen Wi-Fi APIs, and also to design the application UI using XAML.

This simple Wi-Fi demo application demonstrates how to enable and disable Wi-Fi, also how to scan and connect to an open network Access Point (AP). The Wi-Fi APIs used in this app are part of the Tizen C# Native APIs.

Prerequisites

The content presented in this blog is based on the assumption that you understand the structure of Tizen .NET application, and how to design the UI using XAML file. If not, refer to the Drumpad application.

Steps

The following are the steps involved in creating the Wi-Fi demo application:

1. Creating the Project
2. Creating UI for the Application
3. Binding Button Click Events
4. Adding the Privilege
5. Running the Application

Creating the Project

First, you need to create a Tizen Xamarin.Forms Single application. To do so, perform the following steps:

1. On the Visual Studio menu, go to File > New > Project.

The New Project screen is displayed.

2. Go to Templates > Visual C# > Tizen, and select Blank App (Tizen Xamarin.Forms Single). 
3. Enter the Name, Location, and Solution name. For example, in the above screenshot, the application is named as “WiFiDemo”.
4. Click OK to create the project. Once the project is created, the general structure of the application is displayed as follows:

Creating UI for the Application

Now that you have created the project, use the XAML to create the UI. For information on XAML, refer to eXtensible Application Markup Language (XAML).

To create the UI, perform the following:

1. In the Solution Explorer pane, right-click WiFiDemo.Tizen and click Add > New Item. The Add New Item – WiFiDemo.Tizen screen is displayed.

2. Select the required XAML template for content page as shown in the following screenshot.

3. Name the page as MainPage.xaml and click Add.
4. Replace the code under MainPage.xaml with the following 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"
			 x:Class="WiFiDemo.Tizen.MainPage"
			 Title="WiFi Demo Application"
			 NavigationPage.HasNavigationBar="True"
			 BackgroundColor="LightBlue">
	<ContentPage.Content>
		<StackLayout>
			<Label x:Name="_label1"
				   Text="Wi-Fi Demo App"
				   TextColor="White"
				   FontAttributes="Bold"
				   FontSize="30"
				   HorizontalOptions="CenterAndExpand"
				   VerticalOptions="StartAndExpand" />

			<Grid Padding="14" >
					<Grid.RowDefinitions>
						<RowDefinition Height="*" />
					</Grid.RowDefinitions>

					<Grid.ColumnDefinitions>
						<ColumnDefinition Width="*" />
						<ColumnDefinition Width="200" />
					</Grid.ColumnDefinitions>
					
					<!--Enable/Disable button positioning-->
				<Grid Grid.Row="0"
					  Grid.ColumnSpan="2"
					  Padding="7">

Using the above code snippet, you can create the following UI elements:

• Button “Enable” to enable Wi-Fi
• Button “Disable” to disable Wi-Fi
• Label “Scan Access Points (AP)” and a button “Scan” to scan for access points.
• Label with text “Tap on the box below to select AP”
• Picker to select the required access point.
• Button “Connect” to connect to a specific access point.

MainPage.xaml has a corresponding MainPage.xaml.cs file where the events can be handled when the user clicks the Enable, Disable, Scan, and Connect buttons. Set MainPage as the Main Page of the application in WiFiDemo.cs by setting MainPage as “MainPage = new MainPage()” in the App constructor.

The following is the screenshot of the application:

Binding Button Click Events

Now that the UI is created, you must implement the Wi-Fi functionality. In the MainPage.xaml.cs file, after the InitializeComponent() function, add event handlers for the Picker, Enable, Disable, Scan, and Connect buttons as shown in the following code example:

            enable.Clicked += OnEnableClicked;
            disable.Clicked += OnDisableClicked;
            scan.Clicked += OnScanClicked;
            connect.Clicked += OnConnectClicked;
            picker.Items.Add("Scan again");
            picker.SelectedIndexChanged += OnAPSelect;

Implement the Enable and Disable button click events as shown:

    async void OnEnableClicked(Object sender, EventArgs e)
        {
            if (WiFiManager.IsActive)
            {   cell.Text = "Wi-Fi is already enabled";
                return;    }
            WiFiManager.ActivateAsync();
            cell.Text = "Wi-Fi is getting enabled";
            await Task.Delay(5000);
            if (WiFiManager.IsActive)
                cell.Text = "Wi-Fi is enabled";
        }


        async void OnDisableClicked(Object sender, EventArgs e)
        {
            Log.Debug("WIFITESTLOG", "ondisableclicked");
            if (!WiFiManager.IsActive)
            {   cell.Text = "Wi-Fi is already disabled";
                return;  }

            if (_device != null)
            {
                Log.Debug("WIFITESTLOG", "disconnectstart ");
                try
                {
                    WiFiAP _device1 = WiFiManager.GetConnectedAP();
                    await Task.Delay(6000);
                    await _device1.DisconnectAsync();
                    await Task.Delay(6000);
                    _device1.ForgetAP();

                    WiFiManager.ConnectionStateChanged -= StateChanged;
                }

                catch (Exception ex)
                {Log.Debug("WIFITESTLOG", "disconnectstart " + ex.ToString());}
                 Log.Debug("WIFITESTLOG", "disconnect end");
                }

Implement the Scan button click event to scan for the Wi-Fi access points:

            void OnScanClicked(Object sender, EventArgs e)
        {
            if (!WiFiManager.IsActive)
            {
                cell.Text = "Enable wifi";
                return;
            }

            cell.Text = "Scan is pressed";
            picker.Items.Clear();
            picker.Items.Add("Scan again");
            picker.SelectedIndex = 0;
            _wifiAP = null;

            WiFiManager.BackgroundScanFinished += ScanFinished;
            WiFiManager.ScanAsync();
            _wifiAP = WiFiManager.GetFoundAPs();

            foreach (WiFiAP ap in _wifiAP)
            {
                picker.Items.Add(ap.NetworkInformation.Essid);
            }

            //cell.Text = "Scan is finished";
        }

        void ScanFinished(Object sender, EventArgs e)
        {
            cell.Text = "Scan completed";
        }

Implement the Connect button click event and also to get the selected AP from the picker list.

        void OnAPSelect(object sender, EventArgs e)
        {
            Log.Debug("WIFITESTLOG", "onapselect, ap info");
            if (picker.SelectedIndex > 0)
            {
                if (_device != null)
                    _device.Dispose();

                _device = new WiFiAP(picker.Items[picker.SelectedIndex]);
                cell.Text = "Device " + _device.NetworkInformation.Essid + " is selected";
                Log.Debug("WIFITESTLOG", "onapselect, ap info =" + _device.NetworkInformation.Essid + ", " + _device.NetworkInformation.ConnectionState);
            }
            else
            {
                cell.Text = "Device is not selected";
            }
        }

        async void OnConnectClicked(object sender, EventArgs e)
        {
            WiFiManager.BackgroundScanFinished -= ScanFinished;
            if (!WiFiManager.IsActive)
            {
                cell.Text = "Enable Wi-Fi";
                return;
            }
            else
            {
                if (_device != null)
                {
                    cell.Text = "Connecting to " + _device.NetworkInformation.Essid;
                    WiFiManager.ConnectionStateChanged += StateChanged;
                    await _device.ConnectAsync();
                    await Task.Delay(4000);
                }
                else
                {
                    cell.Text = "Device not found cannot connect";
                    return;
                }
            }
        }

The Wi-Fi connection status can be checked using the following code:

  void StateChanged(Object sender, ConnectionStateChangedEventArgs e)
        {
            Log.Debug("WIFITESTLOG", "StateChanged");
            if (e.State == WiFiConnectionState.Connected)
                cell.Text = "Device connected " + e.AP.NetworkInformation.Essid.ToString();
            if (e.State == WiFiConnectionState.Disconnected)
                cell.Text = "Deivce is not connected";
        }

Adding the Privilege

The Wi-Fi APIs require few privileges. This Tizen privilege enables the application to use the Wi-Fi APIs. You can add this privilege to the tizen-manifest.xml file. To do so, perform the following steps:

1. In the Solution Explorer pane, go to WiFiDemo.Tizen project > tizen-manifest.xml.
2. Right-click the tizen-manifest.xml file and click Open.
3. Click Privileges > Add and select Custom Privileges.
4. In the Custom Privileges text box, enter:
   • http://tizen.org/privilege/network.get
   • http://tizen.org/privilege/network.set
   • http://tizen.org/privilege/network.profile
5. Click OK to add the privilege.

Running the Application

Press CTRL+F5 to launch the application on the device/emulator.

To connect to an access point, follow the steps below:

1. Tap Enable to enable the Wi-Fi.
2. Tap Scan to scan for access points.
3. Tap the picker box.
4. Select an open network access point, in the Select AP screen.
5. Tap Connect to connect to the selected access point.

Note: This demo app allows you to connect only with an open network access point. To disable the Wi-Fi, tap “Disable”.

For more details, refer to the attached source.