FLUTTER WIDGET LÀ GÌ?
Widget là “viên gạch” để xây nên giao diện Flutter.
Mọi thứ nhìn thấy trên app đều là widget: chữ, nút bấm, ô nhập liệu, hình ảnh…
Phân loại cơ bản Widget
1. StatelessWidget – Giao diện tĩnh
Không thay đổi sau khi được tạo.
Dùng khi widget chỉ hiển thị thông tin, không tương tác.
2. StatefulWidget – Giao diện động
Có thể thay đổi khi người dùng tương tác (nhập dữ liệu, bấm nút…).
Dùng khi cần cập nhật nội dung.
MỘT SỐ WIDGET THƯỜNG DÙNG
- Text : Hiển thị chữ / Ví dụ : Text(‘Ghi chú’)
- TextField: Nhập nội dụng / Ví dụ : TextField(controller: …)
- ElevatedButton : Nút bấm / Ví dụ : ElevatedButton(onPressed: …, child: Text(‘Lưu’))
- Icon : Hiện thị Icon / Ví dụ: Icon(Icons.delete)
- IconButton: Nút bấm có hình Icon / Ví dụ: IconButton(onPressed: …, icon: Icon(…))
- ListView: Hiển thị danh sách cuộn/ Ví dụ: ListView.builder(…)
- Scaffold: Giao diện cơ bản của 1 trang/ Ví dụ: Scaffold(appBar: …, body: …)
ỨNG DỤNG WIDGET VÀO MINI PROJECT (NOTE APP)
Mục tiêu của Project :
Tạo app ghi chú đơn giản gồm các chức năng:
-
Nhập nội dung ghi chú
-
Lưu ghi chú vào danh sách
-
Hiển thị danh sách ghi chú
-
Xóa ghi chú
Vai trò của các Widget trong Project :
StatefulWidget: Dùng cho toàn bộ màn hình để quản lý danh sách ghi chú thay đổi
TextField : Dùng để nhập nội dung ghi chú
ElevatedButton: Nút để thêm ghi chú vào danh sách
ListView.builder: Hiện thị danh sách các ghi chú
Text: Hiện thị nội dung ghi chú
IconButton: Nút để xóa từng ghi chú
TextEditingController: Quản lý và lấy nội dung từ TextField
Mục tiêu sẽ làm trong bài báo cáo này :
- Xây dựng giao diện cơ bản bằng Widget
- Github Project : https://github.com/phuoc24205/intern-flutter-project
Hình ảnh kết quả :
Bài viết khác
Flutter Form
FLUTTER FORM LÀ GÌ? Form trong Flutter là widget dùng để thu thập và kiểm tra dữ liệu người dùng nhập vào. Thường dùng khi cần nhập nhiều trường và muốn kiểm tra tính hợp lệ của dữ liệu. Sự khác nhau giữa Form + TextFormField và TextField thông thường TextField là widget đơn lẻ, […]
Flutter State Management
State Management trong Flutter là quá trình quản lý và thay đổi trạng thái của widget. Khi state thay đổi, widget sẽ được cập nhật lại để phản ánh thay đổi đó. Có nhiều phương pháp quản lý state trong Flutter, mỗi phương pháp phù hợp với các loại ứng dụng khác nhau. Các […]
Flutter Layout
Flutter Layout là gì ? Trong Flutter, layout là quá trình sắp xếp các widget con trong không gian giao diện người dùng. Flutter cung cấp nhiều widget layout giúp xây dựng giao diện ứng dụng linh hoạt và dễ dàng. Việc sử dụng đúng các widget layout sẽ giúp bạn tạo ra giao diện […]
Flutter Package
Trong quá trình phát triển ứng dụng Flutter, để tiết kiệm thời gian và tái sử dụng các tính năng có sẵn, lập trình viên thường sử dụng Flutter package – là các thư viện (thư viện mã nguồn mở hoặc do cá nhân viết) giúp thêm các chức năng mới vào ứng dụng mà […]
Agile – Phương pháp phát triển phần mềm linh hoạt
Agile là gì? Agile là một phương pháp phát triển phần mềm linh hoạt, nhấn mạnh vào khả năng thích nghi với thay đổi, làm việc theo nhóm, và phát triển sản phẩm theo từng phần nhỏ (iterative & incremental). Agile không phải là một quy trình cụ thể, mà là một tư duy (mindset) […]
Domain – Tên miền của website trên Internet
Domain là gì? Domain (tên miền) là địa chỉ của một website mà người dùng gõ vào trình duyệt để truy cập. Ví dụ: google.com, facebook.com, mywebsite.vn đều là các tên miền. Nếu Hosting là “ngôi nhà” chứa dữ liệu của website, thì Domain là “địa chỉ nhà” – giúp người dùng tìm đến website […]
Khoá học lập trình game con rắn cho trẻ em 
