simple skin button flex

Simple Skin Button Flex

Belajar membuat skin button sederhana menggunakan Flash Developer

Langkah Pertama: Membuat Skin aset di Flash

Skin dapat dibuat dalam sejumlah aplikasi Adobe (Flash, Photoshop, Illustrator, Fireworks),

tetapi untuk mudahnya, kita akan berfokus pada Flash.

Pertama, mulailah buka lembar kerja baru di flash pilih Actionscript 3 file

Setelah itu import file image ke dalam library (image dapat di download disini)

Kemudian drag image ke dalam lembar kerja

Klik kanan pada image pilih convert to symbol

Pada kolom nama dan class isi dengan MyButton_Up,

Lakukan hal yang sama pada image yang satunya, Pada kolom nama dan class isi dengan

MyButton_Over

Simpan file beri nama skin.fla

Test movie

Langkah Kedua: Membuat aplikasi Flex

Buat halaman baru pada flash developer. Pilih New > Flex Project

Selanjutnya buat sebuah tombol

<mx:Button id="defaultButton" color="0x323232" label="Default Button" x="10" y="10"

width="244" height="95" />

Langkah Ketiga: Membuat File CSS

Klik kanan disini pilih add > new css file

Ketik file CSS berikut

Button{

upSkin:Embed(source="skin.swf", symbol="MyButton_Over");

overSkin:Embed(source="skin.swf", symbol="MyButton_Up");

}

Sisipkan file css ke dalam file . mxml nya

<mx:Style source="skin.css" />

Oke selesai, silahkan dijalankan

*pastikan anda menyimpan file skin.swf berada satu folder dengan file .mxml nya

Copyright belajarbareng.net 2010