Tạo 1 bài trắc nghiệm đơn giản bằng flash

In
Xem kết quả: / 87
Bình thườngTuyệt vời 

Chào all :P. Hôm nay mình xin hướng dẫn các bạn làm 1 bài trắc nghiệm cơ bản nhất với flash nhé. Hy vọng nó sẽ giúp các bạn có những giây phút lý thú và bổ ích.

Công việc đầu tiên chúng ta là là thiết kế cho nó 1 hình nền theo đúng chủ đề của bạn, có thể dùng photoshop hay lấy trên mạng về. Mình thì mình chọn cái này:

OK. giờ chúng ta bắt tay vào làm nhỉ.

Bước 1:

Tạo 1 file flash mới Ctrl + N, chọn loại ActionScript 2.0 nhé. Sau đó bạn nhấn Ctrl + J để mở bảng Document Setting điều chỉnh các thông số cho file flash của bạn. Vì ảnh nền của mình có kích thước 450x320 nên mình thiết đặt luôn như vậy.

Bước 2:

Import bức ảnh nền mà bạn chọn vào flash bằng cách vào: File > Import >Import to Stage... Sau đó bạn mở bảng Align: Window > Align (Ctrl + K) thiết đặt theo hình dưới để căn hình vào giữa file flash.

Làm xong bước này bạn khóa layer này lại nhé.

Bước 3:

Tạo 1 layer mới, sừ dụng công cụ Text Tool (T) viết 1 đoạn text đây sẽ là câu hỏi muốn làm nổi bật các bạn có thể chọn cho nó 1 font chữ đẹp đẹp tùy theo ý mình.

Tiếp tục vẽ 1 đoạn text bên dưới câu hỏi, đây sẽ là từng câu trả lời trắc nghiệm như hình dưới mình viết là - Hồ Chí Minh

Sử dụng công cụ Selection Tool (V) click chọn vào chữ - Hồ Chí Minh vừa tạo giữ phím AltShift kéo xuống dưới để nhân nó ra là 4 đoạn chữ.

Giờ bạn nháy đúp vào từng Text để sửa theo câu trả lời bạn muốn. Mình sau khi sửa xong sẽ được như hình dưới:

Giờ bạn Click vào lần lượt frame thứ 2, 3, 4, 5 trên layer này nhấn F6 để chèn vào các keyframe, và ở layer nền ở frame thứ 5 nhấn F5 như hình dưới:

(Có bao nhiêu câu hỏi thì sẽ có bấy nhiêu nhiêu frame + với 1 frame kết quả, nếu bạn muốn làm nhiều câu hỏi hơn, trong bài này mình chỉ hướng dẫn làm 4 câu hỏi).

Trở lại click về frame đầu tiên. Sau đó bạn chọn công cụ Selection Tool (V) click chọn vào đoạn Text  - Hồ Chí Minh nhấn phím F8 để Convert nó sang dạng Button nhé.

OK, lại tiếp tục nhấn F9 để mở bảng ActionScrip và chèn vào đoạn code sau: 

on (release){
gotoAndPlay("02");
}

Nhấn F9 để thoát bảng ActionScript, làm tương tự với Text Chú Cuội chỉ khác là câu trả lời này là câu trả lời đúng nên bạn chèn đoạn code sau:

on (release){
gotoAndPlay("02");
score ++;
}

Lưu ý: Với những câu trả lời đúng thì bạn dùng đoạn code này nhé. (trong 1 câu hỏi chỉ có 1 câu trả lời đúng thì dùng đoạn code này: score ++ để khi click vào nó sẽ tự cộng 1 điểm cho người trả lời).

Làm tương tự với các đoạn text còn lại đoạn code cho những đoạn text này là: 

on (release){
gotoAndPlay("02");
}

Bước 4:

Click vào Frame thứ 2 Làm tương tự như trên, nghĩa là bạn sửa Text rồi Covert thành Button, viết code cho từng button.

Xong OK bạn lại Click vào frame 3 và frame 4 làm tương tự.

Bước 5:

Click vào frame 5 và bạn thêm một số đoạn text nữa viết tuơng tự như hình dưới, có thể tạo tùy theo ý tưởng của bạn, đây chính là frame kết thúc và công bố kết quả của người chơi như hình dưới:

Trong đó có mấy điểm lưu ý những text mình khoanh tròn màu đỏ:

bạn chọn tất cả lài loại: Dynamic Text

Và đặt tên cho phần Variable lần lượt từ trên xuống dưới là: scorepercentresultat (Text 100, 1000 tuyệt vời ! như trong hình trên)

Những tên này là những tên biến cho text để bạn có thể thay đổi nội dung trong đó.

OK vậy là ta đã xong bước thiết kế.

Bước 6:

Tạo 1 layer mới, lần lượt click cào frame 1 đến frame 5 và nhấn F6.

Sau đó click trở về frame 1, Khi click vào frame bạn nhìn qua bên tay phải sẽ thấy có một ô là name đây chính là tên của frame bạn đặt lần lượt cho 5 frame là từ 01 đến 05.

OK, giờ chúng ta tiến hành viết code cho từng frame.

Click vào frame 1 bạn nhấn F9 để mở bảng ActionScript và chèn vào đoạn code sau:

stop();
 
score=0;

Sau đó nhấn F9 để tắt bảng ActionScript, rồi click vào frame 2 nhấn F9 để mở bảng ActionScript và chèn vào đoạn code sau:

stop();

Tiếp tục với frame 3 và frame 4 bạn cũng chèn đoạn code là:

stop();

Ở frame thứ 5 bạn chèn vào đoạn code sau:

stop();
percent=score/4*100 + "%";
 
if (score == 0){
resultat = "- Bó tay?"
}
if (score == 1){
resultat = "- Tệ quá :("
}
if (score == 2){
resultat = "- Cố gắng lên"
}
if (score == 3){
resultat = "- OK"
}
if (score == 4){
resultat = "- Tuyệt vời :)"
}

Nếu bạn làm nhiều frame thì bạn thêm If vào hoặc để khoảng từ bao nhiêu điểm đến bao nhiêu điểm là nó sẽ chúc mừng như thế nào là tùy bạn nhé.

Như vậy là ta đã hoàn thành, bạn có thể nhấn Ctrl + Enter để xem kết quả nhé.

Đây là một bài tập khá đơn giản để làm trắc nghiệm, các bạn có thể tìm thêm tài liệu để làm cho nó sinh động hấp dẫn hơn. Vì bài tập này cũng hơi khó viết tut nên mình chỉ viết đơn giản như vậy cho mọi người dễ hình dung.

Các bạn có thể download file nguồn về để xem chi tiết.

Chúc các bạn thành công.

aloflash.com

Download

Share