Trong Flutter, Widget là thành phần dùng để xây dựng giao diện của ứng dụng, chẳng hạn như văn bản, nút bấm, hình ảnh hoặc các thành phần hiển thị khác. Trong đó, StatelessWidget và StatefulWidget là hai loại Widget cơ bản mà người học Flutter cần nắm rõ.
1. StatelessWidget
StatelessWidget là loại Widget dùng để xây dựng giao diện không cần tự quản lý trạng thái thay đổi. Có thể hiểu đơn giản, đây là loại Widget phù hợp với những nội dung tương đối cố định, không cần thay đổi theo thao tác của người dùng.
Ví dụ, trong ứng dụng bán sữa, StatelessWidget có thể được sử dụng để hiển thị logo cửa hàng, tiêu đề trang chủ hoặc dòng chữ giới thiệu cửa hàng. Những nội dung này thường không cần tự thay đổi trong quá trình người dùng sử dụng ứng dụng.
Tuy nhiên, StatelessWidget không có nghĩa là giao diện sẽ không bao giờ thay đổi. Nếu dữ liệu được truyền vào thay đổi hoặc Widget cha xây dựng lại giao diện, StatelessWidget vẫn có thể được cập nhật để hiển thị nội dung mới.
2. StatefulWidget
StatefulWidget là loại Widget dùng để xây dựng giao diện có trạng thái cần thay đổi trong quá trình sử dụng ứng dụng. Loại Widget này phù hợp với những thành phần cần phản hồi theo thao tác của người dùng.
Ví dụ, trong ứng dụng bán sữa, khi người dùng nhấn nút tăng số lượng sản phẩm từ 1 lên 2, số lượng hiển thị trên màn hình sẽ thay đổi. Một ví dụ khác là nút bật hoặc tắt hiển thị mật khẩu trên màn hình đăng nhập.
StatefulWidget thường sử dụng phương thức setState() để thông báo rằng trạng thái đã thay đổi và cần cập nhật giao diện. Khi đó, Flutter có thể gọi lại hàm build() để xây dựng giao diện theo trạng thái mới.
3. Sự khác nhau giữa StatelessWidget và StatefulWidget
Điểm khác nhau chính giữa hai loại Widget này là cách quản lý trạng thái. StatelessWidget không tự quản lý trạng thái thay đổi của chính nó, nên thường được sử dụng cho những thành phần giao diện tương đối cố định. Trong khi đó, StatefulWidget có thể quản lý trạng thái thông qua đối tượng State, phù hợp với những giao diện cần cập nhật khi dữ liệu hoặc thao tác của người dùng thay đổi.
Khi xây dựng ứng dụng Flutter, việc lựa chọn Widget phù hợp giúp code dễ hiểu và dễ bảo trì hơn. Vì vậy, cần xác định xem thành phần giao diện có cần quản lý trạng thái thay đổi hay không trước khi lựa chọn sử dụng StatelessWidget hoặc StatefulWidget.
Bài viết khác
BÀI 5: TÌM HIỂU CHUYÊN SÂU VỀ LANGUAGE SWITCHING TRONG FLUTTER
1. Language Switching là gì? Trong một ứng dụng hỗ trợ nhiều ngôn ngữ, việc có sẵn các bản dịch chưa đủ để tạo ra trải nghiệm đa ngôn ngữ hoàn chỉnh. Ứng dụng còn cần xác định ngôn ngữ nào sẽ được sử dụng và cho phép thay đổi ngôn ngữ khi cần thiết. […]
TÌM HIỂU CHUYÊN SÂU VỀ UTC & LOCAL TIME CONVERSION TRONG FLUTTER
1. UTC & Local Time Conversion là gì? Trong một ứng dụng Flutter, thời gian xuất hiện ở rất nhiều chức năng như ngày tạo tài khoản, thời gian đặt hàng, lịch sử giao dịch, lịch hẹn, thời gian gửi thông báo và thời hạn của chương trình khuyến mãi. Khi ứng dụng chỉ chạy […]
TÌM HIỂU CHUYÊN SÂU VỀ DATE / NUMBER / CURRENCY FORMATTING TRONG FLUTTER
1. Date / Number / Currency Formatting là gì? Trong một ứng dụng Flutter, dữ liệu thường được lưu trữ và xử lý dưới dạng số, ngày giờ hoặc các kiểu dữ liệu có cấu trúc. Tuy nhiên, dữ liệu dùng để tính toán không nhất thiết giống với cách dữ liệu được hiển thị […]
TÌM HIỂU CHUYÊN SÂU VỀ LOCALIZATION (l10n) TRONG FLUTTER
1. Localization (l10n) là gì? Khi một ứng dụng được sử dụng ở nhiều quốc gia, sự khác biệt không chỉ nằm ở ngôn ngữ mà còn ở cách người dùng đọc ngày tháng, số, tiền tệ, đơn vị đo lường và các thông tin trên giao diện. Ví dụ, một ứng dụng bán hàng […]
TÌM HIỂU CHUYÊN SÂU VỀ INTERNATIONALIZATION (i18n) TRONG FLUTTER
1. Internationalization (i18n) là gì? Trong quá trình phát triển ứng dụng, lập trình viên thường xây dựng giao diện bằng một ngôn ngữ ban đầu, chẳng hạn như tiếng Việt. Khi ứng dụng được sử dụng bởi người dùng ở nhiều quốc gia, việc chỉ hỗ trợ một ngôn ngữ có thể khiến người […]
TÌM HIỂU CHUYÊN SÂU VỀ APP RELEASE & DEPLOYMENT TRONG FLUTTER
1. App Release & Deployment là gì? Trong quá trình phát triển ứng dụng Flutter, sau khi hoàn thành các chức năng, lập trình viên cần đưa ứng dụng đến người dùng thực tế. Ví dụ, một nhóm đã xây dựng xong ứng dụng bán hàng với những chức năng như đăng nhập, xem sản […]
Khoá học lập trình game con rắn cho trẻ em 
