fadriel's blog: November 2013

Kamis, 28 November 2013

Ceritaku Tentang Windows Phone (Visual Programming)...

Alhamdulilah kit bertemu lagi dalam pembelajaran Windows Phone dan klai ini kita akan mempelajari WP dalam bentuk Visual Programming (Windows Phone),Pada pertemuan kali ini mengenai “Navigation Between Page” yaitu, cara bagaimana kita memindahkan halaman atau saya sebut link, contohnya kita akan memindahkan halaman 1, ke halaman 2, dan seterusnya.

Sebelum kita memulai pada project mari kita lihat beberapa tampilan gambar untuk memudahkan pekerjaan.

Tampilan main page atau menu utama

tampilan second page

ini tampilan third page

ini tampilan fourth page

dan ini tampilan fifth page

Seperti biasanya setelah kita mempuka aplikasi windows phone kita harus mengikuti langkah-langkah yang biasanya. Kali ini saya akan menamakan folder windows phone saya dengan nama “Sesuai Keinginan Anda”.
Setelah aplikasi telah terbuka, bisa di lihat seperti gambar di bawah

Klik kanan pada file MainPage2. Lebih lanjutnya lihat pada gambar dibawah

ita akan merubah nama folder menjadi “Views”. Sekarang kita akan menambahkan halaman baru agar kita dapat masuk kehalaman berikutnya. Caranya hampir sama dengan cara diatas, bedanya kita klik kanan pada folder “Views”

Setelah itu akan mencul seperti gambar disamping ini

Untuk seterusnya kita akan lanjut dengan menuliskan nama file-nya . nama file bebas sesuai dengan yang anda inginkan.
Setelah itu kita akan mempersiapkan template apa saja yang dibutuhkan.

dibawah ini adalah script dalam tampilan mainpage.xaml :

<phone:PhoneApplicationPage
x:Class="NavigationBetweenPage.View.SecondPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
shell:SystemTray.IsVisible="True">


<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>


<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Second Page" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>


<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<TextBlock Height="47" HorizontalAlignment="Left" Margin="35,29,0,0" Name="namaTB" Text="" VerticalAlignment="Top" Width="324" />
<TextBlock Height="46" HorizontalAlignment="Left" Margin="35,97,0,0" Name="umurTB" Text="" VerticalAlignment="Top" Width="324" />
<TextBlock Height="56" HorizontalAlignment="Left" Margin="35,166,0,0" Name="nameTB" Text="" VerticalAlignment="Top" Width="324" />
<HyperlinkButton Content="Go To Page 3" Height="30" HorizontalAlignment="Left" Margin="35,228,0,0" Name="ThirdHB" VerticalAlignment="Top" Width="200" NavigateUri="/View/ThirdPage.xaml" />
<Button Content="Send to Page 1" Height="72" HorizontalAlignment="Left" Margin="9,264,0,0" Name="sVaBT" VerticalAlignment="Top" Width="223" Click="sVaBT_Click" />
<Button Content="Send to Page 3" Height="72" HorizontalAlignment="Left" Margin="214,264,0,0" Name="sVbBT" VerticalAlignment="Top" Width="224" Click="sVbBT_Click" />
<Button Content="Send to Page 5" Height="72" HorizontalAlignment="Right" Margin="0,342,18,0" Name="sVdBT" VerticalAlignment="Top" Width="224" Click="sVdBT_Click" />
<Button Content="Send to Page 4" Height="72" HorizontalAlignment="Left" Margin="12,342,0,0" Name="sVcBT" VerticalAlignment="Top" Width="220" Click="sVcBT_Click" />
<TextBox Height="72" HorizontalAlignment="Left" Margin="-4,403,0,0" Name="nama1TBx" Text="" VerticalAlignment="Top" Width="460" />
</Grid>
</Grid>




</phone:PhoneApplicationPage>

dibawah ini adalah script untuk beberapa button dan hyperlink untuk memberikan perintah pada aplikasi windows phone tersebut :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace NavigationBetweenPage.View
{
public partial class SecondPage : PhoneApplicationPage
{
public SecondPage()
{
InitializeComponent();
}

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
string nama = "";
if (NavigationContext.QueryString.TryGetValue("nama", out nama))
{
namaTB.Text = nama;
}

string umur = "";
if (NavigationContext.QueryString.TryGetValue("umur", out umur))
{
umurTB.Text = umur;
}
string name = "";
if (NavigationContext.QueryString.TryGetValue("name", out name))
{
nameTB.Text = String.Format("Name = {0}", name);
}

}

private void sVbBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/ThirdPage.xaml?name=" + nama, UriKind.Relative));
}

private void sVaBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FirstPage.xaml?name=" + nama, UriKind.Relative));
}

private void sVcBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FourthPage.xaml?name=" + nama, UriKind.Relative));
}

private void sVdBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FifthPage.xaml?name=" + nama, UriKind.Relative));
}
}
}

Rabu, 20 November 2013

CERITA UTS WINDOWS PHONE

Halo gan kita kembali lagi dalam pengetahuan tentang windows phone. pada kesempatan kali ini saya akan sedikit membagi ilmu di hasil UTS saya walaupun ini sederhana saya harap ini dapat menambah lagi wawasan anda tentang pelajaran windows phone.

yang kali ini kita akan membuat yaitu :
1. menerima/mengirim input dari dan ke user
2. fungsi if dan switch statement berdasarkan nilai input yang dimasukkan oleh user
3. fungsi for iteration
4. tanggal waktu sekarang dengan format ( 15 september 2013 08:00:00)
5. penggunaan net.class
6. membuat class dan namespace pada file baru
7. penggunaan collection

Pertama-pertama kita akan membahas tentang Input Accepting. Drag and drop button, textbox dan 2 buah textblock. Ubah name dan content atau teksnya di properties *lebih detail baca postingan Input Accepting.

Pertama kita akan coba mengetik scrip yang ada di bawah ini.

private void ClickMeBT_Click(object sender, RoutedEventArgs e)
{
MyTextBlock.Text = "";
string test = MyTextBox.Text;
MyTextBlock.Text = test;
}

Kemudian lanjut sesi Date and Time. Drag and drop button dan textblock. Ubah name dan content atau teksnya di properties *lebih detail baca postingan Play with Date and Time.
Dan ketikkan coding berikut ini :
private void showTimeBT_Click(object sender, RoutedEventArgs e)
{
DateTime myTime = DateTime.Now;
//timeTextBlock.Text = myTime.ToString();
timeTextBlock.Text = myTime.ToString("dd MMMM yyy hh:mm:ss");
}
Terakhir sesi If Statement. Drag and drop button, textbox dan 2 buah textblock. Ubah name dan content atau teksnya di properties *lebih detail baca postingan If Statement.

Dan ketikkan coding berikut ini :

private void PlayButton_Click(object sender, RoutedEventArgs e)
{
string newValue = InputTextBox.Text;
if (newValue == "1")
{
ResultTextBlock.Text = "...........";
}
else if (newValue == "2")
{
ResultTextBlock.Text = "...........";
}
else if (newValue == "3")
{
ResultTextBlock.Text = "............";
}
else
{
ResultTextBlock.Text = "................";
}
}
untuk lebih jelas susunan scriptnya seperti dibawah ini :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Globalization;

namespace UTS_2013
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}

private void textBox1_TextChanged(object sender, TextChangedEventArgs e)
{

}

private void okbt_Click(object sender, RoutedEventArgs e)
{
tbblock.Text = "Result : " + txbox.Text;

string message;
switch (txbox2.Text)
{

case "1":
message = " 1";
break;
case "2":
message = "2";
break;
case "3":
message = "3";
break;

case "a":
message = "selamat anda beruntung";
break;
case "b":
message = "selamat anda mendapatkan kesuksesan";
break;
case "c":
message = "ayoo semangat";
break;

default:
message = "salah";
break;
}

tbb2.Text = message;

string pesan = "";

for (int i = 0; i < 10; i++)
{
pesan = pesan + i.ToString() + System.Environment.NewLine;
}

tbb3.Text = pesan;

DateTime mytime = DateTime.Now;
tbb4.Text = mytime.ToString( "dd MMMM yyyy hh:mm:ss")

Button mynewbutton = new Button();
//inisialisasi instan objek dari class button
mynewbutton.Name = "newbutton";
mynewbutton.Height = 100;
mynewbutton.Width = 200;
mynewbutton.Content = "new button";
mynewbutton.Margin = new Thickness(100.0, 100.0, 100.0, 100.0);
//pada margin harus dilengkapi dengan new thickness kalau tidak di lengkapi dengan itu maka dia akan error
mynewbutton.HorizontalAlignment = HorizontalAlignment.Stretch;
mynewbutton.VerticalAlignment = VerticalAlignment.Stretch;
//setting properties nya

//ContentGrid.children.add(mynewbutton);
//untuk memindah kan button ke content grid ,contentgrid ini

TextBox mytextbox = new TextBox();
mytextbox.Name = "new textboxt";
mytextbox.Height = 72;
mytextbox.Width = 456;
mytextbox.Margin = new Thickness(14, 170, 0, 0);
mytextbox.TextWrapping = TextWrapping.Wrap;
mytextbox.Text = "new textbox";
mytextbox.VerticalAlignment = VerticalAlignment.Top;
//tidak bisa langung di tulis kan top ,jika error langsung saja di arahkan pointer nya ke arah yang error

//contentGrid.children.add(mytextbox);

}

private void textBox1_TextChanged_1(object sender, TextChangedEventArgs e)
{
}
}
}

inilah contoh gambar atau hasil projeknya.

untuk langkah selanjutnya kita coba mengetik angka atau huruf yang ada di atas.

dan kemngkinan besar hasilnya akan jadi seperti ini

Dan inilah hasilnya seperti gambar yang ada di atas.

Mungkin pertemuan kali ini saya cukupkan sampai disini dulu semoga ini bisa bermanfaat bagi kita semua. Jangan bosan-bosan ya gan karna masih banyak lagi yang perlu kita ketahui tentang apa itu windows phone.

Kamis, 14 November 2013

Ceritaku Minggu ini Belajar Cara Membuat Xam Syntax

Selamat berjumpa kembali dalam pembelajaran applikasi windows phone.
pada kesempatan kali ini kita akan mempelajari tentang xaml syntax, kita beri nama project XamlSyntax apabila kita membuat sebuah aplikasi maka akan tampil secara default template-template. sebelum itu saya akan memperkenalkan di xaml designer yaitu zoom untuk memperbesar an memperkecil tampilan terus grid yaitu memudahkan kita menempatkan posisi tempat karena sudah terdapat garis-garis pembantu di dalam pengerjaan, selanjutnya ada penghilang grid dan hide annotations, kemudian ada horizontal untuk tampilan horizontal maupun vertical, selanjutnya ada menghilangkan tampilan bawahnya dan mengatur berapa persen tampilannya, kemudian ada yang namanya document outline untuk melihat struktur font dan terdapat application bar, title panel, content panel di dalam application bar belum terdapat apa-apa apabila tampilan masih default, di dalam title panel terdapat application title dan page title, content panel adalah sebuah properti name untuk document outline, selanjutnya apabila kita ingin seperti apa tampilannya itu tergantung nyamannya pengguna dalam tampilan. seperti yang diketahui saat kita mendrag sebuah element dari toolbox akan secara otomatis membuat tampilan dan kodenya langsung ada. xaml hampir sama dengan xml, html, maka dengan pasti ada tampilan pembuka dan penutup, apabila kita ingin menggunakan beberapa element kita bisa membuat dengan sederhana tanpa harus banyak koding karena setiap element pasti ada penutupnya pembuka : <Grid, penutup : </Grid>

diatas adalah tampilan zoom dan show snap grid

ini adalah tampilan sebelum kita memilih/mengubah dari snap to gridlines

ini adalah tampilan saat kita memilih tampilan grid

ini tampilan untuk mereset pengaturan yang telah dipilih

ini tampilan show annotations

diatas adalah tampilan collapse panel yaitu untuk menutup panel tersebut agar kita hanya bisa melihat satu element saja

ini untuk menampilkan window secara vertical

ini untuk menampilkan window secara horizontal

ini adalah tampilan secara horizontal

ini adalah tampilan secara vertical

ini adalah menu document outline

didalam menu document outline terdapat app bar, layout root, title panel, content panel

disamping adalah tampilan menu dan koding dari title panel secara default

diatas adalah tampilan menu dan koding dari title panel secara default

diatas adalah tampilan menu dan koding dari content panel secara default

ini adalah menu swap panel untuk menukar posisi dari pengkodingan ataupun design

selanjutnya ada nama class keturunan nama class mainpage yang akan merepresentasikan hal tersebut, apabila kita ubah maka koding tidak akan bekerja sesuai perintah yang diinginkan.

<phone:PhoneApplicationPage
x:Class="AcceptingInput.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">


<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>


<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>


<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Button Content="Click Me" Height="72" HorizontalAlignment="Left" Margin="290,75,0,0" Name="ClickMeBT" VerticalAlignment="Top" Width="160" Click="ClickMeBT_Click" />
<TextBlock Height="53" HorizontalAlignment="Left" Margin="12,75,0,0" Name="MyTextBlock" Text="" VerticalAlignment="Top" Width="259" FontSize="40" />
<TextBox Height="75" HorizontalAlignment="Left" Margin="-3,6,0,0" Name="MyTextBox" Text="" VerticalAlignment="Top" Width="456" />
</Grid>
</Grid>




</phone:PhoneApplicationPage>

pada tampilan tersebut maka akan muncul beberapa koding dengan persamaan tujuan atau perintah yang membedakannya adala panjang koding tersebut

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace AcceptingInput
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}

private void ClickMeBT_Click(object sender, RoutedEventArgs e)
{
//string newValue;
//newValue = MyTextBox.Text;
//MyTextBlock.Text = "You Typed :" + newValue;
MyTextBlock.Text = "You Typed :" + MyTextBox.Text;
//string newValue;
//newValue = MyTextBox.Text;
//MyTextBlock.Text = "You Typed :" + newValue;
MyTextBlock.Text = "You Typed :" + MyTextBox.Text;

}
}
}

itulah hasil tentang xaml syntax jika anda peminat windows phone anda bisa mencoba membuat seperti apa yang ada di atas. sekian dan terimakasih lebih dan kurangnya mohon di maafkan kita bertemui lagi di lain waktu.

Rabu, 06 November 2013

Ceritaku Selanjutnya pada pembuatan Net Class and Silverlight.

Yah seperti biasa kita bertemu kembali pada pelajaran mata kuliah Windows Phone selanjutnya. yang kali ini kita akan blejar membuat "Net Class and Silverlight" didalam windows phone ini terdapat .Net Class Library yang dibuat oleh microsoft dalam silverlight ini sebagai framework, dalam fomat game biasanya .xne maka kita akan mengenal apa itu .Net Class and Silverlight.

DateTime myBirthday = new Datetime(1992, 11, 28);
//datetime mybirthday = datetime.parse(“12/7/1990”);
Timespan myage = datetime.now.subtract (mybirthday);
//mytextblock.text = string.format(“{0} hari”, myage.days);
//mytextblock.text = relativetimeago(myage);

Timespan postime = datetime.now.subtract (datetime.now.addminutes(-5));
String newstring = string.format(“{0}”, “hello”);
Mytextblock.text = relativetimeago(postime);
/*
Keterangan
Using system.globalization;
* http://msdn.microsoft.com/en-us/library/8kb3ddd4.aspx
/*

//datetime datetimevalue = datetime.now;
//cultureinfo cultureinfo = new cultureinfo(“id-ID”);
//mytextblock.text = datetimevalue.tostring(“dddd, dd mmmm yyyy hh:mm:ss”, cultureinfo);

}
Private string relativetimeago(timespan timespan)
{
Const int second = 1;
Const int minute = 60*second;
Const int hour = 60*minute;
Const int day = 24*hour;
Const int month = 30*day;

dari script diatas adalah sistem class yang sudah disediakan oleh microsoft windows phone

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Globalization;

namespace DateAndTime
{
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
}

private void ShowTime_Click(object sender, RoutedEventArgs e)
{
DateTime ShowTimeBt = DateTime.Now;
//TimeTextBlock.Text = ShowTime.ToString();
//TimeTextBlock.Text = String.Format("Date{0}, Time{1}", ShowTimeBt.ToShortDateString(), ShowTimeBt.ToShortTimeString());
//TimeTextBlock.Text = String.Format("Date{0}, Time{1}", ShowTimeBt.ToShortDateString(), ShowTimeBt.ToShortTimeString());

//TimeTextBlock.Text = DateTime.Now.AddDays(5).ToString();
//TimeTextBlock.Text = DateTime.Now.AddDays(5).ToString();

//TimeTextBlock.Text = DateTime.Now.Month.ToString();

//CultureInfo cultureinfo = new CultureInfo("id-ID");
//TimeTextBlock.Text = ShowTimeBt.ToString("dddd, dd MMMM yyyy hh:mm:ss", cultureinfo);

DateTime = myBirthday = new DateTime(1993, 11, 28);
TimeSpan timespan = DateTime.Now.Subtract(myBirthday);
TimeTextBlock.Text = String.Format("{0} hari {1} jam {2} detik", timespan.Days, timespan.Hours, timespan.Seconds);
}
}
}

Untuk selanjutnya

Kita coba melakukan beberapa percobaan:

button mynewbutton = new button();

mynewbutton.name = "newbutton";

mynewbutton.height = 100;

mynewbutton.width = 200;

mynewbutton.content = "new button";

mynewbutton.margin = new thickness(100.0, 100.0, 100.0);

mynewbutton.horizontalalignment = horizontalalignment.stretch;

mynewbutton.verticalalignment = verticalalignment.stretch;

contentgrid.children.add(mynewbutton);

textbox mytextbox = new textbox();

mytextbox.name = "newtextbox";

mytextbox.height = 72;

mytextbox.weight = 456;

mytextbox.margin = new thickness(14, 170, 0, 0);

mytextbox.textwrapping = textwrapping.wrap;

mytextbox.text = "new textbox";

mytextbox.verticalalignment = verticalalignment.top;

<Grid.RowDefinitions>

</Grid.RowDefinitions>

</StackPanel>

</Grid>

Mungkin cuckup sampai disini dulu pelajaran kali ini untuk selanjutnya kita akan ketemu lagi di lain waktu. Semoga pelajaran kali ini bisa menambah wawasan dan pengetahuan tambahan pada kita tentang pembuatan aplikasi Windows Phone.