CHƯƠNG II: XÂY DỰNG BỘ PHẦN MỀM HỖ TRỢ VIỆC HỌC TẬP VÀ GIẢNG DẠY MÔN SINH HỌC
3. Ứng dụng “Từ điển sinh học”
3.2 Xây dựng cơ sở dữ liệu cho từ điển
Sử dụng một ứng dụng miễn phí phổ biến hiện nay là DB Browser for SQLite để tạo một file có tên dictionary.db, file này sẽ lưu toàn bộ dữ liệu của bộ từ điển.
a. Cấu trúc file gồm
Android_metadata; Android_version: Bảng được tạo tự động, giúp kết nối CSDL với ứng dụng và khai báo phiên bản.
Bảng dictionary: Bảng này lưu toàn bộ dữ liệu của bộ từ điển.
Bảng sqlite_stat1: Được tạo để lưu trữ thông tin thống kê về các bảng và chỉ mục được phân tích. Thông tin này sau đó sẽ được sử dụng bởi trình tối ưu hóa truy vấn.
Hình 46. Trình duyệt BD Browser dùng để tạo và chỉnh sửa CSDL[20]
b. Xây dựng CSDL
55
Chúng tôi tạo các cột trong CSDL với các tên nhƣ sau:
Hình 47. Các cột trong CSDL (phần 1)
Hình 48. Các cột trong CSDL (phần 2)
56 Trong đó:
- _Id: Số định danh của từ khoá, giúp dễ dàng truy vấn địa chỉ của từ khoá trong CSDL.
- Word: từ khoá – Đây là cụm từ để người dùng tìm kiếm.
- Stripword : Tên đầy đủ của từ khoá.
- Title: Tên hiển thị của từ khoá khi được tìm thấy trên kết quả tìm kiếm.
- Definition: Định nghĩa, giải nghĩa của từ khoá tìm được.
- Synonym: Liệt kê các từ đồng nghĩa với từ khoá.
- Picture: Cột lưu trữ hình ảnh cho từ điển.
Chúng tôi khai báo các dữ liệu trong bảng như sau:
Hình 14: Khai báo kiểu dữ liệu trong bảng CSDL
Như vậy sau khi xây dựng nội dung với file Word về các từ khoá của Sinh học THPT[21] chúng tôi sẽ tiến hành đồng bộ dữ liệu của file Word với CSDL. Cụ thể:
Hình 49. Cấu trúc dữ liệu trên file word
Cột ―Tên khái niệm ‖ trong file word sẽ tương ứng với cột Word;Stripword ;Title trên CSDL.
Cột ―Tên gọi khác‖ sẽ tương ứng với cột ―Synonym‖ trên CSDL.
57
Côt ―Định nghĩa‖ sẽ tương ứng với cột ―Definition‖ trên CSDL.
Cột ―Ảnh minh hoạ‖ sẽ tương ứng với cột ―Picture‖ trên CSDL.
Tuy nhiên có một vấn đề phát sinh là cơ sở dữ liệu không lưu trực tiếp được hình ảnh dưới dạng dữ liệu thô. Do đó để tích hợp hình ảnh vào CSDL chúng tôi bắt buộc phải dùng một thuật toán để mã hoá hình ảnh thành dữ liệu kiểu chuỗi (string), khi hiển thị nó sẽ được giải mã hoá ngược lại thành các hỉnh ảnh (do SQLite cũng hỗ trợ ngôn ngữ html, nên các mã html cũng hoạt động tốt trên đó). Để thực hiện được điều này chúng tôi sử dụng trang web: https://base64.guru/converter/encode/image. Đây là một trang web giúp mã hoá ảnh thành các mã base64.
Ví dụ: Tôi có hình ảnh sau:
Hình 50. Ảnh mô hình cấu tạo ADN
Khi qua công cụ mã hoá của trang web hình ảnh sẽ được mã hoá thành các chuỗi kí tự có dạng sau:
Hình 51. Mã hoá ảnh thành các chuỗi của base64
Chúng tôi sẽ copy các mã này và dán vào cột ―Picture‖ trên CSDL. Như vậy việc tích hợp hình ảnh vào trong CSDL để lưu trữ là hoàn toàn thực hiện được. Không như quan niệm trước đây các hình ảnh nên được lưu ở trên một thư mục riêng.
Để hiển thị hình ảnh rất đơn giản, khi các chuỗi này được truy cập nó sẽ được dịch ngược lại thành hình ảnh như trong ứng dụng.
58
Hình 52. Các mã base64 được dịch ngược thành hình ảnh trong ứng dụng c. Định dạng hiển thị CSDL
Như đã nói ở trên SQLite hoàn toàn hỗ trợ tốt ngôn ngữ định dạng html. Nên chúng tôi sẽ sử dụng các mã html để định dạng văn bản hiển thị.
Sau đây là ví dụ về việc không dùng mã html để định dạng văn bản.
Giả sử nếu phần nội dung mô tả về ADN:
Nếu như định dạng trên word như sau:
―❏ Cấu trúc
- ADN là một đại phân tử, cấu trúc theo nguyên tắc đa phân gồm nhiều đơn phân là các nuclêôtit (viết tắt là Nu).
- Đơn phân của ADN là Nucleotit, cấu trúc gồm 3 thành phần:
+ Đường đêoxiribôzơ: C5H10O4 + Axit phốtphoric: H3PO4
+ Bazơ nitơ: 1 trong có 4 loại bazo nito là A, T, G, X.
- Các Nu liên kết với nhau theo một chiều xác định tạo nên một chuỗi polinuclêotit.
- Mỗi phân tử ADN gồm 2 chuỗi polinucleotit liên kết với nhau bằng các liên kết hidro giữa các bazo nito của các nucleotit theo nguyên tắc bổ sung: A liên kết với T bằng 2 liên kết hidro, G liên kết với X bằng 3 liên kết hidro.</p>
59
❏ Cấu trúc không gian:
- Hai mạch đơn xoắn kép, song song và ngược chiều nhau.
- Xoắn từ trái qua phải, gọi là xoắn phải, tạo nên những chu kì xoắn nhất định mỗi chu kì gồm 10 cặp nuclêôtit và có chiều dài 34 Angstrom, đường kính là 20 Angstrom.
❏ Chức năng:
Mang, bảo quản và truyền đạt thông tin di truyền.”
Khi hiển thị ứng dụng sẽ không bố cục xuống dòng như trên word, thay vào đó các kí tự sẽ được sắp xếp liên tục đến hết như sau:
―❏ Cấu trúc - ADN là một đại phân tử, cấu trúc theo nguyên tắc đa phân gồm nhiều đơn phân là các nuclêôtit (viết tắt là Nu).- Đơn phân của ADN là Nucleotit, cấu trúc gồm 3 thành phần: + Đường đêoxiribôzơ: C5H10O4+ Axit phốtphoric: H3PO4+ Bazơ nitơ: 1 trong có 4 loại bazo nito là A, T, G, X.- Các Nu liên kết với nhau theo một chiều xác định tạo nên một chuỗi polinuclêotit.- Mỗi phân tử ADN gồm 2 chuỗi polinucleotit liên kết với nhau bằng các liên kết hidro giữa các bazo nito của các nucleotit theo nguyên tắc bổ sung:
A liên kết với T bằng 2 liên kết hidro, G liên kết với X bằng 3 liên kết hidro. ❏ Cấu trúc không gian:- Hai mạch đơn xoắn kép, song song và ngược chiều nhau.- Xoắn từ trái qua phải, gọi là xoắn phải, tạo nên những chu kì xoắn nhất định mỗi chu kì gồm 10 cặp
nuclêôtit và có chiều dài 34 Angstrom, đường kính là 20 Angstrom.❏ Chức năng:Mang, bảo quản và truyền đạt thông tin di truyền.”
Nhƣ vậy sẽ rất rối mắt, để khắc phục hiện tƣợng này chúng tôi sẽ thêm mã html cho các kí tự sẽ có dạng nhƣ sau:
“<p> ❏ Cấu trúc </p>
<p> - ADN là một đại phân tử, cấu trúc theo nguyên tắc đa phân gồm nhiều đơn phân là các nuclêôtit (viết tắt là Nu).</p>
<p> - Đơn phân của ADN là Nucleotit, cấu trúc gồm 3 thành phần:</p>
<p> + Đường đêoxiribôzơ: C5H10O4</p>
<p> + Axit phốtphoric: H3PO4</p>
<p> + Bazơ nitơ: 1 trong có 4 loại bazo nito là A, T, G, X.</p>
<p> - Các Nu liên kết với nhau theo một chiều xác định tạo nên một chuỗi polinuclêotit.</p>
<p> - Mỗi phân tử ADN gồm 2 chuỗi polinucleotit liên kết với nhau bằng các liên kết hidro giữa các bazo nito của các nucleotit theo nguyên tắc bổ sung: A liên kết với T bằng 2 liên kết hidro, G liên kết với X bằng 3 liên kết hidro.</p>
<p> ❏ Cấu trúc không gian:</p>
60
<p> - Hai mạch đơn xoắn kép, song song và ngược chiều nhau.</p>
<p> - Xoắn từ trái qua phải, gọi là xoắn phải, tạo nên những chu kì xoắn nhất định mỗi chu kì gồm 10 cặp nuclêôtit và có chiều dài 34 Angstrom, đường kính là 20
Angstrom..</p>
<p>❏ Chức năng:</p>
<p> Mang, bảo quản và truyền đạt thông tin di truyền.</p>”
Nên khi hiển thị ở ứng dụng sẽ có dạng trình bày rất rõ ràng.
Hình 53. Hiển thị nội dung văn bản trên ứng dụng
Tuy nhiên nếu thêm các mã hlmt thủ công sẽ tốn khá nhiều thời gian cho nhập liệu.
Để khắc phục hiện tượng này chúng tôi sử dụng một công cụ chuyển định dạng text sang mã html một cách tự động.
Trang web chúng tôi sử dụng là: https://www.booked.net/textism.html. Đây là một số rất hiếm các trang web có khả năng cho mã html sạch hoạt động tốt trên SQLite, hỗ trợ đầy đủ tiếng Việt unicode.
Dưới đây là cách thức chuyển code của trang web này. Sau khi được thêm các mã định dạng html chúng tôi sẽ copy và dán vào cột nội dung trong CSDL.
61
Hình 54. Định dạng văn bản theo mã html 3.3 Viết mã nguồn cho từ điển
a. Thiết kế giao diện của từ điển
Tại thư mục ―Layout ‖ trên Android Studio chúng tôi tiến hành thiết kế giao diện của từ điển như sau:
Hình 55. Thiết kế giao diện cho ứng dụng Trong đó:
1 – Thanh toolbar của ứng dụng. Màu của thanh toolbar có thể được thay đổi bằng theme.
2- Khung tìm kiếm. Nơi người dùng gõ các kí tự để tìm kiếm.
62
3. Kết quả hiển thị - Được khai báo trong ―content_main‖
Ngoài ra trong phần thiết kế giao diện chúng tôi cũng thiết kế các phần giao diện khác như:
Phần cài đặt – activity_setting.xml, phần hiển thị nội dung từ khoá - content_definition.xml….
b. Xây dựng mã nguồn của ứng dụng
Trong nội dung tiếp theo chúng tôi tiến hành viết mã để kết nối các chức năng của từ điển với giao diện của ứng dụng.
- Viết hàm điều khiển phần giao diện chính: ―Activity_main‖
Hình 56. Một phần mã điều khiển giao diện chính - Viết hàm điều khiển Menu:
Hình 57. Một phần mã điều khiển Menu ứng dụng
63 - Viết hàm điều khiển chức tìm kiếm:
Hình 58. Một phần mã điều khiển chức năng tìm kiếm - Hàm bắt sự kiện click và lưu lại lịch sử tìm kiếm
Hình 59. Một phần mã bắt sự kiện click và lưu lịch sử tìm kiếm - Hàm hiển thị nội dung tìm kiếm, hiển thị đánh dấu
Hình 60. Một phần mã xử lý hiển thị nội dung tìm kiếm
64
Để xử lý và hỗ trợ các hàm chính chúng tôi sử dụng các Adapter thực hiện các hành động tìm kiếm, lịch sử và tìm kiếm.
Hình 61. Khối các Adapter hỗ trợ cho hàm chính
Hình 62. Một phần class của Adapter hiển thị dấu trang c. Kết nối CSDL với ứng dụng
- Khối xử lý kết nối CSDL (database) với ứng dụng
Hình 63a. Khối CSDL được lưu trữ trong thư mực data của ứng dụng
Hình 63b. Một phần mã khai báo các câu lệnh truy vấn SQL
65 d.Tạo thư mục lưu trữ database trong ứng dụng
Ngoài ra chúng tôi tiến hành lưu trữ database, font chữ vào thư mục assets của ứng dụng.
Đây là thư mục dùng để lưu trữ các dữ liệu của ứng dụng.
Hình 65. Thư mực Assets nơi lưu trữ các dữ liệu của từ điển e. Đóng gói từ điển hoàn chỉnh
Ứng dụng được build thành file .apk và cài đặt thành công trên điện thoại. Sau đây là các chức năng của ứng dụng mà người dùng có thể sử dụng.
- Giao diện của ứng dụng: Hướng tới sự tối giản, dễ sử dụng không rườm rà, tiết kiệm tài nguyên hệ thống.
Hình 66. Giao diện của ứng dụng khi mở lên
66
- Chức năng tra cứu: Người dùng chỉ việc gõ các kí tự của từ khoá muốn tìm lên thanh tìm kiếm và click vào từ cần tra, ứng dụng sẽ trả về các thông tin cần thiết.
Hình 67. Các tra cứu từ khoá và nội dung hiển thị
67
- Chức năng đánh dấu từ khoá quan trọng: Người dùng khi tra cứu xong từ khoá có thể lưu lại các từ vừa tra bằng cách chọn vào biểu tượng trái tim phía trên của nội dung vừa tra.
Hình 68. Chức năng đánh dấu từ quan trọng
Người dùng cũng có thể xem lại danh sách các từ đánh dấu trong mục quản lý đánh dấu. Ở mục này người dùng có thể chỉnh sửa danh sách từ khoá bằng cách chọn và xoá bỏ nếu từ đó không còn quan trọng nữa.
Hình 69. Chức năng quản lý đánh dấu
68
- Chức năng hiển thị hình ảnh minh hoạ. Với các từ khoá được hiển thị chúng tôi đã cố gắng tìm kiếm và đưa vào CSDL các hình ảnh minh hoạ. Nếu từ khoá nào có hình ảnh minh hoạ sẽ có biểu tượng ở phía trên thanh toolbar. Người dùng chỉ việc nhấn vào biểu tượng đó hình ảnh sẽ được hiển thị đầy đủ, nhanh chóng, không cần có kết nối internet.
Hình 70. Chức năng hiển thị hình ảnh trong từ điển
- Các điều chỉnh trong cài đặt. Người dùng có thể tuỳ chọn giao diện của từ điển theo ý thích cá nhân (1); thay đối cỡ font (2); thay đổi font chữ (3); bật/tắt chức năng tạo từ điển trong nội dung hiển thị (4); bật/tắt hiển thị từ đồng nghĩa với từ vừa tra.
Hình 71. Các thiết lập trong phần cài đặt của từ điển
69