Tugas 5 PBKK - Membuat Mobile Application dengan Xamarin

Sekarang, kita akan mencoba membuat mobile application menggunakan Xamarin. Berikut langkahnya:


1. Buka Microsoft Visual Studio dan buat project baru dengan Mobile App(Xamarin.Forms) sebagai templatenya


2. Ubah nama serta tempat penyimpanan untuk project yang dibuat


3. Pilih blank sebagai template aplikasi


4. Ubah kode pada MainPage.xaml.cs menjadi seperti ini

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<?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>
        <Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
            <Label Text="You clicked 0 times." x:Name="label" HorizontalTextAlignment="Center" TextColor="White" FontSize="24"/>
        </Frame>
        <Label Text="Hello World!" FontSize="Title" Padding="30,10,30,10"/>
        <Label Text="Click the button below to see something cool. Give it a try!" FontSize="16" Padding="30,0,30,0"/>
        <Button Text="Click Me" Clicked="Handle_Clicked" Margin="30,10,30,0"/>
    </StackLayout>

</ContentPage>

5. Selanjutnya ubah kode pada MainPage.xaml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace HelloXamarin
{
    public partial class MainPage : ContentPage
    {
        int count = 0;

        public MainPage()
        {
            InitializeComponent();
        }

        void Handle_ButtonClick(object sender, System.EventArgs e)
        {
            count++;
            label.Text = $"You clicked {count} times.";
        }
    }
}

6. Terakhir, jalankan aplikasi pada emulator. Berikut tampilannya:

Comments