Xamarin | .NET mobile app

Halo, Jadi kali ini saya mencoba untuk membuat aplikasi mobile pertama yang menggunakan Xamarin. Apa sih Xamarin itu? Xamarin merupakan platform open-source pada .NET yang dikhususkan untuk membuat aplikasi untuk iOS,  Android, dan bahkan Windows. Oke langsung saja ke langkah-langkahnya.

• Membuat Project Xamarin Form

Untuk awalnya seperti biasa, kita terlebih dahulu membuat sebuah project pada Visual Studio. Kali ini project yang dipilih adalah Mobile App (Xamarin.Forms). 

Karena kita akan membuat aplikasi yang sederhana, maka Blank template sudah cukup sehingga bisa kita pilih.

• Mendesain UI aplikasi

Setelah project baru berhasil dibuat, maka kita lakukan desain UI pada file MainPage.xaml. Ubah isi file tersebut seperti ini.

	<?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="HelloXamarin.MainPage">
	<StackLayout>
	<StackLayout.Background>
	<LinearGradientBrush StartPoint="0,0"
	EndPoint="0,1">
	<GradientStop Color="White"
	Offset="0.3"/>
	<GradientStop Color="Teal"
	Offset="1.0"/>
	</LinearGradientBrush>
	</StackLayout.Background>
	<Frame BackgroundColor="Teal" Padding="24" CornerRadius="0">
	<Label Text="Say Hello to Xamarin.Forms!" HorizontalTextAlignment="Center" TextColor="White" FontSize="36"/>
	</Frame>
	<Button Text="Tap Tap Here!!!" Clicked="Button_Clicked" BackgroundColor="Bisque"></Button>
	<Label Text="Hi There" FontSize="Title" Padding="30,10,30,10"/>
	<Label Text="Ini adalah aplikasi mobile pertama saya menggukan XamarinForms!" FontSize="16" Padding="30,0,30,0"/>
	<Label Text="(ﾉ'ヮ`)ﾉ*: ･ﾟ" Padding="30,10,30,10" FontSize="Subtitle" FontAttributes="Bold" TextColor="Teal"></Label>
	<Label FontSize="16" Padding="30,24,30,0">
	<Label.FormattedText>
	<FormattedString>
	<FormattedString.Spans>
	<Span Text="Kunjungi "/>
	<Span Text="https://github.com/ilhambayhaqi/" FontAttributes="Bold"/>
	</FormattedString.Spans>
	</FormattedString>
	</Label.FormattedText>
	</Label>
	</StackLayout>
	</ContentPage>

view raw MainPage.xaml hosted with ❤ by GitHub

• Membuat button handler

Kemudian kita membuat logic yang akan diimplementasikan ketika pengguna menekan button pada halaman awal. Untuk itu kita menambahkan beberapa hal dibawah pada MainPage.xaml.cs. 

	int count = 0;
	private void Button_Clicked(object sender, EventArgs e)
	{
	count++;
	((Button)sender).Text = $"You tapped {count} times.";
	}

view raw MainPage.xaml.cs hosted with ❤ by GitHub

• Mengkoneksikan dengan Android

Untuk menjalankan aplikasi, terdapat 2 pilihan yaitu dengan menggunakan emulator ataupun menjalankan langsung di perangkat mobile kita. Kali ini, saya memilih untuk menjalankan langsung pada perangkat penulis. Agar aplikasi dapat berjalan, maka kita harus menghubungkan perangkat kita dengan kabel USB dan pastikan USB Debugging telah diaktifkan.

Untuk hasilnya bisa dilihat sebagai berikut.