RSS

Tuesday, December 21, 2010

Make Divide and Conquer buat nyelesein problem Fibonacci

0 comments
Tiba tiba saya kepikiran soal algoritme yang dulu dipelajari di kampus. Algoritme kan pada dasarnya merupakan langkah terstruktur buat menyelesaikan masalah tertentu. Jadi belom tentu suatu algoritme yang cocok buat problem A bisa diterapkan dengan tepat di problem B. Salah satu algoritme yang pernah ditanyain waktu saya interview kerja (di tempat yang saya ga jadi ambil) adalah algoritme divide and conquer dan dynamic programming.Saya pernah belajar dua algoritme ini tapi saya ngga pernah ngerti kapan saya harus memutuskan pake divide and conquer atau dynamic programming. Hingga beberapa menit yang lalu saya mendapat sedikit pencerahan (makanya langsung ditulis biar ga lupa).

Oke kita coba liat dulu deh divide and conquer (saya inget kalo yang ini ni) yang dulu pernah diterapkan oleh bangsa Belanda yang sukses megobrak-abrik Nusantara. Algoritme ini udah ada sejak awal abad ke 19. Bahkan penerapannya sebenernya udah dari kapan tau, tapi baru dirumuskan aja kayaknya. Pada dasarnya algoritme ini bekerja dengan cara memecah suatu masalah besar menjadi sub-sub masalah hingga ke sub masalah terkecil dan menyelesaikan setiap sub masalah tersebut. Istilah peribahasanya, sedikit-sedikit lama lama jadi bukit. Ya secara logika kan kalo ada masalah besar kita selesein pelan-pelan dari yang paling gampang dulu, satu per satu, lama-lama kan selesai tuh semua masalah.


Nah, misalnya kita diberikan masalah Fibonacci. Problem yang selalu diberikan di hamper semua mata kuliah. Kan Fibonacci itu intinya jumlah dua bilangan sebelumnya dalam suatu deret, atau yang kalo ditulis dalam bahasa matematika jadi begini:


Mari kita coba pecahkan problem ini dengan algoritme divide and conquer. Problem ini bisa kita selesaikan dengan algoritme yang kira-kira bunyinya begini:

If n<=1 return n

else return F(n-1) + F(n-2)


Oke, kalo algoritme itu kita jalanin untuk meghitung Fib(4), yang terjadi adalah seperti tree dibawah ini:

Coba deh liat, Fib(2) diulang perhitungannya sampe 2 kali.. Bayangkan kalo kita menghitung Fib(6), maka akan nada penghitungan F(6)=F(5) + F(4), F(5)=F(4)+F(3), yang melibatkan dua kali penghitungan F(4) yang artinya aka nada 4 kali penghitungan F(2). Berarti kalo kita mau itung F(n) bakal makin banyak perulangan yang dilakukan dan bakalan menuju ke eksponensial time ni algoritmenya.


Hmm, gimana cara menyelesaikan si Fibonacci ini supaya jalannya algoritme ga panjang ya? Kayaknya sih bisa pake Dynamic Programming.. Oke, nanti saya cobain lagi deh.. hehe..

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Thursday, July 15, 2010

Learning Content Development System (LCDS) Tutorial (part 4)

0 comments

1. Selanjutnya, kita akan mencoba membuat animasi pada konten kita. Pertaman, klik topic yang masih kosong.

clip_image001

2. Kemudian, pada template, pilihlah Watch (lihat gambar) dan klik radio button Animation

clip_image005

3. Nah, sekarang muncullah template animation. Template inihanya terbagi dari dua bagian, yaitu bagian teks dan bagian animasi. Tuliskanlah keterangan atau teks lain di bagian teks.

clip_image007

4. Animasi yang dimasukkan dapat berupa *.swf, *.xaml dan *.wmv. Sekarang ini kita cobakan saja menggunakan file berformat wmv yang terdapat di sample video pada windows 7. Kopikan file video dari C:\Users\Public\Videos\Sample Videos ke C:\ProgramData\Microsoft Learning\LCDS\courses\pelajaran_saya\course\media. Klik Browse dan pilih video atau animasi yang akan kita masukkan. Pilih videonya dan tekan OK.

5. Berikutnya, save course dan tekan tombol preview untuk melihat hasilnya.

clip_image008

6. Sekarang kita coba menggunakan fitur demonstration. Silahkan buat topic baru (lihat kembali langkah kerja 4). Dan pada template Watch , pilihlah Demonstration. Berbeda dengan animation, Demonstration menampilkan video atau animasi di window berbeda (tidak seperti fitur animation yang langsung menampilkan animasinya di halaman yang sama).

clip_image011

7. Pada template silahkan masukkan gambar dengan mengklik tombol Browse pada kolom Picture, dan masukkan video dengan cara mengklik tombol Browse pada kolom Demo. Ingat, sebelum dimasukkan ke dalam course, segala macam media harus dikopi terlebih dahulu ke C:\ProgramData\Microsoft Learning\LCDS\courses\pelajaran_saya\course\media.

clip_image012

8. Berikan penjelasan mengenai demonstrasi pada kolom Paragraph.

clip_image013

9. Tekan save dan klik preview untuk melihat hasilnya. Pada bagian hasilnya, klik tombol Launch untuk menjalankan animasi.

Booyah!

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Learning Content Development System (LCDS) Tutorial (part 3)

0 comments

Oke, di part ke tiga ini akan kita cobain fitur interactive job aid, selamat mencobaaaa..

1. Berikutnya, kita akan coba fitur Interactive Job Aid untuk membuat serangkaian pertanyaan boolean (Yes-No Question) dalam sebuah decision tree. Arsitektur informasi yang akan kita bangun misalnya seperti ini:

clip_image002

Silahkan klik salah satu Topic dalam course.

clip_image003

2. Berikutnya, masih dalam template interact, pilihlah radio button Interactive Job Aid.

clip_image004

3. Sekarang Anda akan melihat template baru muncul. Dalam template interactive job aid ini, kita melakukan penambahan pertanyaan sebagaimana kita menambah page pada fitur Adventure Activity. Kita buat pertanyaan pertama, silahkan isikan pertanyaan di kolom “Yes/No Question”, misalkan tulislah pertanyaan yang tercantum pada langkah 26, “Apakah hewan ini berkaki empat?”

clip_image005

4. Kemudian di bagian bawah ada kolom If Yes, klik radio button “Go to Question”, dan isikan kotak di sampingnya dengan angka 2 (secara default sudah terisi). Lakukan hal yang sama untuk kolom If No.

clip_image006 clip_image007

5. Kita telah memerintahkan kepada aplikasi untuk pergi ke pertanyaan ke 2 jika siswa memilih jawaban “Yes” pada pertanyaan pertama. Oleh karena itu kita perlu membuat pertanyaan ke 2. Klik tombol “Next Question” untuk membuat pertanyaan ke 2.

clip_image008

6. Isikan pertanyaan kedua, “Apakah hewan tersebut karnivora”. Pada kolom If Yes, klik radio button Display Decision untuk memunculkan kesimpulan dari decision tree. Pada kolom Display Decision tuliskan “Hewan itu adalah Harimau”. Pada kolom If Yes, klik juga radio button Display Decision dan tuliskan “Hewan itu adalah Sapi”.

7. Simpan course dengan menekan tombol Save atau Ctrl+S.

8. Tekan tombol preview (lihat kembali langkah 18) dan lihat hasilnya.

clip_image009

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Learning Content Development System (LCDS) Tutorial (part 2)

0 comments

Yup, pada part 1 kita sudah berkenalan dengan fitur pertama dari LCDS. Sekarang kita akan mencoba tentang template drag and drop.

1. Selanjutnya, kita coba membuat kuis sederhana dengan fitur drag and drop. Klik Introduction pada Course Structure dan pastikan Introduction terpilih (sebenarnya ini bisa dilakukan pada bagian manapun dalam struktur, tapi supaya seragam, kita samakan aja dulu ya..)

clip_image003

2. Masih pada fitur interactivity (yang gambar mouse itu), pilih radio button bertuliskan Drag and Drop.

clip_image004

3. Maka, akan muncul template drag and drop. Fitur ini intinya kita membuat beberapa kategori beserta anggota masing-masing kategori tersebut. Misalkan kita punya table seperti ini:

Hewan

Tumbuhan

Makanan

Kuda

Beringin

Tahu

Ayam

Anggrek

Mie Rebus

Sapi

Mawar

Roti

Dengan fitur ini kita membuat suatu kuis untuk mencocokkan elemen elemen seperti kuda, mawar, dan roti dengan kategorinya.

4. Oke, kita fokus ke template drag and drop yang muncul. Pada kolom Category 1,ketikkan “Hewan”, kemudian di bawahnya, yaitu pada kolom Category 1 item, ketikkan Kuda, kemudian Ayam, dan Sapi. Lakukan seterusnya untuk kategori lain.

clip_image005

5. Save course dengan cara menekan tombol Save atau Ctrl + S, lalu tekan tombol Preview

6. Sekarang, silahkan dicoba kuisnya.. Drag and drop item-item ke dalam kategori yang tepat. Jika sudah yakin dengan jawabannya, tekan tombol SUBMIT untuk mengetahui hasilnya.. Asik kan.. J

clip_image006

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Learning Content Development System (LCDS) Tutorial (part 1)

1 comments

Belajar melalui media online sudah ada di depan mata dan kita akan mencoba berkenalan dan mengoperasikan tool LCDS untuk membuat materi pelajaran online. Sudah siap? Mari kita mulai berkarya dengan LCDS.

1. Bukalah program LCDS dengan cara klik Start à All Programs à Microsoft Learning àLearning Content Development System

clip_image004

2. Oke, setelah diklik, akan muncul window LCDS yang tampilannya seperti gambar di bawah ini

clip_image005

3. Sekarang, buatlah Course baru dengan cara klik New (ada di sudut kiri atas). Kemudian akan muncul jendela New – Webpage Dialog. SIlahkan isikan nama course yang anda inginkan, misalnya “Pelajaran Saya” lalu tekan OK.

4. Nah, setelah course sukses dibuat, akan muncul course structure yang menunjukkan struktur hierarki dari konten pelajaran ini. Terdapat empat tingkatan dalam struktur course ini yaitu “course”, “module”, “lesson”, dan “topic”.

clip_image023

5. Klik module pada course structure. Pastikan tulisan “Module” di-highlight oranye.

clip_image036

6. Sekarang kita mulai berkarya. Klik tombol dengan gambar Mouse (lihat gambar di bawah).

clip_image037

Ini adalah template interact yang dapat kita gunakan untuk membuat konten pembelajaran yang interaktif. Kita akan coba satu-per-satu template yang ada di dalam interact ini.

7. Pilihlah radio button Adventure Activity, maka akan muncul template pada bagian Page

clip_image038

8. Pada bagian Text, ketikkan “Silahkan pilih satu dari beberapa pilihan ini.”

clip_image040

9. Untuk memasukkan gambar, kita harus terlebih dahulu mengkopi gambar yang akan kita masukkan ke folder

C:\ProgramData\Microsoft Learning\LCDS\courses\pelajaran_saya\course\media

Silahkan kopi gambar yang anda inginkan (misalkan dari C:\Users\Public\Pictures\Sample Pictures) ke folder tersebut. Sebaiknya, sesuaikan dulu ukuran gambar yang akan diletakkan di halaman ini agar gambar tidak terpotong.

10. Setelah gambar dikopi, klik Browse, kemudian pilihlah gambar yang telah kita kopi tadi.

clip_image042

11. Berikutnya, kita buat beberapa halaman lagi, caranya, tekan tombol next page (lihat gambar)

clip_image044

Secara otomatis, sistem akan membuat halaman ke-2 yang masih polos, jadi jangan panic kalau gambar koala dan tulisan di kolom teks menghilang.

clip_image045

12. Isi halaman 2 dengan tulisan “INI HALAMAN 2” dan gambar seperti halnya kita mengisi halaman 1 pada langkah kerja 8 sampai 10.

13. Buatlah halaman ke-3 lalu isi dengan tulisan “INI HALAMAN 3” dan gambar

14. Kemudian, kembalilah ke halaman 1 dengan cara menekan tombol previous sebanyak 2 kali

15. clip_image046

16. Oke, kita sudah kembali ke halaman 1, sekarang, pada bagian bawah template ada tulisan “Choice 1”, “Choice 2”, dan seterusnya. Tuliskan “Ke halaman 2” pada kolom choice 1, kemudian pada kolom go to page, ketikkan angka 2.

clip_image047

Lakukan hal yang sama untuk kolom Choice 2, namun arahkan pilihan ini pada halaman 3.

17. Nah sekarang tekan tombol Save pada bagian atas window atau tekan Ctrl + S untuk menyimpan course.

18. Kemudian, tekan tombol Preview pada bagian atas window.

clip_image048

19. Setelah tombol preview diklik, maka akan muncul window yang berisi konten yang telah kita buat.

clip_image049

Berikutnya kita lanjut di part 2 ya…

Lanjutkan ke:

- LCDS Tutorial Part 2

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Monday, May 3, 2010

Kenapa di Theme Windows 7 Adanya Theme "United States"

2 comments
Yah, sebenernya wajar-wajar aja sih kalo themes yang disediain di Windows 7 yang berhubungan dengan negara adanya United States, lha wong mereka yang bikin.. Tadinya saya berpikir begitu aja, tapi ternyata themes Aero yang disediakan ngga cuma United States aja loh.. Emang sih, Indonesia tetep ngga ada, tapi ternyata ada yang lain juga. Themes yang lain tidak dimunculkan sehubungan dengan region ketika kita setting Windows 7. Jadi si Windows 7 ini pinter, dia bisa deteksi posisi dan memunculkan themes yang cocok aja (Tapi kenapa Indonesia ngga ada juga??)..

Nah, untuk mengaktifkan tema tersembunyi ini ternyata gampang banget. Tema-tema negara yang lain secara default disimpan oleh Windows 7 di C:\Windows\Globalization\MCT\. Di folder ini, terdapat beberapa tema negara seperti :
MCT-AU : Australia
MCT-GB : Great Britain
MCT-US: United States
MCT-CA: Canada
MCT-ZA: South Africa

Untuk mengaktifkannya, kita perlu ngakses folder Theme dan langsung aja klik dua kali file theme yang ada di situ.. Asiik.. Tapi kapan ya Indonesia masuk ke sini? Musti ada pentolan Microsoft di Amerika sono yang asli Indonesia kayaknya.. :)

-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Ternyata Banyak Shortcut Asik di Windows 7

1 comments
Sore ini lagi ngantor bareng sule yang tidak lain tidak bukan adalah empunya syabac.web.id dan ngobrolin tentang shortcut-shorcut asik di Windows 7. Windows 7 dengan fitur Aeronya menyediakan fasilitas yang bener-bener bisa memanjakan penggunanya dengan antarmuka dan interaksi yang asik banget. Nah, untuk melengkapi experience dalam ber-Seven, kita cobain yuk shortcut-shortcut asiknya..

* Win + Tab : Menampilkan windows Aero, kita bisa gonta-ganti window yang lagi aktif dengan tampilan 3D yang muantab..
* Win + Spasi : Membuat semua window yang sedang terbuka menjadi transparan dan menampilkan desktop. Setara sama kalo kita mouse over di bagian pojok kanan bawah layar.
* Win + Panah Atas: Maximize Wiindow yang sedang aktif
* Win + Panah Bawah: Minimize Window yang sedang aktif
* Win + Panah Kanan: Memposisikan Window yang aktif menjadi dock kanan
* Win + Panah Kiri: Memposisikan Window yang aktif menjadi dock kiri
* Wiin + P : Memunculkan pilihan projector, bisa banget kta pake kalo kita lagi nyambungin komputer ke proyektor
* Win + T: Memfokuskan ke taskbar yang sedang terbuka.. Bisa kita pakai untuk milih window mana yang mau kita aktifin.
* Win + Tanda Plus / Minus: Zoom in dan out windows, pas kita ngeklik ini, otomatis langsung muncul Magnifiernya.
* Kita juga bisa ngegoyang-goyang window yang lagi aktif untuk "ngerontokin" window yang lain.. Kalo kita goyang lagi, window yang pada rontok masuk taskbar tadi bakal muncul lagi..

Apa lagi ya? Nanti kalo ketemu lagi langsung saya update deh.. :)

-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Sunday, May 2, 2010

On/Off Windows 7 Feature: Jawaban Atas Pertanyaan “Mana Gamenya Windows 7?”

0 comments
Ketika pertama kali mengoperasikan Windows 7 Professional, hal pertama yang saya cari adalah Game. Saya tidak kunjung sukses menemukan keberadaan game di Windows 7 sebagaimana Windows seri terdahulu. Ternyata, secara default, game memang tidak dimunculkan di Windows 7 Professional ini. Namun, kita bisa dengan mudah menyalakan dan mematikan fitur Game dan fitur-fitur lainnya di Windows 7. Oke, untuk mengaktifkan dan menonaktifkan fitur Windows 7, kita perlu mengakses Control Panel -> Programs and Feature. Maka akan muncul jendela seperti di bawah ini:

Dari Program and Features, kliklah pilihan Turn Windows Feature On or Off di bagian sebelah kiri jendela. Kemudian kita akan menemukan jendela seperti ini:

Nah, di sana kita dapat menemukan fitur-fitur yang sudah dan belum dimunculkan di Windows 7 kita. Untuk mengaktifkan games, kita tinggal mengklik checkbox Games atau memilih game yang akan kita aktifkan. Setelah proses ini selesai dan computer di restart, maka kita dapat memainkan Game khas Windows.


Tunggu dulu, Windows Movie Makernya manaaaa??? Cari jawabanya di kodingsambilngopi.blogspot.com.


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Power Efficiency Diagnostics Report - Windows 7

0 comments
Dalam tulisan sebelumnya di "Analisis Efisiensi Energi Windows 7", saya telah menyampaikan tentang fitur powercfg untuk menganalisis efisiensi energi pada komputer Anda. Pada postingan ini saya akan mengajak anda melihat hasil analisis tersebut. Pada bagian pertama report, akan dituliskan spesifikasi sistem Anda. Hasil pada komputer saya adalah sebagai berikut:

Computer Name CERZ
Scan Time 2010-05-02T05:43:13Z
Scan Duration 60 seconds
System Manufacturer Acer
System Product Name Aspire 4732Z
BIOS Date 06/24/2009
BIOS Version V1.01
OS Build 7600
Platform Role PlatformRoleMobile
Plugged In false
Process Count 58
Thread Count 963
Report GUID {28faf7f8-1ac3-4659-ad2d-94e8fcf2fabd}
Durasi analisis adalah 60 detik (ini sudah dafault), kemudian Plugged In adalah status apakah komputer dengan tenaga baterai atau listrik. Pada bagian berikutnya adalah daftar masalah yang menyebabkan penggunaan komputer menjadi tidak efisien. Jangan takut, Error di bawah hanya menampilkan masalah efisiensi power saja. Misalnya, pada komputer saya terdapat masalah seperti ini:

Errors

Power Policy:Dim timeout is disabled (On Battery)
The display is not configured to automatically dim after a period of inactivity.
Power Policy:Sleep timeout is disabled (On Battery)
The computer is not configured to automatically sleep after a period of inactivity.
Power Policy:Dim timeout is disabled (Plugged In)
The display is not configured to automatically dim after a period of inactivity.
Power Policy:Sleep timeout is disabled (Plugged In)
The computer is not configured to automatically sleep after a period of inactivity.
CPU Utilization:Processor utilization is high
The average processor utilization during the trace was high. The system will consume less power when the average processor utilization is very low. Review processor utilization for individual processes to determine which applications and services contribute the most to total processor utilization.
Average Utilization (%) 22.25
Dalam laporan itu dicantumkan bahwa terdapat fitur-fitur berkaitan dengan power yang saya disable seperti saya mematikan dim light monitor dan menggunakan tipe power high performance yang menyebabkan penggunaan energi meningkat 22.25%. Sleep time-out yang didisable dianggap sebagai gangguan terhadap efisiensi karena menyebabkan konsumsi power tidak dapat dihemat.

Hasil laporan ini dapat digunakan sebagai bahan pertimbangan dalam membuat kinerja komputer dan pemanfaatan power lebih efisien terutama pada saat mengunakan baterai. Semoga hasil ini dapat bermanfaat bagi kita dalam mengoptimalkan kinerja Windows 7 anda. Have a nice Seven-ing (aduh maksanya)..


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Saturday, May 1, 2010

Analisis Efisiensi Energi Windows 7

0 comments
Salah satu fitur yang dimiliki oleh Windows 7 adalah Power Eficiency Diagnostic Report yang bisa kita pakai untuk melihat seberapa efisienkah penggunaan energi komputer kita. Diagnosa dilakukan dengan cara menganalisa kinerja komputer selama 60 detik yang berkaitan dengan konfigurasi layar monitor, automatisasi dim dan penggunaan hardware lain yang menyedot energi komputer. Setelah analisis ini selesai, maka windows secara otomatis akan mengenerate sebuah report yang menampilkan masalah efisiensi pada komputer kita.

Oke, kita cobain aja langsung.. Pertama silahkan buka command prompt (cmd) sebagai administrator (bisa dengan cara mengklik cmd sambil menekan CTRL + SHIFT). Setelah masuk, kita akan memanggil "powercfg /energy". Saya mencobakan di cmd saya dan menunculkan hasil seperti ini:


Terlihat command tadi mengaktifkan tracing sistem selama 60 detik. Selama 60 detik ini, Windows mengobservasi kegiatan yang dikerjakan dalam task-task Window. Setelah tracing selesai, silahkan buka file yang berada di C:\Users\Nama User Anda\energy-report.html di browser.

Mengenai isi report ini akan kita bahas di post Power Efficiency Diagnostic Report.. Selamat menganalisa.. :)


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Sunday, April 25, 2010

Database Management Tool Dengan WPF

0 comments
Hi, sekarang ini saya lagi ngerjain skripsi dan saya musti masukin data tanaman banyak banget. Daripada repot musti masukin satu-satu ke SQLServer, saya bikin aplikasi Add-Update-Delete data dengan WPF. Saya mau share aplikasi yang saya bikin itu ke temen-temen semua. Aplikasi ini bertugas untuk membantu saya memanipulasi database tanaman untuk table yang namanya “daftar_tanaman”.
Saya menggunakan LinQ to SQL untuk mengakses database dan menampilkannya di data grid dan untuk saya manipulasi.

Aplikasinya windowless, iseng-iseng aja.. Source code aplikasi ini bisa di-download di sini. Semoga bermanfaat ya.. 


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Menampilkan Data Dari SQLServer ke Datagrid pada WPF dengan LinQ to SQL

0 comments

Hai, kali ini kita akan coba bikin aplikasi WPF sederhana untuk menampilkan data dari database SQLServer dengan menggunakan LinQ to SQL. Mari kita coba sama-sama.

  1. Bukalah Microsoft Visual Studio (saya pakai VStud 2008) dan buat project aplikasi WPF bernama "TesDatabaseWPF"
  2. Kita akan pakai database Northwind untuk latihan ini, jadi kalau kamu belum punya sample database Northwind, silahkan dulu download yaa.. Nah, pada Server Explorer (View-> Solution Explorer), klik kanan pada "Data Connection", maka akan muncul window Add Connection.
  3. Pastikan Data Source adalah "Microsoft SQL Server Database File (SqlClient)", lalu browse file database Northwind. Kalau sudah, maka akan terbuka koneksi SQLServer ke database Northwind.
  4. Pada Solution Explorer, klik kanan pada TestDatabaseWPF, pilih Add->New Item.
  5. Pilihlah "LinQ to SQL Classes", beri nama "MyNorthwind.dbml" kemudian klik Add
  6. Dari Server Explorer, drag and drop table "Supplier" ke MyNorthwind.dbml, lalu save (Ctrl+s)
  7. Berikutnya, drag-drop lah sebuah datagrid ke Window1.xaml dan beri nama "MyDataGrid"
  8. Berikutnya, pada Window1.xaml.cs, ketikkan kode berikut:

public
partial
class
Window1 : Window

{
public Window1()

{

InitializeComponent();

InitData();

}



private
void InitData()

{


try

{

MyNorthwindDataContext db = new
MyNorthwindDataContext();


var DataResult = from
Supplier
in db.Suppliers


select Supplier;

this.MyDataGrid.ItemsSource = DataResult.ToList<Supplier>();

}

catch

{

MessageBox.Show("Data Gagal Dimasukkan");

}

}

}


Berikutnya, silahkan coba run dengan menekan F5. Gimana? Bisa kan?



-- Koding Sambil Ngopi --
-- Farhad Alaydrus --

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Dasar Animasi Silverlight Dengan Expression Blend

0 comments

Ngga lengkap rasanya Silverlight tanpa animasi. Bagaikan nyetir mobil Ferari di kecepatan 5 km/jam di jalan tol. Silverlihgt memiliki kemampuan untuk memaksimalkan komponen grafis yang dimiliki PC untuk memberikan user experience yang luar biasa. Kita akan coba bikin animasi sederhana dengan menggunakan Storyboard. Storyboard adalah fitur yang tersedia di Expression Blend untuk kita gunakan dalam membuat animasi. Caranya gampang, mari kita coba sama-sama.

Pertama, buka dulu Expression Blend dan buat baru project Silverlight. Ceritanya, kita akan bikin animasi mobil-mobilan. Jadi, mari kita bikin dulu mobilnya. Ga usah ribet-ribet, kita bikin aja rectangle yang ceritanya akan jadi mobil juga ga apa-apa. Tapi silahkan berkarya loh ya, saya ngga mau ngebatesin.. hehe..

Oke, kalo udah jadi mobilnya, sekarang kita siap untuk bikin animasinya. Di bagian kiri, tepat di bawah tulisan "Objects and Timeline" klik tanda tambah (+) untuk membuat storyboard baru. Beri nama "MobilJalan". Nah, coba lihat perubahan tampilan pada Expression Blend. Di sebelah kiri muncul timeline yang akan kita pake untuk bikin animasinya.

Sekarang, klik pada angka 2, artinya kita akan memberikan posisi akhir mobil pada detik ke-2. Pastikan garis oranye yang menandakan posisi aktif timeline berada pada detik ke-2. Sekarang, gerakkanlah mobil pada canvas (posisi mobil sekarang akan menjadi posisi akhir animasi).

Coba tekan tombol Play (segi tiga yang menghadap ke kanan pada timeline), nah gerak kan mobilnya.. Kalau sudah, tekan tombol "x" persis di bawah tulisan "Objects and Timeline" untuk menutup storyboard. Sekarang, kita akan buat button yang akan men-trigger animasi tersebut. Caranya gampang banget, dari toolbar di sebelah kiri, klik button dan gambarlah sebuah button di canvas.

Sekarang kita sudah punya button, pada bagian Properties paling atas, beri button tersebut nama "ButtonAnimasi" dan ubah tulisan di dalamnya menjadi "Jalan" (mengubah tulisan Button dapat dilakukan dengan cara mengklik 2 kali Button tersebut). Nah, kita udah punya button yang akan menjadi trigger. Sekarang, dalam kondisi ButtonAnimasi terpilih, pada Properties, klik gambar petir (Events) untuk menambahkan event pada button.

Sekarang, di bagian property klik dua kali pada textbox dengan label "Click". Dengan mengklik dua kali pada textbox ini, kita akan membuat handler untuk event tombol ButtonAnimasi jika ia diklik. Saat kita klik, akan terbuka file MainPage.xaml.cs. Kemudian silahkan tambahkan kode seperti di bawah ini:

private
void ButtonAnimasi_Click(object sender, System.Windows.RoutedEventArgs e)

{

MobilJalan.Begin();

}


Nah, sekarang coba run Aplikasi dengan menekan F5, lalu klik tombol "Jalan", maka si mobil akan bergerak. Bisa kan? Kalo udah bisa, coba explore Animasi untuk event lain, misalnya animasi kalau tombol di mouse over dan lain-lain.. Selamat mencoba..



-- Koding Sambil Ngopi --
-- Farhad Alaydrus --

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Aplikasi Windows Tanpa Window

0 comments
Windows Presentation Foundation memungkinkan kita untuk membuat aplikasi Window tanpa Window. Nah loh.. Jadi istilahnya kita akan bikin jendela tanpa frame. Kita akan coba bikin jendela tanpa frame itu di Expression Blend 3. Jadi, pertama mari kita buka Expression Blend 3, lalu pilih project WPF Application. Nah, sekarang kita mau bikin window yang bentuknya round-rectangle.

Jadi, kita bikin aja rectangle di Expresion Blend seukuran Window kita. Pada bagian Properties, atur Radius X dan Radius Y menjadi 20 untuk membuat sudut rectangle itu “bulet”. Jreng, jadilah calon window kita. Ubahlah warna rectangle itu sesuai selera. Kalo udah, sekarang klik layer “Window”.

Kemudian, dalam kondisi Window terpilih, pada Properties ceklis pilihan Allow Transparency.

Nah, sekarang window kita udah ngga ber-frame, tapi bentuknya masih kotak. Sekarang, dalam kondisi layer Window terpilih, pilihlah No Brush sebagai warna background Window, dan Jreng, hilanglah si Window kotak itu.

Sekarang silahkan jalankan aplikasi kita itu dengan menekan tombol F5 dan lihat keajaiban apa yang terjadi..


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Photoshop to Expression Blend

0 comments

Photoshop, tool desain keluaran Adobe yang udah sering banget kita denger. Desainer biasanya pasti jagoan banget make Photoshop. Saya pribadi, dalam membuat desain aplikasi, seneng ngedesain pake Photoshop sebelum saya transformasikan ke dalam form aplikasi. Tapi biasanya apa yang udah saya bikin keren-keren di Photoshop jadinya biasa aja di form aplikasinya (biasanya desain keren ngga bisa diulang dua kali, hehe). Nah, untungnya, Microsoft Expression Blend memungkinkan kita untuk meng-import file psd langsung ke XAML pada aplikasi Silverlight atau WPF kita. Disupportnya file psd ini merupakan bagian dari interoperability Microsoft yang sekarang semakin gencarnya. Oke, mari kita cobain..

Pertama, sediakan dulu file photoshop yang akan kita import. Sebelum diimport ke XAML, sebaiknya susun dulu layer-layer dalam photoshop dengan rapi. Beri nama yang jelas untuk setiap layer. Misalkan, gambar tombol berilah nama “MyButton” atau nama apapun yang sesuai dengan fungsi layer itu nantinya. Pastikan juga kamu udah menggabung (merge) setiap komponen yang akan jadi satu. Misalnya buletan tombol dan teks diatas tombolnya usah disatuin dalam satu layer. Tujuan me-merge komponen itu adalah supaya waktu nanti diimport ke Expression Blend udah dalam kondisi rapi dan siap pakai. Oke, kalo sudah rapi layer-layernya, langsung aja save jadi file psd.

Sekarang kita pindah ke Expression Blend. Buat project baru, bisa Silverlight, bisa WPF, tapi kali ini biar seragam, kita cobain aja WPF Application dulu. Setelah project terbentuk, pastikan MainPage.xaml yang menjadi halaman utama kita dalam keadaan aktif. Supaya nanti import photoshopnya rapi, sesuaikan dulu ukuran MainPage.xaml sesuai dengan ukuran file psd yang udah kita bikin. Sekarang bagian magic-nya..

Klik File->Import Adobe Photoshop File, dan browse file psd yang akan kita import. Setelah dipilih, akan muncul window baru. Nah, keliatan kan di situ, layer-layer yang udah kita bikin di photoshop. Kita bisa pilih semua atau beberapa layer aja yang mau diimport. Kalau udah sesuai, tekan OK dan BOOM jadilah sudah user interface XAML kita. Tapi tunggu dulu, button yang udah kita bikin belom bisa langsung dipake karena bentuknya masih berupa image. Kita harus bikin dia jadi button yang sebenar-benarnya button..

Klik aja ke gambar tombol yang akan kita jadikan button. Klik kanan pada gambar tombol, lalu pilih Make into control. Nah, akan muncul window macem-macem control yang bisa kita assign ke gambar tombol tadi. Pilih “Button” dan klik OK, maka sekarang gambar kita udah bisa dipakai sebagai button. Ulangi proses tersebut ke komponen-komponen lain dalam user interface kita.

Gimana, seru kan, ngedesain di Photoshop dan langsung disulap jadi user interface keren di Expression Blend?


-- Koding Sambil Ngopi --
-- Farhad Alaydrus --

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS