Xây dựng ứng dụng “ví điện tử” cho android bằng app inventor2

Tìm hiểu lịch sử phát triển và những thành công của App Inventor Ngày 12/7/2010, Google chính thức giới thiệu công cụ lập trình trực quan App Inventor dùng để phát triển phần mềm ứng dụn

BÁO CÁO MÔN CHUYÊN ĐỀ CÔNG NGHỆ

PHẦN MỀM BÀI TẬP LỚN

Đề tài: Xây dựng ứng dụng “Ví điện tử” cho

android bằng App Inventor2.

Giáo viên hướng dẫn : Nguyễn Mạnh Sơn Sinh viên thực hiện : Nhóm 1: Phạm Thế Anh

Lương Thị Huệ Lớp : L14CN

LỜI NÓI ĐẦU

Ngày nay với sự phát triển của công nghệ thông tin trong lĩnh vực di động Các ứng dụng phần mềm cũng được thúc đẩy và tiếp cận tới người dùng rộng rãi hơn Chính vì lí do đó, các ứng dụng hỗ trợ lập trình cũng ngày một xuất hiện nhiều hơn và một trong những ứng dụng đó là App Inventor 2 do Google phát triển

Vấn đề quản lý chi tiêu cá nhân đang trở thành nhu cầu và thói quen hàng ngày của mọi người Dựa trên sự hiểu biết và tìm tòi của bản thân về App

Inventor 2, chúng em đã xây dựng ứng dụng “Ví điện tử” đảm bảo sự đơn giản,

tiện lợi để ai cũng có thể dùng và ghi chép vào bất cứ lúc nào phát sinh việc chi tiêu

“Ví điện tử” giúp người dùng ghi chép chi tiết các khoản thu chi (chi vào

việc gì, bao nhiêu tiền, chi trong sự kiện/chuyến đi nào? ) mọi lúc, mọi nơi Bất

kể khi nào có 1 khoản chi phí phát sinh (nhận lương, được cho tiền hoặc đi ăn tiệm, mua quần áo ) người dùng chỉ cần bỏ điện thoại ra, nhập liệu là xong

Chúng em xin cảm ơn thầy Nguyễn Mạnh Sơn đã hỗ trợ và đồng ý cho chúng em tiếp tục thực hiện đề tài này

Mục lục

Bảng phân công công việc

Phân tích và thiết kế hệ thống ứng

dụng “Ví điện tử”

Lương Thị Huệ

Xây dựng ứng dụng “Ví điện tử” Phạm Thế Anh

Tìm tài liệu, viết báo cáo, viết slide Lương Thị Huệ, Phạm Thế Anh

CHƯƠNG 1:

GIỚI THIỆU CHUNG VỀ APP INVENTOR 2

1 Tìm hiểu lịch sử phát triển và những thành công của App Inventor

Ngày 12/7/2010, Google chính thức giới thiệu công cụ lập trình trực quan App Inventor dùng để phát triển phần mềm ứng dụng trên hệ điều hành Android Được công bố dưới dạng phần mềm tự do (free software), App Inventor trở thành hiện tượng chưa từng có trong lĩnh vực lập trình cho thiết bị di dộng

Dựa trên ý tưởng “những gì bạn thấy là những gì bạn có” (WYSIWYG), App Inventor giúp dễ dàng tiếp cận và xây dựng ứng dụng

Android Với giao diện trực quan, dễ hiểu, cho phép truy cập đến các chức năng của điện thoại kể cả GPS, đây là công cụ giúp cho bộ sưu tập ứng dụng của Android ngày càng dồi dào và phong phú.

Tháng 8/2010, một lập trình viên mang tên Clark Wimberly đã tạo ra nền tảng Twitter client bằng App Inventor đã chứng minh khả năng và sức mạnh của chương trình này Đáng tiếc, chỉ 1 năm sau khi ra đời, App Inventor đã bị Google vùi dập, việc truy cập và sử dụng mã nguồn mở một cách thoải mái khiến Google không đồng tình vì nó không nằm trong chiến lược của ông lớn này Sau đó, Google chi tiền để hỗ trợ học viện Công nghệ Massachusetts (MIT) thực hiện dự án, với mục đích đào tạo các lập trình viên một cách bài bản và tiếp

đó mới phổ biến App Inventor

Ngày nay, MIT đã hoàn thiện App Inventor và nó được chia sẻ ngay trên tài khoản Google Các lập trình viên mới bắt đầu hoặc bất kỳ ai muốn tạo ra ứng dụng Android chỉ cần vào địa chỉ web của MIT, nhập thông tin tài khoản Google, và từ những mảnh ghép nhỏ, xây dựng những ý tưởng của mình Tuy có cách dùng đơn giản nhưng App Inventor khá "hào phóng" khi cho phép bạn truy xuất đến các chức năng thường dùng của điện thoại như chức năng tự động nhắn tin, xác định vị trí hiện tại qua GPS và kể cả giao tiếp với các ứng dụng trên nền web như Amazon, Facebook hay Twitter

Tại hội thảo Activate 2010 (1/7/2010), Eric Schmidt - giám đốc điều hành

Google - khẳng định: "Công nghệ di động hiện là lĩnh vực phát triển nóng nhất

Những lập trình viên giỏi nhất đang ưu tiên tạo ra phần mềm ứng dụng cho thiết

bị di động, thay vì phần mềm cho máy tính cá nhân trên Windows hoặc trên Apple Mac Một trong những nguyên nhân của xu hướng này là các thiết bị di động có tính cá nhân sâu sắc hơn nhiều so với máy tính cá nhân".

Các thiết bị di động (chủ yếu là điện thoại thông minh) có năng lực xử lý thông tin ngày càng mạnh, đang trở thành một chủng loại "máy tính cá nhân" Khác với máy tính cá nhân thông thường, các thiết bị di động có bộ đo gia tốc (accelerometer), con quay hồi chuyển (gyroscope), bộ định vị GPS và có thể có thêm các bộ cảm ứng khác trong tương lai, từ đó mở ra những lĩnh vực ứng dụng mới mẻ và rộng lớn

Với công cụ App Inventor, Google tạo điều kiện để mọi người có thể tự xây dựng phần mềm ứng dụng cho thiết bị di động dùng hệ điều hành Android Trang web của dự án App Inventor nêu rõ:

"Với App Inventor, bạn có thể xây dựng phần mềm ứng dụng bất kỳ theo ý

tưởng của mình Nhiều người bắt đầu với việc tạo ra trò chơi đơn giản như trò

"bắt chuột chũi" (bắt một chú chuột chũi nhảy ngẫu nhiên trên màn hình) hoặc phần mềm vẽ "râu ria" trên hình chân dung của bạn bè Dựa vào các bộ cảm ứng có sẵn trong điện thoại, bạn còn có thể tạo ra trò chơi di chuyển quả bóng trong "mê cung" bằng cách nghiêng điện thoại.

Việc lập trình ứng dụng không chỉ giới hạn ở những trò chơi đơn giản Bạn cũng có thể tạo ra phần mềm để cung cấp thông tin hoặc phục vụ cho việc dạy và học, chẳng hạn phần mềm giúp bạn cùng các bạn học của mình ôn tập

kiến thức để chuẩn bị cho kỳ thi nào đó Do Android có sẵn chức năng đọc từ thành tiếng, phần mềm của bạn còn có thể đọc to câu hỏi ôn tập.

Để dùng được App Inventor, bạn không nhất thiết là lập trình viên Thay

vì viết các câu lệnh, bạn có thể thiết kế bộ mặt ứng dụng theo ý mình một cách trực quan và lắp ráp các thẻ lệnh để diễn đạt chức năng của phần mềm.

App Inventor có sẵn đủ loại thẻ lệnh giúp bạn làm mọi việc với điện thoại Android: thẻ lưu giữ thông tin, thẻ lặp lại thao tác nào đó nhiều lần, thẻ thực hiện thao tác với điều kiện định trước Thậm chí có cả thẻ lệnh giúp bạn liên lạc với các dịch vụ trên mạng như Twitter.

App Inventor rất dễ dùng và cũng rất mạnh mẽ Phần mềm ứng dụng của bạn có thể lưu trữ dữ liệu do người dùng tạo ra trong một cơ sở dữ liệu.Bạn có thể tạo ra loại ứng dụng trong đó giáo viên lưu trữ nhiều câu hỏi để tự động tạo nên đề thi.

Vì App Inventor cho phép truy xuất bộ định vị GPS, bạn có thể tạo ra những ứng dụng phụ thuộc vị trí của bạn Bạn có thể tạo ra ứng dụng giúp bạn ghi nhớ vị trí đậu xe của mình, ứng dụng hiển thị vị trí của bạn bè trong một buổi trình diễn ca nhạc, hiển thị vị trí của các đồng nghiệp trong một cuộc hội thảo hoặc ứng dụng hướng dẫn đi lại trong trường học, trong cơ quan, ứng dụng hướng dẫn tham quan một viện bảo tàng nào đó.

Bạn có thể tạo ra ứng dụng tự động gửi tin nhắn cho những người thân yêu, tự động trả lời tin nhắn với nội dung đại loại như "Xin lỗi, tôi đang lái xe Tôi sẽ gọi lại sau".Bạn cũng có thể tạo ứng dụng có chức năng đọc to tin nhắn cho bạn.

Chúng tôi tạo ra App Inventor vì chúng tôi thấy có những thay đổi cơ bản trong cách thức mọi người sử dụng thiết bị di động Các loại điện thoại thông minh hiện nay, trong đó có điện thoại Android và iPhone, là thiết bị truy cập internet hoàn chỉnh Do việc sử dụng web di động thoải mái hơn trước rất nhiều, chúng tôi muốn giúp mọi người có điều kiện tự tạo các ứng dụng và dịch

vụ di động, dù chưa có kiến thức lập trình App Inventor giúp chúng tôi thử nghiệm điều đó Trong lĩnh vực giáo dục, App Inventor là công cụ mạnh mẽ cho phép giáo viên hướng dẫn học sinh của mình làm quen với việc lập trình, giúp học sinh trở thành người sáng tạo công nghệ, thay vì chỉ là người thụ hưởng công nghệ".

App Inventor thực chất là một ứng dụng web, chạy bởi trình duyệt trên máy tính cá nhân.Nhóm dự án App Inventor hoạt động dưới sự chỉ đạo của tiến

sĩ Harold Abelson thuộc Học viện Kỹ thuật Massachusetts (Massachusetts Institute of Technology - MIT) MIT là nơi khai sinh các phương pháp dạy lập trình phi truyền thống dựa vào các phần mềm có tính đột phá như Logo (thập niên 1960) và Scratch Mã nguồn của App Inventor có liên hê mật thiết với mã nguồn của công cụ lập trình Scratch dành cho trẻ em

Gian triển lãm ứng dụng di động của những sinh viên Đại học San Francisco tham dự lớp huấn luyện App Inventor.

Một sinh viên của Đại học San Francisco tham gia lớp huấn luyện App Inventor đã tạo ra ứng dụng cho phép gửi tin nhắn đồng thời theo hai kênh: tin nhắn SMS thông thường và tin nhắn Twitter Một nữ sinh viên ngành điều dưỡng tại Đại học Indiana dùng App Inventor để tạo nên ứng dụng "cấp cứu", có khả năng tự khởi động khi người dùng điện thoại bị ngã Nếu người dùng không bấm nút Cancel trên màn hình hoặc không đứng dậy sau một thời gian nhất định, ứng dụng tự động gửi tin nhắn đến những người thân định trước để thông

báo nơi bị ngã Abelson giải thích: "Việc tạo ra ứng dụng như vậy thực ra không

phải là điều gì quá tài tình.Mọi người bình thường đều có thể làm những việc tương tự chỉ trong vài phút".

Ứng dụng trả lời tin nhắn tự động khi lái xe được tạo bởi một cụm thẻ lệnh đơn giản

Ứng dụng "cấp cứu" tự động chạy khi người dùng té ngã.

Những người hâm mộ Apple cho rằng App Inventor chỉ là một phương tiện chiến thuật của Google nhằm công kích tính đóng kín của điện thoại iPhone Dường như điện thoại Android dự định dựa vào số lượng áp đảo của những ứng dụng đơn giản để cạnh tranh với chất lượng của những ứng dụng chuyên nghiệp trên iPhone

Tuy nhiên, mục tiêu công nghệ và mục tiêu xã hội của nhóm dự án App Inventor không hạn hẹp như vậy Vai trò "máy tính" của điện thoại thông minh ngày càng rõ nét hơn Nhu cầu "cá nhân hóa" của điện thoại thông minh lại cao hơn nhiều so với máy tính cá nhân thông thường do sự hiện diện của các bộ cảm ứng thể hiện tình trạng của người dùng một cách chi tiết App Inventor đang mở rộng cánh cửa cho vô vàn khả năng mới Đó là nỗ lực đáng trân trọng

- Laybel(nhãn) là thành phần dùng để hiển thị văn bản.

- TextBox (ô nhập liệu)

- ListView ( xem danh sách)

- DatePicker và TimePicker ( ngày giờ hệ thống của ứng dụng)

- CheckBox (ô lựa chọn)

- Password TextBox (ô nhập mật khẩu)

- Image (hình ảnh) cho phép tạo thời gian để các sự kiện xảy ra

- Notifier là thành phần được dùng để hiển thị thông báo, cảnh báo tới người

sử dụng hoặc ghi lại các nhật ký để người dùng dễ dàng chỉnh sửa chức năng của ứng dụng

- Screen (màn hình) là thành phần được mặc định tạo ra trong mỗi dự án, có thể thêm mới các màn hình khác

- HorizontalArrangement (vùng sắp xếp theo chiều ngang) dùng để hiển thị một nhóm các thành phần được bố trí theo chiều từ trái sang phải

- TableArrangement (vùng sắp xếp theo bảng biểu) dùng để hiển thị một nhóm các thành phần được bố trí theo kiểu bảng biểu

- VerticalArrangement (vùng sắp xếp theo chiều dọc) dùng để hiển thị một nhóm các thành phần được bố trí theo chiều tử trên xuống dưới

- Player (chương trình phat nhạc) dùng để mở một tập tin âm thanh hoặc phim

có thời lượng dài hoặc dùng để bật chức năng rung của thiết bị

- Sound (chương trình phát nhạc) dùng để mở một tập tin âm thanh hoặc phim

có thười lượng ngắn hoặc dùng để bật chức năng rung của thiết bị

- TinyDB (cơ sở dữ liệu) là thành phần dùng để lưu trữ dữ liệu, chỉ có tác dụng khi ứng dụng đang được mở

- TinyWebDB (cơ sở dữ liệu web) là thành phần dùng để lưu trữ dữ liệu trên web, có tác dụng ngay trên web dù ứng dụng không mở

- Canvas là thành phần dùng trong lập trình game, thiết kế các thành phần di chuyển và va chạm

- Bluetooth là thành phần cho phép xây dựng ứng dụng với bluetooth

- Web là thành phần xây dựng liên kết giữa ứng dụng với web

- GPS là thành phần xây dựng ứng dụng với GPS

- PhoneCall và PhoneNumberPicker là các thành phần xây dựng ứng dụng với các cuộc gọi

- Twitter và Sharing là các thành phần xây dựng ứng dụng với mạng xã hội

- EmailPicker là các thành phần xây dựng ứng dụng với hộp thư điện tử

Và còn rất nhiều các thành phần khác như: VideoPlayer, Camcorder,

Camera, SpeechRecognizer, ImagePicker, SoundRecoder, GyroscopeSensor, BarcodeScanner, LocationSensor, OrientationSensor, NearField,

AccelerometerSensor, ProximitySensor, FirebaseDB

CHƯƠNG 3:

ÁP DỤNG APP INVENTOR 2 VÀO ỨNG DỤNG CỦA BẢN

THÂN

3 Các thành phần sử dụng của bản thân trong App Inventor 2:

- Screen: với các lệnh When Screen Initialize, When Screen BackPresed

- Button: với các lệnh ButtonClick

- TextBox: với các lệnh get, set

- Laybel: với các lệnh get, set

- Image: với các lệnh get, set, hind

- HorizontalArrangement

- DatePicker và Time Picker

- ListView: với các lệnh get, set

- Notifier: Với các lệnh call, get, set

- PaswordTextBox: Với các lệnh get, set

- TinyDB: với các lệnh call, get, set

CHƯƠNG 4: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG

PHẦN 1: PHÂN TÍCH HỆ THỐNG

4.1 Biểu đồ Use-Case hệ thống ứng dụng

4.2 Biểu đồ lớp:

4.3 Kịch bản

4.3.1 Kịch bản cho chức năng đăng nhập của ứng dụng “Ví điện tử”

• Tên chức năng: Đăng nhập

• Tác nhân chính: Người dùng

• Điều kiện: Người dùng tải phần mềm về máy điện thoại di động, sau đó tiến hành cài đặt và nhập thông tin để đăng nhập vào ứng dụng

- Kịch bản chính:

• Người dùng vào ứng dụng “Ví điện tử”

• Ứng dụng hiển thị form cho phép người dùng nhập thông tin về tên và mật khẩu

• Người dùng nhập tên và mật khẩu của bản thân

• Ứng dụng kiểm tra và cho phép người dùng vào hệ thống

- Ngoại lệ:

• Người dùng nhập tên hoặc mật khẩu không đúng => ứng dụng hiển thị

“Tên người dùng hoặc mật khẩu không đúng xin vui lòng nhập lại”

4.3.2 Kịch bản cho chức năng cập nhật tiền của ứng dụng “Ví điện tử”

• Tên chức năng: Cập nhật tiền

• Tác nhân chính: Người dùng

• Điều kiện: Người dùng phải đăng nhập vào ứng dụng

- Kịch bản chính:

• Người dùng đăng nhập vào ứng dụng thành công

• Ứng dụng hiển thị form cho phép người dùng nhập “số tiền” và “lí do cụ thể”, các nút chọn “thêm tiền”, “tiêu tiền”, “lí do thêm/tiêu”

• Người dùng nhập vào số tiền và lí do của mình, chọn lí do thêm/tiêu, sau

đó chọn thêm tiền hoặc tiêu tiền

• Ứng dụng tính toán, lưu vào CSDL

• Người dùng thoát khỏi ứng dụng

• Ứng dụng hiển thị thông báo “Bạn có muốn thoát khỏi ứng dụng không?”

• Người dùng đăng nhập vào ứng dụng thành công

• Ứng dụng hiển thị form cho phép người dùng chọn: xem lịch sử chi tiêu

• Người dùng chọn xem lịch sử chi tiêu

• Ứng dụng hiển thị form cho phép người dùng chọn xem chi tiết lịch sử, xóa lịch sử, quay lại màn hình chính

 Người dùng chọn xem chi tiết lịch sử

 Ứng dụng hiển thị chi tiết lịch sử và cho phép người dùng tìm kiếm xem lịch sử theo ý muốn

 Người dùng chọn xóa lịch sử

 Ứng dụng hiển thị thông báo bạn có muốn xóa lịch sử chi tiêu ko?

 Người dùng chọn có

 Ứng dụng xóa tất cả lịch sử chi tiêu

 Người dùng chọn quay lại màn hình chính

 Ứng dụng quay lại màn hình chính

- Kịch bản ngoại lệ:

• Người dùng đăng nhập không thành công => Ứng dụng không hiển thị lịch sử

4.3.4 Kịch bản cho chức năng xem thống kê của ứng dụng “Ví điện tử”

• Tên chức năng: Xem thống kê

• Tác nhân chính: Người dùng

• Điều kiện: Người dùng phải đăng nhập vào ứng dụng và chọn xem thống kê

- Kịch bản chính:

• Người dùng đăng nhập vào ứng dụng thành công

• Ứng dụng hiển thị form cho phép người dùng chọn xem thống kê

• Người dùng chọn xem thống kê

• Ứng dụng hiển thị chi tiết thống kê các khoản thu nhập, chi phí

• Người dùng thoát

• Ứng dụng trở lại màn hình chính

- Kịch bản ngoại lệ:

• Người dùng chọn Reset thống kê

• Ứng dụng hiển thị thông báo bạn có muốn Reset thông kê không?

• Người dùng đăng nhập thành công

• Ứng dụng hiển thị form cho phép người dùng chọn kế hoạch chi tiêu

• Người dùng chọn kế hoạch chi tiêu

• Ứng dụng hiển thị form cho phép người dùng chọn thời gian nhắc nhở, nhập lí do nhắc nhở, lưu nhắc nhở, xem nhắc nhở

• Người dùng chọn thời gian nhắc nhở, nhập vào lí do nhắc nhở, lưu nhắc nhở và chọn xem nhắc nhở

• Ứng dụng hiển thị kế hoạch chi tiêu và cho phép người dùng có thể tìm kiếm kế hoạch chi tiêu đã lưu theo ý muốn

- Kịch bản ngoại lệ:

• Người dùng đăng nhập không thành công => Ứng dụng không hiển thị kế hoạch chi tiêu

• Người dùng không chọn xem nhắc nhở

• Ứng dụng quay lại màn hình kế hoạch chi tiêu

4.3.6 Kịch bản cho chức năng xóa số tiền đã tiêu của ứng dụng “Ví điện tử”

• Tên chức năng: Xóa số tiền đã tiêu

• Tác nhân chính: Người dùng

• Điều kiện: Người dùng phải đăng nhập thành công và chọn chức năng xóa

số tiền đã tiêu

- Kịch bản chính:

• Người dùng đăng nhập thành công

• Ứng dụng hiển thị form cho phép người dùng chọn xóa số tiền đã tiêu

• Người dùng chọn xóa số tiền đã tiêu

• Ứng dụng hiển thị thông báo bạn có muốn xóa số tiền đã tiêu không?

4.3.7 Kịch bản cho chức năng thoát ứng dụng của ứng dụng “Ví điện tử”

• Tên chức năng: Thoát ứng dụng

• Tác nhân chính: Người dùng

• Điều kiện: Người dùng đã đăng nhập

- Kịch bản chính:

• Người dùng đăng nhập thành công

• Ứng dụng hiển thị form cho phép người dùng chọn thoát ứng dụng

4.4 Biểu đồ tuần tự

- Biểu đồ tuần tự cho chức năng “cập nhật số tiền”

- Biểu đồ tuần tự cho chức năng “lập kế hoạch chi tiêu”

4.5 Biểu đồ hành động cho chức năng “cập nhật số tiền”

PHẦN 2: THIẾT KẾ HỆ THỐNG

4.6 Biểu đồ lớp thiết kế hệ thống

4.7 Biểu đồ tuần tự

- Biểu đồ tuần tự thiết kế giao diện cho chức năng “cập nhật số tiền”

- Biểu đồ tuần tự thiết kế giao diện cho chức năng “lập kế hoạch chi tiêu”

PHẦN 3: THIẾT KẾ CƠ SỞ DỮ LIỆU

4.8 Thiết kế CSDL bằng SQL

4.8.1 Tạo bảng

- Bảng KeHoachChiTieu: