App Inventor là một ứng dụng web mã nguồn mở được cung cấp ban đầu bởi Google, năm 2012 Google chuyển giao cho Trung tâm Nghiên cứu Di động của Viện Công nghệ Massachusetts (MIT) quản lý và phát triển (http://appinventor.mit.edu).

Môi trường lập trình App Inventor có cách tiếp cận tương tự như Scratch, câu lệnh đều là những khối lệnh trực quan được kéo thả để tạo ra các ứng dụng từ đơn giản tới phức tạp. Các ứng dụng có thể chạy trực tiếp trên các thiết bị di động như điện thoại và máy tính bảng (phiên bản hiện tại hỗ trợ hệ điều hành Android)

Với Scratch, người học tập trung vào việc làm quen, hiểu ngôn ngữ lập trình là gì, rèn luyện tư duy logic. App Inventor là một bước phát triển tiếp theo, kế thừa hoàn toàn những ưu điểm của Scratch, ngoài ra tập trung nhiều hơn vào khả năng hiện thực hóa các ý tưởng và biến những ý tưởng đó trực tiếp thành các sản phẩm công nghệ, sử dụng trong cuộc sống hàng ngày trên các thiết bị di động.

Đăng nhập và tạo dự án

1. Đăng nhập

Để bắt đầu làm việc với App Inventor, các bạn sử dụng một trình duyệt bất kỳ (Google Chrome, Firefox, Cốc Cốc, …) truy cập vào trang web http://ai2.appinventor.mit.edu/. Trình duyệt sẽ ngay lập tức chuyển sang trang đăng nhập tài khoản Google. Các bạn nhập vào tài khoản (email) và nhấn nút Tiếp theo.

Tiếp theo nhập mật khẩu và nhấn nút Đăng nhập.

Các bạn cho phép Tài khoản đăng nhập vào App Inventor

Sau đó các bạn cần đồng ý với các điều khoản dịch vụ của ứng dụng.

Trong trường hợp nhận được yêu cầu tham gia khảo sát, các bạn có thể bỏ qua.

Một thông báo chào mừng đến với App Inventor hiện ra. Nhấn nút Continue để tắt thông báo và chuyển sang giao diện danh sách các dự án. Thông báo này sẽ xuất hiện mỗi lần đăng nhập, các bạn tích vào ô Do Not Show Again để từ lần đăng nhập sau thông báo không xuất hiện nữa.

2. Tạo dự án

Giao diện danh sách các dự án:

Ở lần đầu đăng nhập, chúng ta chưa có dự án nào. Để tạo một dự án mới, các bạn nhấn nút Start new blank project hoặc Start New Project như hình dưới đây:

Một cửa sổ hiện ra cho phép đặt tên cho dự án.

Chú ý: Tên dự án phải bắt đầu bằng chữ cái, đồng thời tên chỉ được chứa chữ cái, số và dấu gạch dưới, không đặt tên bằng tiếng việt có dấu.

Sau khi nhấn nút OK để hoàn tất, màn hình sẽ chuyển sang giao diện làm việc.

Để quay lại danh sách các dự án, các bạn nhấn nút My project. Trong danh sách xuất hiện thêm dự án các bạn vừa tạo.

Để xóa một dự án bất kỳ, các bạn nhấn vào ô phía trước dự án muốn xóa, sau đó nhấn nút Delete project.

Giới thiệu giao diện

Khi làm việc với một dự án, giao diện làm việc được chia làm 2 phần chính: Khu Thiết kế và khu Lập trình. Khi chọn một dự án từ danh sách dự án, giao diện mặc định được hiển thị là khu Thiết kế. Ngoài ra, trên giao diện còn có thanh danh mục và thanh công cụ sẽ được nhắc đến ở các bài sau.

1. Khu Thiết kế

Khu Thiết kế có các chức năng như thêm các đối tượng vào chương trình, xóa đối tượng, sắp xếp vị trí các đối tượng… và được chia ra làm 4 phần: Palette, Viewer, Components Properties.

  • Palette

Khu vực này chứa tất cả các loại đối tượng có thể thêm vào chương trình, các đối tượng được chia ra làm các nhóm khác nhau như User Interface (Giao diện người dùng), Sensor (Cảm biến), Storage (Lưu trữ)… Mỗi nhóm sẽ có danh sách các đối tượng của nhóm đó.

  • Viewer

Đây là nơi chúng ta thêm và sắp xếp vị trí các đối tượng hiển thị trên màn hình. Để thêm đối tượng, các bạn kéo đối tượng muốn thêm từ Palette sang khu vực này và đặt vào vị trí thích hợp.

Khi được thêm vào khu Viewer, đối tượng được chia thành loại có hình ảnh hiển thị (visible components) và không có hình ảnh hiển thị (non-visible components).

  • Components

Khu Components chứa danh sách các đối tượng đã được thêm vào dự án. Các bạn có thể đổi tên hoặc xóa đối tượng

  • Properties

Đây là khu vực chứa các thuộc tính của đối tượng, ví dụ như kích thước, màu sắc, cỡ chữ… Mỗi đối tượng khác nhau sẽ có những thuộc tính khác nhau.

Để chuyển giao diện sang khu Lập trình, các bạn nhấn nút Blocks

2. Khu Lập trình

Khu Lập trình cung cấp các khối lệnh để lập trình các đối tượng có trong chương trình, được chia ra làm 2 khu vực chính: Cửa sổ lệnh Blocks khu vực lập trình

  • Cửa số lệnh Blocks

Khu vực này chứa danh sách các khối lệnh, được phân thành 2 nhóm chính: nhóm khối lệnh có sẵn Built-in và nhóm khối lệnh bổ sung. Built-in là nhóm chứa các khối lệnh cơ bản, bất kỳ dự án nào cũng có. Nhóm khối lệnh bổ sung chứa các khối lệnh của các đối tượng trong dự án. Nhấn vào một đối tượng bất kỳ, danh sách các khối lệnh của đối tượng đó xuất hiện.

  • Khu vực lập trình

Đây là nơi lập trình viên kéo các khối lệnh từ danh sách các khối lệnh và ghép chúng lại với nhau. Các khối lệnh sẽ được thực hiện theo thứ tự mà lập trình viên đã ghép

Để chuyển giao diện sang khu Thiết kế, các bạn nhấn nút Designer.

Tham khảo thêm: Kết nối sản phẩm với thiết bị di động

Billy Nguyễn