Menampilkan data Sharepoint List

pada Android App menggunakan

Xamarin

Junindar, ST, MCPD, MOS, MCT, MVP .NET

junindar@gmail.com

Lisensi Dokumen:
Copyright © 2003 IlmuKomputer.Com
Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan
disebarkan secara bebas untuk tujuan bukan komersial (nonprofit), dengan syarat
tidak menghapus atau merubah atribut penulis dan pernyataan copyright yang
disertakan dalam setiap dokumen. Tidak diperbolehkan melakukan penulisan ulang,
kecuali mendapatkan ijin terlebih dahulu dari IlmuKomputer.Com.

http://junindar.blogspot.com

Abstrak
Android adalah salah satu mobile oprating system yang saat banyak digunakan di berbagai
smartphone, baik yang berspesifikasi rendah maupun mumpuni. Dikarenakan android saat
ini merupakan salah satu mobile OS paling digemari, maka tidak dipungkiri sangat banyak
sekali aplikasi-aplikasi mobile untuk android. Untuk membuat aplikasi mobile ini ada
beberapa tools yang bisa digunakan dan salah satunya adalah dengan menggunakan
Xamarin.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Pendahuluan
Pada artikel ini akan dijelaskan bagaimana cara untuk membuat aplikasi mobile untuk
menampilkan data Sharepoint dengan menggunakan Xamarin dan JSON.Net. Xamarin
adalah salah tools untuk membuat aplikasi mobile dimana bahasa pemograman yang
digunakan adalah C#. Xamarin merupakan perusahaan perangkat lunak yang berdiri pada
bulan Mei tahun 2015. Integrated development environment (IDE) pada Xamarin di kenal
dengan nama Xamarin Studio. Tetapi selain Xamarin Studio kita juga dapat menggunakan
Visual Studio dan pada artikel ini kita akan menggunakan Visual Studio 2013 .

Selanjutnya untuk mengambil data pada sharepoint kita akan menggunakan HttpClient.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Isi
Untuk memudahkan memahami isi dari artikel ini, kita akan membuat sebuah project
latihan, dimana kita akan menggunakan Sharepoint (2013) List sebagai media
penyimpanan datanya. Untuk pertama kali buka Visual Studio (VS) 2013 (diasumsikan
Xamarin sudah di install pada PC/Laptop)
A. Create New Project
Pada latihan yang pertama ini, akan dijelaskan bagaimana membuat sebuah project
untuk aplikasi pada anroid.
1. Pada VS 2013 klik New Project lalu tampilan jendela New Project akan muncul seperti
gambar dibawah ini. Pilih Blank App (Android) dan ganti nama project menjadi
LatihanJSON. Dan klik “OK”.

Setelah kita melakukan langkah diatas, maka kita akan mendapatkan sebuah project
baru seperti gambar dibawah.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
Selanjutnya tambah beberapa folder (Activity, Adapter, Entity dan Fragment) pada project.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 a. Pada folder entity tambah dua buah class, dengan nama “ProjectSite” dan
“Site”. Tambahkan sintaks dibawah untuk masing-masing class.

namespace LatihanJSON
{
public class ProjectSite
{

public string ID { get; set; }

public string Link { get; set; }
public string ProjectName { get; set; }
public string Status { get; set; }
public string Priority { get; set; }
public string State { get; set; }

}
}

using System.Collections.Generic;
namespace LatihanJSON
{
public class Site
{
public string ID { get; set; }
public string Url { get; set; }
public List<ProjectSite> Items { get; set; }
}
}

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Pada Class “ProjectSite” merupakan representasi dari List “Project
Information” pada SharePoint, yang nantinya akan kita tampilkan data-data
pada list tersebut kedalam apps. Sedangkan Class Site berfungsi sebagai Parent
dari Class ProjectSite. Dimana satu ID pada Site bisa memiliki banyak Items
pada ProjectSite.

2. Tambahkan sebuah class pada Folder “Adapter” dengan nama “ListProjectAdapter”.

Class ini berfungsi untuk melakukan bind data ke dalam user interface pada aplikasi.
Lalu pada class yang dibuat, ubah sintaks seperti dibawah.
using System.Linq;
using Android.App;
using Android.Views;
using Android.Widget;

namespace LatihanJSON
{
public class ListProjectAdapter : BaseAdapter<ProjectSite>
{

private readonly ProjectSite[] _projectItems;

Activity _context = null;
public ListProjectAdapter(Activity context, ProjectSite[] projectItems)
{
_context = context;
_projectItems = projectItems;
}

public override long GetItemId(int position)

{
return position;
}

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 public override View GetView(int position, View convertView, ViewGroup
parent)
{
var view = convertView ??
_context.LayoutInflater.Inflate(Android.Resource.Layout.SimpleListItem2, null);

view.FindViewById<TextView>(Android.Resource.Id.Text1).Text =
_projectItems[position].ProjectName;
view.FindViewById<TextView>(Android.Resource.Id.Text2).Text =
string.Format("Project Status : {0} - Priority : {1}",
_projectItems[position].Status, _projectItems[position].Priority);
return view;
}
public override int Count
{
get { return _projectItems.Count(); }
}

public override ProjectSite this[int position]

{
get { return _projectItems[position]; }
}
}
}

Sintaks diatas merupakan Class Adapter untuk ProjectSite, dimana kita akan
menampilkan data seperti ProjectName, Status dan Priority kedalam listview
dengan cara melakukan Overide View.
3. Pada folder Layout (Resources>Layout), tambahkan sebuah Android Layout (.axml)
dengan nama “FragmentListProject”. Klik kanan pada Layout Folder > Add > New
Item, lalu pilih “Android Layout”.

Gambar dibawah adalah default dari Layout yang telah kita buat diatas.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Dan selanjutnya adalah kita akan mengganti layout diatas. Klik tab source pada
layout dan ganti sintaks dari layout menjadi seperti gambar dibawah.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:minWidth="25px"
android:minHeight="25px"
android:isScrollContainer="true"
android:padding="3dip">
<ListView
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/siteItemList" />
</LinearLayout>

Pada sintaks diatas, dapat kita lihat terdapat sebuah ListView dengan nama “siteItemList”.
ListView ini berfungsi untuk tempat menampilkan data dari SharePoint List nantinya.
Pada folder “Fragment” tambah sebuah Fragment dengan nama “ListProjectFragment”.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
Fragment ini lah yang berfungsi untuk mengambil data dari Sharepoint List dan
ditampilkan pada ListView pada FragmentListProject Layout. Untuk lebih memahami
ikuti langkah-langkah berikut ini. Pertama sebelum masuk dalam membuat sintaks pada
fragment, tambahkan sebuah Reference “System.Net.Http” pada Project. Selanjutnya
ketikkan sintas dibawah ini pada Fragment yang baru dibuat.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 using System;
using System.Collections.Generic;
using System.Xml.Linq;
using Android.App;
using Android.OS;
using Android.Util;
using Android.Views;
using Android.Widget;
using System.Net.Http;
namespace LatihanJSON
{
public class ListProjectFragment : Fragment
{

public static string ArgMenuNumber = "menu_number";

private List<Site> _sites;

private ListView _siteListView;

public ListProjectFragment()
{
_sites = new List<Site>();

public override View OnCreateView(LayoutInflater p0, ViewGroup p1, Bundle p2)

{
var rootView = p0.Inflate(Resource.Layout.FragmentListProject, p1, false);

_siteListView = (ListView)rootView.FindViewById(Resource.Id.siteItemList);
AddProjectInfo("http://linkurl/_api/web/webs");

return rootView;
}

private async void AddProjectInfo(string url)

{
try
{
var newSite = new Site
{

Url = url
};

var httpClientHandler = new HttpClientHandler

{
Credentials = new System.Net.NetworkCredential("domain\\username", "**")
};

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 using (var client = new HttpClient(httpClientHandler))
{
var xmlFeed = await client.GetStringAsync(url);

var doc = XDocument.Parse(xmlFeed);

XElement root = doc.Root;

XNamespace dc = "http://www.w3.org/2005/Atom";
XNamespace dcm =
"http://schemas.microsoft.com/ado/2007/08/dataservices/metadata";
XNamespace dcd =
"http://schemas.microsoft.com/ado/2007/08/dataservices";

newSite.ID = url.Substring(0, url.Length - 13);

List<ProjectSite> lstProjectInfo = new List<ProjectSite>();

foreach (XElement e in root.Descendants(dc + "entry"))

{

var xmlInfo = "";

var bCon = true;
try
{
xmlInfo = await client.GetStringAsync(e.Element(dc +
"id").Value +
"/lists/getByTitle('Project Information')/items");
}
catch (Exception)
{

bCon = false;
}
if (!bCon) continue;
var docInfo = XDocument.Parse(xmlInfo);

XElement rootInfo = docInfo.Root;

foreach (XElement eInfo in rootInfo.Descendants(dcm +

"properties"))
{

ProjectSite newProject = new ProjectSite();

newProject.ID = eInfo.Element(dcd + "ID").Value;
newProject.ProjectName = eInfo.Element(dcd + "Title").Value;
newProject.Link = e.Element(dc + "id").Value;
newProject.State = eInfo.Element(dcd + "State").Value;
if (eInfo.Element(dcd + "ProjectStatus") != null)
newProject.Status = eInfo.Element(dcd + "ProjectStatus").Value;
newProject.Priority = eInfo.Element(dcd + "Priority").Value;
lstProjectInfo.Add(newProject);

}
}

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 newSite.Items = lstProjectInfo;
_sites.Add(newSite);
_siteListView.Adapter = new ListProjectAdapter(Activity,
_sites[0].Items.ToArray());

}
}
catch (Exception ex)
{

Log.Error("JSON", "Encountered an error {0}", ex.Message);

}
}
}
}

Pada "async void AddProjectInfo" dapat kita lihat bagaimana sebelum mengakses
Sharepoint List terlebih dahulu kita melakukan cek credential terlebih dahulu dengan
memasukkan username dan password.
4. Selanjutnya ubah Layout pada Main.axml menjadi seperti sintaks dibawah.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- The main content view -->
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/black" />
</LinearLayout>

5. Copy “MainActivity.cs” kedalam folder Activity. Lalu ubah sintaks pada “OnCreate”
seperti sintaks dibawah.

protected override void OnCreate(Bundle bundle)

{
base.OnCreate(bundle);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
var fragment = new ListProjectFragment();
var arguments = new Bundle();
arguments.PutInt(ListProjectFragment.ArgMenuNumber, 0);
fragment.Arguments = arguments;
FragmentManager.BeginTransaction()
.Replace(Resource.Id.content_frame, fragment)
.Commit();
}

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Dan jalankan program, maka kita akan mendapatkan data-data yang terdapat pada
Sharepoint List.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
 Penutup
Pada artikel ini telah dijelaskan bagaimana menggunakan Xamarin untuk menampilkan
data pada Android App. Sedangkan untuk memudahkan dalam memahami isi artikel, maka
penulis juga menyertakan dengan full source code project latihan ini, dan dapat di
download disini.
http://junindar.blogspot.com/2015/05/pengenalan-entity-framework-ef-6-pada.html

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET
Referensi

1. www.msdn.microsoft.com
2. www.planetsourcecode.com
3. www.codeproject.com
4. www.aspnet.com
Masih banyak lagi referensi yang ada di Intenet. Anda tinggal cari di www.Google.com.
Dengan kata kunci “tutorial VB.Net”

Biografi Penulis.

Junindar Lahir di Tanjung Pinang, 21 Juni 1982. Menyelesaikan

Program S1 pada jurusan Teknik Informatika di Sekolah Tinggi
Sains dan Teknologi Indonesia (ST-INTEN-Bandung). Junindar
mendapatkan Award Microsoft MVP VB pertanggal 1 oktober
2009 hingga saat ini. Senang mengutak-atik computer yang
berkaitan dengan bahasa pemrograman. Keahlian, sedikit mengerti
beberapa bahasa pemrograman seperti : VB.Net, C#, SharePoint,
ASP.NET, VBA. Reporting: Crystal Report dan Report Builder.
Database: MS Access, MY SQL dan SQL Server. Simulation /
Modeling Packages: Visio Enterprise, Rational Rose dan Power
Designer. Dan senang bermain gitar, karena untuk bisa menjadi
pemain gitar dan seorang programmer sama-sama membutuhkan
seni. Pada saat ini bekerja di salah satu Perusahaan Consulting dan
Project Management di Malaysia sebagai Senior Consultant.
Memiliki beberapa sertifikasi dari Microsoft yaitu Microsoft
Certified Professional Developer (MCPD – SharePoint 2010), MOS
(Microsoft Office Specialist) dan MCT (Microsoft Certified
Trainer) Mempunyai moto hidup: “Jauh lebih baik menjadi
Orang Bodoh yang giat belajar, dari pada orang Pintar yang
tidak pernah mengimplementasikan ilmunya”.

Step By Step Menjadi Programmer Handal Dengan VB.Net

Junindar, ST, MCPD, MOS, MCT, MVP VB.NET