Lập trình giao diện cấp thấp - ThS. Trần Minh Triết

Nội dung text: Lập trình giao diện cấp thấp - ThS. Trần Minh Triết

1. Đại học Khoa học Tự nhiên ĐHQG-HCM Khoa Công Nghệ Thông Tin Lập trình giao diện cấp thấp ThS. Trần Minh Triết 1
2. Tài liệu tham khảo (Chương 11) Programming Wireless Devices with the Java™ 2 Platform Micro Edition Second Edition Roger Riggs, Antero Taivalsaari, Jim Van Peursem, Jyri Huopaniemi, Mark Patel, Aleksi Uotila, Jim Holliday Editor Addison Wesley (2003) 2
3. Canvas Hệ trục tọa độ Xử lý sự kiện bàn phím 3
4. Canvas Lớp đối tượng (abstract) kế thừa từ Display Cho phép vẽ và hiển thị hình ảnh 4
5. Xử lý biến cố nhấn phím Ngoài các softkey để xử lý command, đối tượng Canvas có thể xử lý thêm 12 keycode. KEY_NUM0, KEY_NUM1 KEY_NUM2, KEY_NUM3 KEY_NUM4, KEY_NUM5 KEY_NUM6, KEY_NUM7 KEY_NUM8, KEY_NUM9 KEY_STAR, KEY_POUND Các keycode tương thích với tất cả các thiết bị MIDP 5
6. Các phương thức Có thể override các phương thức sau để xử lý void keyPressed(int keyCode) void keyReleased(int keyCode) void keyRepeated(int keyCode) Có thể thiết bị không hỗ trợ phát sinh biến cố keyRepeated. Có thể kiểm tra bằng hàm boolean hasRepeatEvents() Để lấy tên của phím được nhấn, dùng hàm String getKeyName(int keyCode) 6
7. Action Key Action event (Game Action) UP, DOWN, LEFT, RIGHT, FIRE, GAME_A, GAME_B, GAME_C, GAME_D. Mỗi bàn phím có thể ánh xạ nhiều phím khác nhau vào cùng 1 action event Nên sử dụng int getGameAction(int keyCode) 7
8. Xử lý biến cố pointer Trong trường hợp thiết bị hỗ trợ pointer (ví dụ sử dụng stylus) Các phương thức có thể override để xử lý: void pointerPressed(int x, int y) void pointerReleased(int x, int y) void pointerDragged (int x, int y) Cần kiểm tra thiết bị có hỗ trợ pointer và hỗ trợ sự kiện pointer hay không bằng cách gọi các hàm: Canvas.hasPointerEvents() Canvas.hasPointerMotionEvents() 8
9. Hệ trục tọa độ 9
10. Hệ trục tọa độ Lấy kích thước của canvas: int getWidth() int getHeight () Các phần mềm trên thiết bị MIDP luôn trả về kích thước tối đa để vẽ trên thiết bị 10
11. Phương thức paint Lớp Canvas cung cấp phương thức paint() để vẽ, hiển thị hình ảnh, xuất chuỗi protected void paint(Graphics g) { // Set background color to white g.setColor(255, 255, 255); // Fill the entire canvas g.fillRect(0, 0, getWidth(), getHeight()); } 11
12. Ví dụ về Canvas public class DrawShapes extends MIDlet { private Display display; // The display private ShapesCanvas canvas; // Canvas public DrawShapes() { display = Display.getDisplay(this); canvas = new ShapesCanvas(this); } 12
13. Ví dụ về Canvas protected void startApp() { display.setCurrent(canvas); } protected void pauseApp() { } protected void destroyApp(boolean unconditional) { } public void exitMIDlet() { destroyApp(true); notifyDestroyed(); } } 13
14. Ví dụ về Canvas class ShapesCanvas extends Canvas implements CommandListener { private Command cmExit; // Exit midlet private DrawShapes midlet; public ShapesCanvas(DrawShapes midlet) { this.midlet = midlet; // Create exit command and listen for events cmExit = new Command("Exit", Command.EXIT, 1); addCommand(cmExit); setCommandListener(this); } 14
15. Ví dụ về Canvas protected void paint(Graphics g) { // Clear background to white g.setColor(255, 255, 255); g.fillRect(0, 0, getWidth(), getHeight()); // Black pen g.setColor(0, 0, 0); // Start at 3 o'clock and rotate 150 degrees g.drawArc(10, 10, 100, 100, 0, 150); } 15
16. Ví dụ về Canvas public void commandAction(Command c, Displayable d) { if (c == cmExit) midlet.exitMIDlet(); } } 16
17. Clipping void setClip(int x, int y, int width, int height) int getClipHeight() int getClipWidth() int getClipX() int getClipY() void clipRect(int x, int y, int width, int height) 17
18. Phép tịnh tiến void translate(int x, int y) int getTranslateX() int getTranslateY() 18
19. Hỗ trợ chế độ màu boolean isColor() int numColors() void setColor(int RGB) void setColor(int red, int green, int blue) int getColor() int getRedComponent() int getGreenComponent() int getBlueComponent() 19
20. Loại nét vẽ int getStrokeStyle() void setStrokeStyle(int style) Hai loại nét vẽ: DOTTED SOLID 20
21. Vẽ đường thẳng void drawLine(int x1, int y1, int x2, int y2) Sử dụng màu và loại nét vẽ hiện hành Ví dụ: g.drawLine(4, 1, 19, 7); 21
22. Vẽ và tô Arc void drawArc(int x, int y, int width, int height, int startAngle, int arcAngle) void fillArc(int x, int y, int width, int height, int startAngle, int arcAngle) 22
23. Vẽ và tô Arc 23
24. Vẽ và tô hình chữ nhật void drawRect(int x, int y, int width, int height) Ví dụ: g.drawRect(5, 2, 15, 8) void fillRect(int x, int y, int width, int height) Ví dụ: g.fillRect(5, 2, 15, 8); 24
25. Vẽ và tô hình chữ nhật (góc tròn) void drawRoundRect(int x, int y, int width, int height, int arcWidth, int arcHeight) Ví dụ: g.drawRoundRect(4, 2, 16, 8, 6, 6); 25
26. Vẽ và tô hình chữ nhật (góc tròn) void fillRoundRect(int x, int y, int width, int height, int arcWidth, int arcHeight) Ví dụ: g.fillRoundRect(4, 2, 16, 8, 6, 6); 26
27. Ví dụ: Vẽ hình chữ nhật 27
28. Tô tam giác (MIDP 2.0) void fillTriangle(int x1,int y1,int x2,int y2,int x3,int y3) Ví dụ: g.fillTriangle(4, 2, 1, 14, 20, 10); 28
29. Font Font getFont(int face, int style, int size) Font getFont(int fontSpecifier) Font getDefaultFont() Ví dụ: Font font = Font.getFont( Font.FACE_PROPORTIONAL, Font.STYLE_BOLD | Font.STYLE_ITALIC, Font.SIZE_MEDIUM); Font font = Font.getFont(Font.FONT_INPUT_TEXT); 29
30. Font Các hằng số dùng cho lớp Font: FACE_SYSTEM, FACE_MONOSPACE, FACE_PROPORTIONAL STYLE_PLAIN, STYLE_BOLD, STYLE_ITALIC, STYLE_UNDERLINED SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE FONT_INPUT_TEXT, FONT_STATIC_TEXT 30
31. Anchor point 31
32. Anchor point Các hằng số Theo chiều ngang LEFT HCENTER RIGHT Theo chiều dọc TOP BASELINE BOTTOM 32
33. Hiển thị chuỗi ký tự void drawChar(char character, int x, int y, int anchor) void drawChars(char[] data, int offset, int length, int x, int y, int anchor) void drawString(String str, int x, int y, int anchor) void drawSubstring(String str, int offset, int len, int x, int y, int anchor) 33
34. Hiển thị chuỗi ký tự Ví dụ: g.drawString( "developerWorks", 0, 0 , Graphics.TOP | Graphics.LEFT); 34
35. Drawing Text Ví dụ: g.drawString( "developerWorks", 0, 0 , Graphics.TOP | Graphics.HCENTER); 35
36. Ảnh không sửa đổi được (Immutable Image) Ảnh được tạo ra trực tiếp từ file tài nguyên, dữ liệu nhị phân, dữ liệu RGB, hay từ ảnh khác Sau khi đã tạo ra, ảnh không được sửa đổi Image.createImage(String name) Name phải bắt đầu bằng “/” và chứa tên đầy đủ của tập tin hình ảnh (trong file .JAR) Image.createImage(byte[], int offset, int length) Image.createImage(Image image) 36
37. Ảnh không sửa đổi được (Immutable Image) MIDP 2.0 Image.createImage(java.io.InputStream stream) Image.createImage(Image image, int x, int y, int width, int height, int transform) Image.createRGBImage(int[] rgb, int width, int height, boolean alpha) 37
38. Ảnh sửa đổi được (Mutable Image) Image.createImage(int width, int height) Kết quả là ảnh màu trắng, có cùng tính chất với display của thiết bị (màu/đen trắng, số lượng màu/số mức xám) Image.getGraphics() trả về đối tượng Graphics của ảnh 38
39. Hiển thị ảnh void drawImage( Image img, int x, int y, int anchor) void drawRegion( Image img, int x_src, int y_src, int width, int height, int transform, int x, int y, int anchor) Ví dụ: drawImage(image, 11, 10, Graphics.RIGHT | Graphics.BOTTOM); 39
40. Hiển thị ảnh Các hằng số: LEFT TOP HCENTER VCENTER RIGHT BOTTOM 40
41. Các phép biến đổi ảnh 41