Membuat Animasi Sederhana Menggunakan Blend di Aplikasi Metro Style

Hai, hari ini saya akan mempraktekkan sedikit untuk membuat animasi sederhana menggunakan aplikasi Blend. Aplikasi Blend sudah terinstalkan otomatis jika kalian menginstal aplikasi Visual Studio 2012.

Sebenarnya dengan aplikasi Blend kita akan sangat mudah untuk mendesign aplikasi metro style. Selain itu untuk membuat objek bergerak (animasi) pun dapat dilakukan dengan menggunakan Blend.

Langsung saja kita membuat aplikasinya.

 

 

Pembuatan Aplikasi

Sekarang kalian buatlah Blank App (XAML) dan beri nama : AplikasiAnimasi

Aplikasi Animasi 1

Setelah aplikasi kalian terbuat, masuklah ke MainPage.xaml dan tulislah code berikut di bagian grid :

<Grid Background=”#FF804D23″>
<Rectangle x:Name=”kotak” Fill=”#FF722AB9″ HorizontalAlignment=”Left” Height=”136″ Margin=”0,632,0,0″ Stroke=”Black” VerticalAlignment=”Top” Width=”133″/>

</Grid>

Sehingga tampilan aplikasi kalian menjadi seperti berikut.

Aplikasi Animasi 2

Sekarang klik kanan pada MainPage.xaml pada bagian solution explorer dan pilih “Open in Blend…”.

Aplikasi Animasi 3

Setelah kalian masuk aplikasi Blend, pilihlah new (tanda +).

Aplikasi Animasi 4

Kemudian beri nama “kotakAnimation” dan tekan OK.

Setelah itu akan tampil animation editor dan lakukanlah animasi pada kotak yang kalian sudah buat sebelumnya.

Aplikasi Animasi 5

Setelah itu save pekerjaan kalian dan close Blend dengan cara klik close di kanan atas.

Setelah itu masuklah ke halaman MainPage.xaml.cs.

kemudian pada bagian constructor tambahkan code “kotakAnimation.begin();”

 

 

Jalankan Aplikasi

Waktunya menjalankan aplikasi. Sekarang run project kalian dan lihatlah kotak yang kalian bergerak sesuai dengan animasi yang kalian buat pada aplikasi Blend.

Aplikasi Animasi 6

 

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout /  Ubah )

Foto Google

You are commenting using your Google account. Logout /  Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout /  Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout /  Ubah )

Connecting to %s

%d blogger menyukai ini: