Pengaksesan RESTful Services dengan Xamarin Forms (Part 2)

Artikel ini adalah lanjutan dari artikel sebelumnya yang dapat diakses pada alamat berikut.

1. Langkah selanjutnya adalah menampilkan data yang sudah diambil dari REST Services. Untuk itu pada project portable buat folder baru dengan nama Views.

2. Pada folder Views tambahkan halaman xaml dengan nama TodoListPage.xaml. Halaman ini digunakan untuk menampilkan informasi todolist pada kontrol ListView.

<?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="TodoREST.TodoListPage" Title="Todo">
	<ContentPage.ToolbarItems>
		<ToolbarItem Text="+" Clicked="OnAddItemClicked">
			<ToolbarItem.Icon>
			<OnPlatform x:TypeArguments="FileImageSource" Android="plus.png" />
			</ToolbarItem.Icon>
		</ToolbarItem>
	</ContentPage.ToolbarItems>
	<ContentPage.Content>
		<ListView x:Name="listView" ItemSelected="OnItemSelected">
			<ListView.ItemTemplate>
				<DataTemplate>
					<ViewCell>
						<StackLayout Padding="20,0,0,0" HorizontalOptions="StartAndExpand" Orientation="Horizontal">
				<Label Text="{Binding Name}" VerticalTextAlignment="Center" />
				<Image Source="check.png" IsVisible="{Binding Done}" />
						</StackLayout>
					</ViewCell>
				</DataTemplate>
			</ListView.ItemTemplate>
		</ListView>
	</ContentPage.Content>
</ContentPage>

3. Tambahkan gambar plus.png dan icon.png pada project Droid (folder Resources\drawable). Dengan klik kanan pada drawable > Add > Existing Item… > kemudian cari gambar icon.

4. Kemudian tambahkan kode berikut pada file TodoListPage.xaml.cs.

using Xamarin.Forms;

namespace TodoREST
{
    public partial class TodoListPage : ContentPage
    {
        bool alertShown = false;

        public TodoListPage()
        {
            InitializeComponent();
        }

        protected async override void OnAppearing()
        {
            base.OnAppearing();
            listView.ItemsSource = await App.TodoManager.GetTasksAsync();
        }

        void OnAddItemClicked(object sender, EventArgs e)
        {
            var todoItem = new TodoItem()
            {
                ID = Guid.NewGuid().ToString()
            };
            var todoPage = new TodoItemPage(true);
            todoPage.BindingContext = todoItem;
            Navigation.PushAsync(todoPage);
        }

        void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
        {
            var todoItem = e.SelectedItem as TodoItem;
            var todoPage = new TodoItemPage();
            todoPage.BindingContext = todoItem;
            Navigation.PushAsync(todoPage);
        }
    }
} 

5. Kode diatas berisi method yang digunakan untuk menampilkan data todo list kedalam kontrol ListView, dan menambahkan event ketika list tersebut dipilih.

6. Tambahkan halaman xaml baru dengan nama TodoItemPage.xaml. Halaman ini digunakan untuk menampilkan detail todo, mengedit, dan mendelete data.

<?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="TodoREST.TodoItemPage" 
			 Title="Todo">
	<ContentPage.Content>
		<StackLayout VerticalOptions="StartAndExpand">
			<Label Text="Name" />
			<Entry x:Name="nameEntry" Text="{Binding Path=Name}" Placeholder="task name" />
			<Label Text="Notes" />
			<Entry x:Name="notesEntry" Text="{Binding Path=Notes}" />
			<Label Text="Done" />
			<Switch x:Name="doneSwitch" IsToggled="{Binding Path=Done}" />
			<Button Text="Save" Clicked="OnSaveActivated" />
			<Button Text="Delete" Clicked="OnDeleteActivated" />
			<Button Text="Cancel" Clicked="OnCancelActivated" />
		</StackLayout>
	</ContentPage.Content>
</ContentPage>

7. Tambahkan kode berikut pada file TodoItemPage.xaml.cs.

using System;
using TodoREST.Models;
using Xamarin.Forms;

namespace TodoREST
{
    public partial class TodoItemPage : ContentPage
    {
        bool isNewItem;

        public TodoItemPage(bool isNew = false)
        {
            InitializeComponent();
            isNewItem = isNew;
        }

        async void OnSaveActivated(object sender, EventArgs e)
        {
            var todoItem = (TodoItem)BindingContext;
            await App.TodoManager.SaveTaskAsync(todoItem, isNewItem);
            await Navigation.PopAsync();
        }

        async void OnDeleteActivated(object sender, EventArgs e)
        {
            var todoItem = (TodoItem)BindingContext;
            await App.TodoManager.DeleteTaskAsync(todoItem);
            await Navigation.PopAsync();
        }

        void OnCancelActivated(object sender, EventArgs e)
        {
            Navigation.PopAsync();
        }
    }
}

8. Langkat terakhir tambahkan kode berikut pada file App.xaml.cs pada project portable.

using TodoREST.Data;
using Xamarin.Forms;
    
public class App : Application
    {
        public static TodoItemManager TodoManager { get; private set; }

        public static ITextToSpeech Speech { get; set; }

        public App()
        {
            TodoManager = new TodoItemManager(new RestService());
            MainPage = new NavigationPage(new TodoListPage());
        }
    }

9. Tekan tombol F5 untuk menjalankan aplikasi pada emulator Android.

image

Xamarin Master Class–Bekraf Dev Day Surabaya

Pada tanggal 3 Sept 2017 telah dilangsungkan acara Bekraf Developer Day 2017 yang berlokasi di Hotel Shangri-La Surabaya.

Acara ini diselenggarakan atas kerjasama Badan Ekonomi Kreatif (BEKRAF) dan Dicoding dengan dukungan Asosiasi Game Indonesia, Bank DBS Indonesia, BEBRAS Indonesia, Codepolitan, Dicoding Elite, Ericsson, Google, IBM Indonesia, Intel Innovator, Komunitas ID-Android, Microsoft Indonesia, Samsung Developer Warrior, Samsung Indonesia, dan perusahaan-perusahaan teknologi di Indonesia.

Pada acara ini peserta akan mendapatkan update teknis dari para praktisi yang telah sukses dalam pengembangan aplikasi, web, game, dan Internet of Things yang dikemas dalam sesi inspirasi, workshop/Masterclass, live coding, dan talkshow.

Pada acara ini saya diberi kesempatan untuk berbagi ilmu dengan rekan-rekan developer dari seluruh Indonesia untuk membawakan materi Master Class Workshop dengan judul Membangun Aplikasi Multiplatform dengan Xamarin.

16

Bekraf Developer Day 2017–Palembang, Sumsel

Pada tanggal 9 – 10 July 2017 telah dilaksanakan acara Bekraf Developer Day 2017 di Hotel Novotel Palembang, Sumatera Selatan.  

Acara ini diselenggarakan atas kerjasama Badan Ekonomi Kreatif (BEKRAF) dan Dicoding dengan dukungan Asosiasi Game Indonesia, Codepolitan, Dicoding Elite,  Google, Google Developer Expert, IBM Indonesia, Intel Innovator, Komunitas ID-Android, Microsoft Indonesia, Samsung Developer Warrior, Samsung Indonesia, dan perusahaan-perusahaan teknologi di Indonesia.

Tema acara ini adalah: Membangun Kemandirian Bangsa Melalui Teknologi Digital

Pada acara ini peserta akan mendapatkan update teknis dari para praktisi yang telah sukses dalam pengembangan aplikasi, web, game, dan Internet of Things yang dikemas dalam sesi inspirasi, workshop/Masterclass, live coding, dan talkshow.

Situs resmi untuk pendaftaran acara ini dapat diakses pada laman berikut: https://www.dicoding.com/events/706

Pada acara ini saya diberi kesempatan untuk berbagi ilmu dengan rekan-rekan developer dari seluruh Indonesia untuk membawakan materi Master Class Workshop dengan judul Membangun Aplikasi Multiplatform dengan Xamarin.

Berikut ini adalah beberapa dokumentasi dari acara tersebut:

WhatsApp Image 2017-07-13 at 14.08.47(1)WhatsApp Image 2017-07-13 at 14.08.47WhatsApp Image 2017-07-13 at 14.09.52WhatsApp Image 2017-07-13 at 14.09.54

Bekraf Developer Day–Xamarin Master Class

Pada tanggal 9 April 2017 telah dilaksanakan acara BEKRAF Developer Day 2017 – Solo.

Acara ini diselenggarakan atas kerjasama Badan Ekonomi Kreatif (BEKRAF) dan Dicoding dengan dukungan Asosiasi Game Indonesia, Dicoding Elite, Google Developer Expert, IBM Indonesia, Intel Innovator, Komunitas ID-Android, TSM Indonesia, Samsung Indonesia, dan perusahaan-perusahaan teknologi di Indonesia.

Tema acara ini adalah: Membangun Kemandirian Bangsa Melalui Digital

Peserta akan mendapatkan update teknis dari para praktisi yang telah sukses dalam pengembangan aplikasi, game, dan Internet of Things yang dikemas dalam sesi inspirasi, workshop/Masterclass, live coding, dan talkshow. 

Saya mendapatkan kesempatan untuk berpartisipasi sebagai narasumber pada kelas Masterclass 01 – Pembuatan Aplikasi Multiplatform dengan Xamarin.

24

1