simple skin button flex

10
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 )

Upload: santon-sujarwo

Post on 06-Mar-2016

238 views

Category:

Documents


2 download

DESCRIPTION

simple skin button flex

TRANSCRIPT

Page 1: 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)

Page 2: simple skin button flex

Kemudian drag image ke dalam lembar kerja

Klik kanan pada image pilih convert to symbol

Page 3: simple skin button flex

Pada kolom nama dan class isi dengan MyButton_Up,

Page 4: simple skin button flex

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

MyButton_Over

Simpan file beri nama skin.fla

Page 5: simple skin button flex

Test movie

Page 6: simple skin button flex

Langkah Kedua: Membuat aplikasi Flex

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

Page 7: simple skin button flex

Selanjutnya buat sebuah tombol

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

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

Page 8: simple skin button flex

Langkah Ketiga: Membuat File CSS

Klik kanan disini pilih add > new css file

Page 9: simple skin button flex

Ketik file CSS berikut

Button{

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

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

}

Page 10: simple skin button flex

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