24 giờ học Flash

 vào mng. Nói vy cng hi khó hiu 
nh, vy hãy xét ví d' này nhé. Ví d' này s xóa ph
n t 23 và 63 và chèn vào ph
n t 
17. 
CODE 
myArray = [36,23,63,71,25]; 
myArray.splice(1,2,17); 
trace(myArray); 
S%p xp trong m	ng 
Chúng ta có th sp xp m
t mng b"ng câu lnh sort. Ví d' di ây s cho ta m
t 
mng c sp xp theo th t s: 
CODE 
myArray = [36,23,63,71,25]; 
myArray.sort(); 
trace(myArray); 
Còn ví d' này s sp xp theo th t ch: 
CODE 
myArray = ["Gary","Will","Jay","Brian"]; 
myArray.sort(); 
trace(myArray); 
Câu lnh reverse  o v trí sp xp ca mng. Ví d': 
CODE 
myArray = ["Gary","Will","Jay","Brian"]; 
myArray.reverse(); 
trace(myArray); 
Mun sp xp mng theo v trí gim d
n thì s d'ng sort r*i s d'ng reverse. 
S d'ng câu lnh concat  ni hai mng l	i vi nhau. Nó s không làm thay  i các 
mng c, mà nó s t	o ra m
t mng mi. 
CODE 
myArray = [36,23,63,71,25] 
otherArray = [58,97,16]; 
newArray = myArray.concat(otherArray); 
trace(newArray); 
Chuyn 
 i gia chu"i và m	ng 
Chúng ta có th s d'ng câu lnh join   i t) m
t mng thành chu.i. Câu lnh này 
c
n m
t i s duy nh#t là ký t ngn cách gia các ph
n t ca mng trong chu.i. 
Nu b	n không truyn tham s này vào thì ký t m%c nh là d#u ph!y. Ví d' di 
ây tr v 36:23:63:71:25. 
CODE 
myArray = [36,23,63,71,25] 
myString = myArray.join(":"); 
trace(myString); 
Câu lnh join ít c s d'ng vì nó không c
n thit lm, nhng hàm split l	i r#t hu 
d'ng. Nó s chuyn  i t) m
t chu.i sang mng. Ví d' nh nó s chuyn m
t chu.i 
“36,23,63,71,25” thành m
t mng trong ví d' di ây: 
CODE 
myString = "36,23,63,71,25"; 
myArray = myString.split(","); 
trace(myArray); 
Hãy ngh( n chuyn chúng ta có m
t câu nói c lu trong m
t chu.i mun chuyn 
sang mng, m.i ph
n t trong mng s cha m
t ch. Xem ví d' di ây nhé: 
CODE 
myString = "This is a test"; 
myArray = myString.split(" "); 
trace(myArray); 
Làm ch chuyn 
ng 
Trong ví d' này, chúng ta s l#y t)ng ch trong m
t câu dài và hin th vào textfield. 
- T	o movie Flash mi 
- T	o m
t text field dynamic, cho font ch to, khong 64. Cho text field n"m  gia 
màn hình và canh gia cho text field. +%t variable = text. 
- V m
t shape r*i ch
n Insert -> Convert to Movie Clip. +%t tên cho instance này là 
Actions r*i kéo nó ra ngoài vùng hin th. 
- Chèn o	n code sau vào movie clip ó. +
u tiên s s d'ng hàm split  tách t)ng 
ch ca câu vào trong mng. Sau ó s khai báo thêm 3 bin na. Bin wordNum s 
lu m
t con s là s th t ca ch s hin th. Bin frameDelay s lu s frame  
m.i ch hin ra. Bin frameCount s m s frame mà m
t ch ã i qua. 
CODE 
onClipEvent(load) { 
 // get the words 
 wordList = ("Imagination is more important than knowledge").split(" "); 
 // set up variables 
 wordNum = 0; 
 frameDelay = 6; 
 frameCount = frameDelay; // prime for first word 
} 
onClipEvent(enterFrame) { 
 // time for new word 
 if (frameCount == frameDelay) { 
 _root.text = wordList[wordNum]; // display word 
 wordNum++; // next word 
 if (wordNum >= wordList.length) wordNum = 0; 
 frameCount = 0; 
 } 
 frameCount++; 
} 
- Nào, bây gi thì ã xong r*i, hãy ch	y th xem nào 
 Gi
 th 13: S dng Rollovers, Rollovers 
To hình dáng con tr& theo ý thích 
Vic thay con tr& m%c nh b"ng m
t con tr& theo ý thích ca mình r#t n gin, ch 
c
n s d'ng hàm Mouse.hide() và %t m
t movie clip ca mình vào v trí ca con tr& 
là xong. Con tr& có th là b#t c hình dáng gì cng c, nh là hình mi tên, hình 
bàn tay hay m
t movie clip. 
Hình di ây là m
t ví d' ca m
t movie clip c dùng  làm con tr&. Ch là m
t 
hình mi tên n gin nhng b	n phi chú ý r"ng d#u c
ng chính gia movie clip phi 
n"m ngay 
u ca mi tên. 
 Nu b	n mun s d'ng l	i con tr& m%c nh thì ch c
n g
i Mouse.show() 
M
t iu c
n lu ý na là phi chc r"ng movie clip làm con tr& ca chúng ta phi  
trên t#t c các movie clip khác. Chúng ta có th ch
n Modify -> Arrage ->Bring To 
Front  a movie clip lên 
u nhng ch là trên các movie clip trong layer ó mà 
thôi. Cho dù b	n có  movie clip ca mình lên layer trên cùng thì cng có th b che 
khu#t bi nhng movie clip c load vào b"ng duplicateMovie và attachMovie. Vì 
vy, chúng ta s s d'ng swapDepths()  a movie clip này lên trên cùng. 
Câu lnh swapDepths() s a movieclip lên m
t level mi, level có th là m
t s 
nguyên 0, 1, 2 9999. Vì th chúng ta s s d'ng lnh 
Cursor.swapDepths(9999); 
 a movieclip ca chúng ta lên trên cùng. 
Luyn tp: To con tr& tnh 
- T	o m
t movie mi 
- T	o m
t movie clip mi  thay th cho con tr& 
- Quay tr l	i movie 
u tiên, và chúng ta s thay th con tr& b"ng cách 
CODE 
onClipEvent(load) { 
 // hide the real cursor 
 Mouse.hide(); 
 // bring this movie clip to the front 
 this.swapDepths(99999); 
} 
- Tip theo chúng ta s gn v trí ca movie clip vào v trí ca con tr& 
CODE 
 onClipEvent(enterFrame) { 
 // follow the mouse 
 this._x = _root._xmouse; 
 this._y = _root._ymouse; 
} 
- Sau cùng, chúng ta s ph'c h*i l	i con tr& c khi kt thúc movie 
CODE 
onClipEvent(unload) { 
 // show the real cursor again 
 Mouse.show(); 
 } 
- Cui cùng là vic ch	y th movie ca mình 
Luyn tp: To con tr& 
ng 
- Chúng ta có th s d'ng l	i movie trc 
- T	o m
t button mi trong root. Hãy th làm cho button có s thay  i trong over và 
down  chúng ta có th th#y c s khác bit. 
- Chúng ta s thay  i m
t ít trong movie clip làm con tr&. T	o m
t frame th hai, v 
thêm vài nét nh hình v 
- +%t tên hai frame là normal và over button 
- +%t câu lnh stop(); vào frame 
u tiên ca movie clip 
- Kéo th m
t button vào root 
- +%t tên movie clip làm con tr& là cursor 
- Thêm o	n code sau vào button 
CODE 
on (rollOver) { 
 cursor.gotoAndStop("over button"); 
} 
on (rollOut) { 
 cursor.gotoAndStop("normal"); 
} 
- Bây gi hãy ch	y th xem nào , hãy th click vào button xem sao. Xem kt qu 
b	n làm có ging hình này không nhé! 
Rollovers 
M
t k5 thut thông d'ng  hin th nhng thông tin dài là s d'ng Rollovers  a 
ra nhng thông tin thay vì s d'ng m
t button  ngi dùng click vào thì s sang 
m
t trang khác. 
Ý tng ca k5 thut này là khi ngi dùng a chu
t lt nhng vùng nào ó. M.i 
vùng s hin th cho ngi dùng xem m
t thông tin gì ó trên màn hình. 
Trong ví d' sau, s có 9 vùng nh th, m.i vùng s là m
t tên ca m
t hành tinh ( 
bên trái). Khi chúng ta a tr& chu
t qua nhng vùng ó thì bên phi s xu#t hin 
thông tin v hành tinh ó. Khi a tr& chu
t ra ngoài thì thông tin ó cng bin m#t. 
Chúng ta có th s d'ng AS  làm Rollovers b"ng nhiu cách 
Rollovers s d'ng button 
Chúng ta s s d'ng hai event ca button là on(rollOver) và on(rollOut)  vit code 
x lý vic hin th thông tin. Hãy xem ví d' di ây: 
CODE 
on (rollOver) { 
 information.gotoAndStop("information 1"); 
} 
on (rollOut) { 
 information.gotoAndStop("none"); 
} 
Rollovers s d'ng movie clip 
Flash không có hàm onClipEvent(mouseOver), vì th chúng ta s s d'ng m
t hàm 
khác. 
Hàm hitTest s cho chúng ta bit r"ng con tr& chu
t có ang  trên movie clip hay 
không. Và chúng ta có th làm nh sau 
CODE 
onClipEvent (enterFrame) { 
 if (this.hitTest(_root._xmouse,_root._ymouse, true)) { 
 _root.information.gotoAndStop("information 1"); 
 } else { 
 _root.information.gotoAndStop("none"); 
 } 
} 
Nhng làm nh vy v$n còn m
t v#n  na. Bi vì movie clip ca chúng ta s v$n 
tip t'c ch	y t) frame này sang frame khác, chúng ta ã g
i hàm gotoAndStop()  
d)ng l	i. Hãy tng tng chúng ta có nhiu rollovers. Cái 
u tiên s a movie clip 
information v frame none, m%t khác thì rollovers khác l	i a movie clip information 
v m
t ni khác. +iu này s làm xy ra xung 
t. Vì vy, chúng ta s làm nh sau. 
Chúng ta s ghi nh l	i r"ng con tr& chu
t có ang  trên movie clip hay không. Nu 
có, nó s thi hành lnh khi con tr& chu
t ra ngoài movie clip. Còn nu không, nó s thi 
hành lnh khi con tr& chu
t i vào movie clip. 
+ làm iu này, chúng ta s s d'ng bin over, ph' thu
c vào v trí ca con tr& chu
t 
mà nó s mang giá tr true ho%c false. +i vi m.i frame, chúng ta s s d'ng hàm 
hitTest  kim tra v trí ca con tr& chu
t. Nu v trí con tr& i lp vi over thì s 
xy ra s thay  i. Chúng ta hãy xem o	n code sau: 
CODE 
onClipEvent (load) { 
 over = false; 
} 
 onClipEvent (enterFrame) { 
 // kim tra xem liu con tr& chu
t có ang di chuyn qua movie clip không 
 testOver = (this.hitTest(_root._xmouse,_root._ymouse, true)); 
 if (testOver and !over) { 
 _root.information.gotoAndStop("information 1"); 
 over = true; 
 }else if (!testOver and over) { 
 _root.information.gotoAndStop("none"); 
 over = false; 
 } 
} 
Rollovers s d'ng frame 
Nh ã nói  trên, có r#t nhiu cách  làm rollovers. / ây, chúng ta s bàn v m
t 
cách khác. 
Thay vì s d'ng movie clip cho m.i thông tin c
n hin th, chúng ta s s d'ng 
timeline chính  lu thông tin. Frame 
u tiên s là frame none, và các frame tip 
theo s cha các thông tin. 
Chúng ta hãy xem hình bên di 
Ví d' trên s d'ng button cho các hotspot, và chúng ta hãy lu ý r"ng các button s 
xu#t hin trong t#t c các frame, nhng thông tin c
n hin th thì ch xu#t hin  m
t 
vài frame. 
Bây gi công vic vit code ca chúng ta g
n ging nh làm rollovers b"ng button. 
Nhng chúng ta không c
n phi g
i hàm gotoAndStop t) movie clip information. 
CODE 
on (rollOver) { 
 gotoAndStop("information 1"); 
} 
on (rollOut) { 
 gotoAndStop("none"); 
} 
Li th ca vic s d'ng cách này là chúng ta có th thay  i nhng thông tin trong 
các frame r#t d dàng, chúng ta không phi m x4 vào t)ng movie clip. Nu b	n quen 
s d'ng nhiu frame thì ây là m
t cách tt cho b	n 
Lu ý r"ng c ba cách trên u cho m
t kt qu nh nhau, không có s khác bit. / 
ây, chúng tôi ch mun trình bày cho các b	n th#y nhng cách làm khác nhau mà 
thôi! 
Luyn tp: Hin th thông tin 
Nào, bây gi các b	n hãy th s d'ng nhng hiu bit ca mình v cách thay  i con 
tr& và rollovers  làm m
t chng trình xem nào! Chng trình này s hin th 
nhng thông tin v các hành tinh. 
Chúng ta s có 9 hotspot, m.i hotspot là m
t hành tinh, m.i hotspot s hin th m
t 
h
p thông tin khi a tr& chu
t ngang qua. M.i hotspot là m
t button, vì th ngi 
dùng có th click vào  di chuyn n m
t frame khác  xem nhng thông tin v 
hành tinh ó. 
- +
u tiên, hãy t	o m
t movie mi trong Flash. Movie này s có 10 frame, t) frame 2 
cho n frame 10 s cha thông tin ca các hành tinh. +%t tên frame 1 là none và  
trng vùng hin th thông tin. 
+%t 10 button  bên trái, m.i cái cho m
t hành tinh. M
t movie clip summary s xu#t 
hin  hin th thông tin vn tt v các hành tinh khi a tr& chu
t ngang qua. Movie 
clip này cng s cha 10 frame: 1 frame trng và 9 frame cha thông tin ca 9 hành 
tinh. 
Chúng ta cng phi chú ý vic s d'ng layer cng r#t quan tr
ng, trong ví d' này thì 
chúng ta s s d'ng 3 layer và movie clip summary s c %t  layer trên cùng 
- +%t lnh stop(); vào frame 
u tiên, và cng %t trong frame 
u tiên ca movie clip 
summary 
- Nào, hãy vit code nhé! 
CODE 
on (rollOver) { 
 summary.gotoAndStop("mercury"); 
} 
on (rollOut) { 
 summary.gotoAndStop("none"); 
} 
- Nhng button  trên s a ngi dùng n nhng frame khác nhau  xem thông 
tin v hành tinh, chúng ta l	i vit code cho các button 
CODE 
on (release) { 
 gotoAndStop("mercury"); 
} 
Lu ý r"ng chúng ta có hai frame tên mercury, m
t frame  timeline chính và m
t  
trong movie clip summary 
- T	o m
t movie clip  thay th con tr& chu
t, và vit code nh sau 
CODE 
onClipEvent(load) { 
 Mouse.hide(); 
 this.swapDepths(99999); 
} 
onClipEvent(enterFrame) { 
 this._x = _root._xmouse; 
 this._y = _root._ymouse; 
} 
onClipEvent(unload) { 
 Mouse.show(); 
} 
 - Tip theo chúng ta s làm cho con tr& chu
t thay  i khi a con tr& ngang qua các 
button. Hãy thêm o	n code sau vào ph
n code ca button 
CODE 
on (rollOver) { 
 summary.gotoAndStop("mercury"); 
 cursor.gotoAndStop("over button"); 
} 
on (rollOut) { 
 summary.gotoAndStop("none"); 
 cursor.gotoAndStop("normal"); 
} 
on (release) { 
 gotoAndStop("mercury"); 
} 
Bây gi thì movie ca b	n ã xong. B	n hãy ch	y th xem sao 
 Gi
 th 14: Thành ph'n Scroll, Scrolling 
M%c dù scrollbar r#t quen thu
c trong các ng d'ng Mac, Windows, các trình duyt 
web nhng m#y ai hiu c nó ho	t 
ng nh th nào. Lý do n gin là do ây là 
m
t trong nhng thành ph
n trc quan, r#t d xây dng mà không c
n phi vit code 
nhiu. M
i ngi s d'ng nó nhng không suy ngh( nhiu v nó. 
Kt qu là khi nhng nhà phát trin s d'ng Flash  t	o ra nhng scrollbar ca riêng 
h
 thì g%p khó khn. Vì vy, chúng ta hãy cùng nhau tìm hiu 4 thành ph
n c bn 
ca m
t scrollbar và hãy tìm hiu scrollbar là gì. 
Hình di ây cho chúng ta th#y nhng thành ph
n c bn ca m
t scrollbar là: mi 
tên lên, mi tên xung, thanh trt và khay trt. 
Thanh tr!t (Slider) 
 Thanh trt ph'c v' nhiu m'c ích. +
u tiên, thanh trt s trt trên khay trt  
cho chúng ta th#y v trí ca khi vn bn chúng ta ang xem. Nu thanh trt  trên 
cùng thì chúng ta ang xem dòng 
u tiên ca vn bn, còn nu thanh trt  cui thì 
chúng ta ang xem dòng cui cùng. 
Nh ã nói, thanh trt s c kp ch%t và trt trên khay trt. Khi chúng ta kéo 
thanh trt trt trên khay trt thì khi vn bn s c cp nht v trí thích hp. 
Mi ây, scrollbar có thêm m
t %c tính mi. Thay vì kích thc ca thanh trt s b 
gn s2n vi m
t giá tr thì kích thc này s c thay  i tùy vào 
 dài vn bn. Vì 
th, v trí 
u tiên ca thanh trt s ng vi dòng 
u tiên ca vn bn và v trí cui 
cùng s ng vi dòng cui cùng. Ví d' m
t textbox có scrollbar hin th c 10 dòng 
ca m
t vn bn có 100 dòng thì chiu cao thanh trt s là 10% so vi khay trt. 
Nhng chúng ta s không bàn v#n  này  ây. 
Khay tr!t (Bar) 
Khay trt có chc nng chính là cha thanh trt và cho thanh trt trt trên nó. 
Chiu dài ca khay trt ph' thu
c vào 
 dài ca vn bn. Khay trt còn có m
t 
chc nng na là khi ta click vào khay trt thì khi vn bn s di chuyn m
t trang. 
Khi click vào ph
n trên ca thanh trt thì khi vn bn s di chuyn n trang trc, 
còn nu click vào ph
n di thanh trt thì khi vn bn s di chuyn n trang sau. 
Các m(i tên 
Mi tên lên và xung là hai thành ph
n n gin nh#t ca scrollbar, nó ch có chc 
nng cho ngi dùng di chuyn khi vn bn t)ng dòng m
t. 
Nhng thuc tính chung 
Scrollbar có m
t s thu
c tính chung mà chúng ta c
n phi xem xét. +
u tiên, các 
thành ph
n ca scrollbar ch ho	t 
ng khi chúng ta click vào, và s tip t'c ho	t 
ng 
cho n khi chúng ta th nút chu
t ra. L#y ví d': nu ngi dùng click vào mi tên 
xung  di chuyn m
t khi vn bn thì khi vn bn s di chuyn t)ng dòng m
t 
cho n khi chúng ta th nút chu
t ra. 
M
t v#n  na là v trí thanh trt phi c cp nht liên t'c khi nhng thành ph
n 
khác c kích ho	t. 
Scroll mt v
n b	n 
+
u tiên, chúng ta m khung Properties ra  %t tên l	i cho text field. Nh trong hình 
di ây, chúng ta s %t tên cho text field là scrollText 
Sau ó, chúng ta có th vit code cho nó l#y d liu vào. Nhng trc ht c
n %t cho 
text field ca chúng ta m
t scroll. 
Khi ã ch
n vào text field r*i thì b	n có th thay  i kích thc ca text field b"ng 
cách kéo hình ô vuông  góc di bên phi ca text field. Còn nu không %t kích 
thc thì text field s v)a   hiu th n
i dung bên trong. 
Thay vì iu chnh b"ng hình vuông màu trng thì lúc ó, chiu cao ca text field s 
c t iu chnh theo kích thc n
i dung bên trong, có ngh(a là nu vn bn bên 
trong text field ó có nhiu dòng thì chúng ta không th làm cho text field ch hin 
m
t vài dòng  scroll. Mun là xu#t hin scroll thì chúng ta hãy gi phím Shift và 
click vào hình vuông trng ó  tr thành hình vuông en, lúc này chúng ta có th 
iu chnh kích thc text field theo ý mun. Nh vy là chúng ta ã kích ho	t scroll 
cho text field. Còn m
t s thu
c tính khác lien quan n scroll nh 
Thu
c tính scroll s cho chúng ta bit dòng nào trong vn bn s xu#t hin 
u tiên. 
VD nh scroll = 1 thì dòng 
u tiên s c hin th 
u tiên, nu scroll = 2 thì dòng 
th hai s hin th và lúc này thì dòng 1 s không th#y c. 
Thu
c tính maxscroll cho chúng ta bit giá tr ln nh#t ca scroll 
Thu
c tính scroll và bottomscroll cho chúng ta bit chính xác dòng vn bn nào  trên 

u và dòng nào  cui 
+ scroll vn bn lên hay xung b	n c
n phi tng ho%c gim giá tr ca scroll. Th là 
xong! 
Luyn tp: Thit k mt chng trình scroll v
n b	n 
n gi	n 
Bài tp này tht ra r#t d. Trong ví d' di ây, chúng ta s xây dng m
t chng 
trình vi m
t text field dynamic  cha vn bn và hai button nh hình di ây 
- Tìm m
t o	n vn bn nào ó  dán vào text field (tìm o	n nào dài dài tí ) 
- Bây gi hãy t	o m
t movie mi trong Flash 
- S d'ng công c' Text Tool  t	o m
t text field 
- M ph
n Properties ra và %t tên cho text field ca chúng ta là scrollText. +%t thu
c 
tính Mutiline và Show Border Around Text 
- Dán o	n vn bn mà b	n ã chu!n b vào text field 
- T	o hai button ging nh hai hình v  trên. M
t button  iu khin i lên, m
t  
i xung. 
- Nhp o	n code sau cho button i lên: 
CODE 
on (press) { 
 scrollText.scroll--; 
} 
- Và nhp o	n code này cho button i xung: 
CODE 
on (press) { 
 scrollText.scroll++; 
} 
- Ok, bây gi b	n hãy ch	y th movie ca mình xem sao. B	n hãy th click vào 
button  scroll vn bn 
 Gi
 th 15: Các thành ph'n nhp liu 
Các b	n có th t	o c nhiu thành ph
n nhp liu b"ng Action Script, chc h0n các 
b	n ã g%p các thành ph
n này trong các th HTML. Trong chng này, các b	n s 
h
c cách làm checkbox, radiobutton b"ng Action Script. B	n cng s h
c c cách 
làm sao  chuyn t) thành ph
n này sang thành ph
n khác trong form b"ng cách 
nh#n nút TAB, và làm sao  h	n ch n
i dung ngi dùng nhp vào 
Các n
i dung trong chng này: 
- Cách t	o checkbox 
- Cách t	o radiobutton 
- S d'ng TAB  chuyn t) thành ph
n này sang thành ph
n khác 
- H	n ch n
i dung nhp liu 
To Checkbox 
Trong Hour 8, các b	n ã bit cách t	o m
t selectable movie clip. CheckBox cng là 
m
t Selectable movie clip ging vi các checkbox chu!n s d'ng trong các h iu 
hành Mac và Windows. 
+ t	o ra m
t Checkbox b	n c
n 2 button và 1 movie clip. Button 
u tiên th hin 
tr	ng thái Off ca Checkbox, có ngh(a là khi checkbox cha c ch
n. M
t button 
th hin tr	ng thái On, có ngh(a là cng checkbox ó nhng ã c ch
n. 
Hình di ây là 3 checkbox làm ví d'. 
Check box 
u tiên ang c ch
n, cái th 2 cha c ch
n, cái th 3 thì ngi 
dùng ang chu!n b ch
n. 
Các b	n có bit cách nào  cho 3 thành ph
n ca checkbox ho	t 
ng chung nh vy 
c không? R#t n gin, button Off s c a vào m
t movie clip riêng %t  
frame 
u tiên, b#m F6  t	o frame k tip và %t button On vào frame th 2. +%t tên 
frame 1 là Off, frame 2 là On. Tip theo, cho m
t câu lnh stop(); vào frame 1  
dùng movie clip l	i ngay ó. Trong m.i button ó s có m
t o	n code g
i m
t hàm  
ngoài time line ca movie clip có cha 2 button  x lý khi m.i nút c nh#n. 
CODE 
on (release) { 
 pressButton(); 
} 
Ngoài ra, trong frame Off (frame 1) s còn cha m
t o	n code na ngoài câu lnh 
stop(); 
CODE 
state = false; 
function pressButton() { 
 state = !state; 
 if (s