Nghiên cứu đồ họa 2D, 3D của hệ điều hành Android và viết chương
trình minh họa.
3.1 Đồ họa trong Android.
3.1.1 Giới thiệu chung về đồ họa Android.
Khi viết một ứng dụng điều quan trọng là bạn phải xác định xem ứng dụng đó sử dụng
đồ họa như thế nào. Việc xác định được điều này sẽ giúp cho quá trình viết chương trình
được đơn giản và hiệu quả cao.
Đồ họa và hình ảnh động cho một ứng dụng tĩnh thì hoàn toàn khác với một ứng dụng
Game có các nhân vật chuyển động. Từ những điều đó mà Android cung cấp cho ta nhiều
cách để thể hiện đồ họa.
Để thể hiện được đồ họa thì Android cung cấp cho chúng ta 2 đối tượng chính:
+ Canvas.
+ Drawables
Với Canvas ta có thể vẽ bất cứ cái gì lên vùng hiện thị của chúng ta, khi tạo ra
Drawables ta có thể tạo các ảnh động dạng frame-by-frame. Ngoài ra Android còn hỗ trợ
OpenGL 1.0 và 2.0 để tạo ra đồ họa 3D. Từ Android 3.0 thì phần cứng đã tăng tốc thêm
cho phần đồ họa được vẽ bằng API và làm tăng hiệu xuất làm việc của thiết bị.
3.2 Đồ họa 2D trong Android.
3.2.1 Một số thành phần trong đồ họa 2D.
Trên Android, để vẽ bất thứ gì ta cần phải có bốn thành phần cơ bản:
- Một đối tượng kiểu Bitmap để giữ các pixel cần vẽ.
- Một đối tượng chứa nét vẽ cần vẽ ra(Có thể là Rect, Path, Bitmap…).
- Một đối tượng kiểu Paint dùng để định nghĩa màu sắc, style… dùng để vẽ ra màn
hình.
- Một đối tượng Canvas dùng để thực thi lệnh vẽ.
Để làm rõ những khái niệm trên ta tiến hành tạo một lớp CustomView cài đặt lại lớp
View của Android để định nghĩa một đối tượng đồ họa mới. Trên đối tượng mới định
nghĩa này, ta sẽ tự vẽ ra giao diện mà mình mong muốn.
Xây dựng lớp CustomView
Để tạo một CustomView ta tiến hành tạo một class với nội dung như sau:
package gioi.Android;
xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:orientation="vertical"
Android:layout_width="fill_parent"
Android:layout_height="fill_parent"
>
<gioi.Android.CustomView
Android:id="@+id/graphicView"
Android:layout_width="fill_parent"
Android:layout_height="fill_parent"
/>
</LinearLayout>
Trong file xml kể trên ta có sử dụng một thẻ có tên niit.Android.CustomView, đây
chính là đối tượng đồ họa ta vừa tạo ra ở trên. Trong đó gioi.Android là package
của project hiện tại. Thẻ CustomView ở trên có ba thuộc tính là Android:id,
Android:layout_width và Android:layout_height. Ta có thể tạo một Activity có nội dung là
file xml kể trên:
public class main extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
Lúc này Android sẽ tự tạo ra đối tượng CustomView và sử dụng phương thức khởi
tạo public CustomView(Context context, AttributeSet attrs) để khởi tạo đối tượng với
các thuộc tính là Android:id, Android:layout_width và Android:layout_height được
truyền vào thông qua đối tượng attrs.
Đến đây ta đã tạo xong lớp CustomView, tuy nhiên nếu chạy chương trình ở
bước này ta chỉ được một giao diện trống rỗng. Để vẽ giao diện cho CustomView ta sẽ
tiến hành cài đặt phương thức onDraw() với nội dung như sau:
int color = 255; hoặc int color = Color.rgb(255, 0, 0);
+ Đối tượng Canvas: là một lớp quan trọng trong quá trình xây dựng ứng dụng, đặt
biệt trong Game. Nếu như lớp Paint cung cấp cho bạn nhưng dụng cụ color, đường nét, độ
to nhỏ của nét để vể thì Canvas cung cấp cho bạn các phương thức để vẽ lên những gì bạn
muốn, đường thẳng, đường tròn, hình chữ nhật...
Ví dụ ta vẽ một chuỗi ký tự như sau:
canvas.drawText("Vẽ chuỗi ký tự lên Canvas tại vị trí 30,30 với style là biến
p",30,30,p);
+ Đối tượng Rect: Đây là đối tượng cho ta vẽ lên 1 hình chữ nhật, cách khai báo đối
tượng này như sau Rect rect = new Rect();
Ngoài ra Android còn cung cấp rất nhiều các đối tượng khác để vẽ các thành phần khác
nhau, như vẽ ảnh, đường thẳng, đường tròn, hình đa giác…
3.2.2 Chương trình minh họa.
Để hiểu rõ các đối tượng mà Android cung cấp, ta cùng xây dựng một ví dụ nho nhỏ để
thấy được cách thể hiện đồ họa của Android. Chương trình minh họa sẽ thực hiện các chức
năng sau.
- Vẽ 1 đường thẳng màu đỏ có độ dài 100 picxel.
- Vẽ 1 đường tròn có đổ bóng màu vàng.
- Vẽ 1 hình chữ nhật có màu xanh nước biển.
- Vẽ 1 bức ảnh.
Để vẽ được các hình này ta dùng lại lớp CustomView. Đầu tiên ta tạo ra 1 project với
tên là TestAndroid2D và đặt tên gói là TestAndroid2D.gioi, tên activity là
TestAndroid2Dactivity.java.
Ta có lớp TestAndroid2Dactivity.java như sau.
package TestAndroid2D.gioi;
import Android.app.Activity;
import Android.os.Bundle;
public class TestAndroid2DActivity extends Activity {
/** Called when the activity is first created. */
@Override
13. public class Customview extends View{
14. public Customview(Context context) {
15. super(context);
16. }
17. public Customview(Context context, AttributeSet attrs) {
18. super(context, attrs);
19. }
20. @Override
21. protected void onDraw(Canvas canvas) {
22. Paint p = new Paint();
23. //Vẽ đường thẳng
24. p.setColor(Color.RED);//Đặt màu vẽ là màu đỏ
25. canvas.drawLine(0, 10, 100, 10, p);
26. //Vẽ đường tròn có đổ bóng màu vàng
27. Path circle = new Path();
28. circle.addCircle(150,150,100,Direction.CW);
29. p.setColor(Color.YELLOW);
30. p.setShadowLayer(50, 0, +50, Color.YELLOW);
31. p.setStyle(Style.STROKE);
32. canvas.drawPath(circle, p);
33. //Vẽ hình chữ nhật
34. p.setColor(Color.BLUE);
35. Rect r = new Rect();
36. r.set(200, 200, 50, 30);
37. canvas.drawRect(r, p);
38. //Vẽ 1 bức ảnh
39. p.reset();
40. Bitmap bitmap =
BitmapFactory.decodeResource(getResources(),R.drawable.bomb);
41. canvas.drawBitmap(bitmap, 20, 300, p);
này bằng cách tạo ra 1 đối tượng thể hiện GLSurfaceView và thêm phần Renderer của bạn
vào. Tuy nhiên nếu bạn muốn bắt sự kiện cảm ứng trên màn hình thì bạn phải mở rộng lớp
này và cài đặt sự kiến lắng nghe.
GLSurfaceView.Renderer: Giao diện này định nghĩa các phương thức được yêu cầu
để vẽ các thành phần đồ họa của một đối tượng GLSurfaceView.
GLSurfaceView.Renderer yêu cầu cần phải cài đặt các phương thức sau:
- onSurfaceCreated() : Phương thức này chỉ được hệ thống gọi 1 lần duy nhất, nó
được gọi khi tạo ra GLSurfaceView. Phương thức này thường để thực hiện 1 số cài
đặt cần thiết như là cài đặt các thuộc tính khi hiện thị giao diện đồ họa như chiều
cao, chiều rộng…
- onDrawFrame() : Hệ thống sẽ gọi phương thức này mỗi khi vẽ lại GLSurfaceView.
- onSurfaceChanged() : Hệ thống sẽ gọi phương thức này khi GLSurfaceView có sự
thay đổi, bao gồm việc thay đổi chiều cao, rộng của màn hình và sự thay đổi về
chiều của màn hình (Nằm ngang hay dọc).
Một số gói trong thư viện OpenGL:
Gói OpenGL API 1.0:
+ Android.opengl: Gói này cung cấp các giao diện tĩnh và nó thực hiện tốt
hơn gói javax.microedition.khronos.
GLES10
GLES10Ext
GLES11
GLES10Ext
+ javax.microedition.khronos.opengles : Gói này cung cấp các đối tượng
chuẩn của opengl 1.0
GL10
GL10Ext
GL11
GL11Ext
GL11ExtensionPack
OpenGL ES 2.0 API Class
import Android.opengl.GLSurfaceView;
import Android.view.MotionEvent;
public class MyGLSurfaceView extends GLSurfaceView{
MyGLSurfaceViewRenderer myGLSurfaceViewRenderer;
public MyGLSurfaceView(Context context) {
super(context);
myGLSurfaceViewRenderer = new MyGLSurfaceViewRenderer();
setRenderer(myGLSurfaceViewRenderer);
}
public boolean onTouchEvent(final MotionEvent event) {
queueEvent(new Runnable() {
public void run() {
//Bắt sự kiện và làm thay đổi màu nền
myGLSurfaceViewRenderer.setColor(event.getX() / getWidth(),
event.getY() / getHeight(), 1.0f);
}
});
return true;
}
}
Khi ta muốn bắt sự kiện cảm ứng của thiết bị thì ta bắt buộc phải có thêm phương thức
onTouchEvent.
Lớp MyGLSurfaceViewRenderer.java
package TestAndroid3D.gioi;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import Android.opengl.GLSurfaceView;
public class MyGLSurfaceViewRenderer implements GLSurfaceView.Renderer{
private float red = 0.9f;
private float green = 0.2f;
Để có thể hiểu rõ về các thành phần đồ họa của hệ điều hành Android thì chúng ta cùng
xây dựng 1 chương trình hoàn chỉnh. Chương trình sẽ sử dụng các đối tượng đồ họa 2D
của Android.
3.4.1.2 Ý tưởng thực hiện.
Xây dựng Game BomOffline.
- Ý tưởng: Game BomOffline là Game có thể chơi không cần phải kết nối với sever
mà vẫn chơi được Game. Game theo thể loại chiến thuật, đối với người chơi thì
người chơi phải thực hiện các hành động sau.
+ Di chuyển nhân vật trên màn hình.
+ Tìm kiếm những chiếc hộp có chứa các quà tặng.
+ Đặt bom để tiêu diệt các quái vật.
- Miêu tả quá trình chơi Game: Lúc đầu khi người chơi vào chơi thì người chơi được
cung cấp 1 quả bom, mức độ bom ban đầu là 1, số lượt chơi lúc đầu là 3. Người
chơi điều khiển nhân vật di chuyển theo 4 hướng trái, phải, lên, xuống thông qua
giao điện điều khiển thể hiện trên thiết bị. Người chơi luôn phải tránh xa các quái
vật, nếu người chơi di chuyển chạm vào quái vật thì người chơi sẽ bị trừ lượt chơi.
Người chơi cần phải đặt bom để tiêu diệt quái vật, mỗi quả bom được đặt xuống thì
sau 3 giây thì bom sẽ tự nổ. Mỗi 1 quái vật bị chết ( biến mất ) thì số điểm của
người chơi được tăng thêm 50 điểm vào tổng số điểm. Nếu người chơi di chuyển và
chạm vào hộp quà thì người chơi có thể nhận được 1 trong 3 loại quà. Loại 1 là tăng
thêm 1 lượt chơi, loại 2 là tăng thêm 1 cấp độ bom, loại 3 là tăng thêm số quả bom.
Hộp quà xuất hiện ngẫu nhiên trên màn hình, mỗi hộp quà thì hiện thị trong thời
gian ngẫu nhiên trong khoảng 5 đến 20 giây. Khi nhân và quái vật di chuyển thì có
một số vùng có các đồ vật thì nhân vật và quái vật sẽ không thể đi qua được và bắt
buộc phải đi vòng qua các vật này.
- Ý tưởng về cách xây dựng các giao diện và chức năng cho người dùng:
+ Về giao diện sẽ có các giao diện chính sau:
• Giao diện Menu chính (MainMenu)
• Giao diện giới thiệu cách chơi
• Giao diện điều khiển nhân vật (giao diện chính cho phép điều
+ Chức năng chơi lại từ đầu.
+ Chức năng quay lại menu chính.
+ Chức năng yêu cầu thoát khỏi Game.
• Giao diện khi người chơi thắng cuộc:
+ Chức năng chuyển tới giao diện lưu điểm.
• Giao diện khi lưu điểm:
+ Chức năng lưu lại số điểm.
+ Chức năng xem danh sách điểm.
+ Chức năng chơi lại từ đầu.
+ Chức năng yêu cầu thoát khỏi Game.
• Giao diện xem danh sách điểm cao:
+ Chức năng hiện thị 10 người có số điểm cao nhất.
+ Chức năng tắt bỏ phần hiện thị.
+ Chức năng định dạng lại danh sách (xóa dữ liệu cũ).
3.4.1.3 Phân tích chương trình.
3.4.1.3.1 Sơ đồ hoạt động của Game.
3.4.1.3.2 Xác định actor và mô hình use case.
3.4.1.3.2.1 Danh sách Actor
STT TÊN ACTOR Ý NGHĨA/GHI CHÚ
1 Người dùng Người sử dụng điện thoại chơi Game
3.4.1.3.2.2 Sơ đồ Use Case
Bảng danh sách UseCase
STT TÊN USE CASE Ý NGHĨA/GHI CHÚ
1 Bắt đầu chơi Chọn Activity MainGameActivity
2 Tạm dừng Game Chọn biểu tượng tạm dừng
3 Điều khiển nhân vật Xác định hướng đi của nhân vật
4 Bật / Tắt âm thanh Chọn biểu tượng bật tắt âm thanh
5 Đặt bom Đặt bom tại vị trí hiện tại của nhân vật
6 Thoát Thoát khỏi Game
Đặc tả các Use Case.
o Các yêu cầu đặc biệt: Không có.
o Trạng thái của hệ thống khi bắt đầu use case:
- Khi đang ở giao diện chơi Game.
o Trạng thái của hệ thống sau khi thực hiện use case:
- Hiện thị menu phụ
o Điểm mở rộng: