Hola, I’m Hieu, a Software Engineer

M3 migrations fail when done as big-bang UI rewrites. Bài này chuyển quan sát đó thành một mô hình nhỏ để bạn có thể kiểm thử, đo lường và giữ cho code dễ bảo trì khi app lớn lên. Vấn đề cốt lõi Component themes, regression goldens, and staged rollout. Câu hỏi hữu ích không phải API hay pattern có đẹp riêng lẻ hay không, mà là state nằm ở đâu, boundary nào chịu trách nhiệm khi lỗi xảy ra, và người dùng phục hồi thế nào khi happy path biến mất. Mô hình thực tế Stage by feature flag; use goldens for visual regression. Hãy bắt đầu bằng một owner rõ ràng cho behavior. Widget chỉ nên render và phát intent; IO, persistence, permission và retry nên nằm sau một interface nhỏ. Nhờ vậy bạn có seam để fake trong test và một chỗ ghi lại các dữ kiện cần theo dõi ở production. Trong app Flutter, boundary thường có dạng: Widget phát intent như load, submit, refresh hoặc retry. Controller hoặc use case validate intent rồi gọi boundary. Boundary trả về data có kiểu hoặc failure có kiểu, khôn...

M3 Expressive is a design language change — theme it, do not hand-paint every widget. Bài này chuyển quan sát đó thành một mô hình nhỏ để bạn có thể kiểm thử, đo lường và giữ cho code dễ bảo trì khi app lớn lên. Vấn đề cốt lõi ColorScheme.fromSeed, component themes, and dynamic color on Android. Câu hỏi hữu ích không phải API hay pattern có đẹp riêng lẻ hay không, mà là state nằm ở đâu, boundary nào chịu trách nhiệm khi lỗi xảy ra, và người dùng phục hồi thế nào khi happy path biến mất. Mô hình thực tế Seed colors + component themes keep brand and accessibility in one place. Hãy bắt đầu bằng một owner rõ ràng cho behavior. Widget chỉ nên render và phát intent; IO, persistence, permission và retry nên nằm sau một interface nhỏ. Nhờ vậy bạn có seam để fake trong test và một chỗ ghi lại các dữ kiện cần theo dõi ở production. Trong app Flutter, boundary thường có dạng: Widget phát intent như load, submit, refresh hoặc retry. Controller hoặc use case validate intent rồi gọi bounda...

Flutter 3.47 ships opt-in standalone design packages at 1.0. Design updates no longer wait on the quarterly SDK train. This article turns that observation into a small implementation model you can test, measure, and keep boring when the app grows. The problem in one sentence How to move off SDK-bundled Material/Cupertino with dart fix and the compatibility bridge. The useful question is not whether the API or pattern looks elegant in isolation. It is where state lives, which boundary owns failure, and how a user recovers when the happy path disappears. A practical model Weekly releases, independent upgrades, and a style-neutral core for custom design systems and platform design shocks. Start with one explicit owner for the behavior. Keep widgets responsible for rendering and user intent; keep IO, persistence, permissions, and retries behind a small interface. That gives you a seam for a fake in tests and a place to record the facts that matter in production. For a Flutter app, t...

Phone-only layouts look broken on foldables, tablets, and Chromebooks. Bài này chuyển quan sát đó thành một mô hình nhỏ để bạn có thể kiểm thử, đo lường và giữ cho code dễ bảo trì khi app lớn lên. Vấn đề cốt lõi Two-pane layouts, hinge awareness, and Material adaptive components. Câu hỏi hữu ích không phải API hay pattern có đẹp riêng lẻ hay không, mà là state nằm ở đâu, boundary nào chịu trách nhiệm khi lỗi xảy ra, và người dùng phục hồi thế nào khi happy path biến mất. Mô hình thực tế Flutter’s adaptive docs and M3 adaptive widgets give a path without forking UIs. Hãy bắt đầu bằng một owner rõ ràng cho behavior. Widget chỉ nên render và phát intent; IO, persistence, permission và retry nên nằm sau một interface nhỏ. Nhờ vậy bạn có seam để fake trong test và một chỗ ghi lại các dữ kiện cần theo dõi ở production. Trong app Flutter, boundary thường có dạng: Widget phát intent như load, submit, refresh hoặc retry. Controller hoặc use case validate intent rồi gọi boundary. Boun...

M3 migrations fail when done as big-bang UI rewrites. This article turns that observation into a small implementation model you can test, measure, and keep boring when the app grows. The problem in one sentence Component themes, regression goldens, and staged rollout. The useful question is not whether the API or pattern looks elegant in isolation. It is where state lives, which boundary owns failure, and how a user recovers when the happy path disappears. A practical model Stage by feature flag; use goldens for visual regression. Start with one explicit owner for the behavior. Keep widgets responsible for rendering and user intent; keep IO, persistence, permissions, and retries behind a small interface. That gives you a seam for a fake in tests and a place to record the facts that matter in production. For a Flutter app, the boundary usually looks like this: The widget emits an intent such as load, submit, refresh, or retry. A controller or use case validates the intent and ...

M3 Expressive is a design language change — theme it, do not hand-paint every widget. This article turns that observation into a small implementation model you can test, measure, and keep boring when the app grows. The problem in one sentence ColorScheme.fromSeed, component themes, and dynamic color on Android. The useful question is not whether the API or pattern looks elegant in isolation. It is where state lives, which boundary owns failure, and how a user recovers when the happy path disappears. A practical model Seed colors + component themes keep brand and accessibility in one place. Start with one explicit owner for the behavior. Keep widgets responsible for rendering and user intent; keep IO, persistence, permissions, and retries behind a small interface. That gives you a seam for a fake in tests and a place to record the facts that matter in production. For a Flutter app, the boundary usually looks like this: The widget emits an intent such as load, submit, refresh, o...

Phone-only layouts look broken on foldables, tablets, and Chromebooks. This article turns that observation into a small implementation model you can test, measure, and keep boring when the app grows. The problem in one sentence Two-pane layouts, hinge awareness, and Material adaptive components. The useful question is not whether the API or pattern looks elegant in isolation. It is where state lives, which boundary owns failure, and how a user recovers when the happy path disappears. A practical model Flutter’s adaptive docs and M3 adaptive widgets give a path without forking UIs. Start with one explicit owner for the behavior. Keep widgets responsible for rendering and user intent; keep IO, persistence, permissions, and retries behind a small interface. That gives you a seam for a fake in tests and a place to record the facts that matter in production. For a Flutter app, the boundary usually looks like this: The widget emits an intent such as load, submit, refresh, or retry. ...

Menu là nơi app Flutter hay “mở web” nhất. RawMenuAnchor là primitive chung; Cupertino và Material đều xây trên đó. Cupertino CupertinoMenuAnchor (community dẫn dắt, nổi bật davidhicks980) cho app iOS menu đúng kiểu UIKit: dismiss physics, nesting và focus khớp kỳ vọng nền tảng. Material MenuAnchor có animation Material 3 tùy chọn ( animated: true ) và SubmenuButton.hoverOpenDelay cho hover desktop. Bảng quyết định Mục tiêu Ưu tiên Sản phẩm iOS-first CupertinoMenuAnchor UI dày đặc desktop MenuAnchor + hoverOpenDelay Brand đa nền tảng Wrapper adaptive chọn theo platform Cạm bẫy Thứ tự callback close của RawMenuAnchor đã đổi — đọc breaking change trước khi upgrade. Đừng rebuild cả cây menu mỗi pointer event; giữ anchor ổn định. Bài viết gốc đăng tại FlutterCook . Bản trên đó là bản được cập nhật mới nhất.

Menus are where Flutter apps most often feel “webby.” RawMenuAnchor is the shared primitive; Cupertino and Material both build on it. Cupertino CupertinoMenuAnchor (community-led, notably davidhicks980) gives iOS apps a menu that behaves like UIKit: dismiss physics, nesting, and focus that match platform expectations. Material MenuAnchor gains optional Material 3 animations ( animated: true ) and SubmenuButton.hoverOpenDelay for desktop hover behavior. Decision table Target Prefer iOS-first product CupertinoMenuAnchor Desktop dense UI MenuAnchor + hoverOpenDelay Cross-platform brand Adaptive wrapper choosing by platform Pitfalls Callback close order changed on RawMenuAnchor — read the breaking-change note before upgrading. Do not rebuild the entire menu tree on every pointer event; keep anchors stable. Originally published on FlutterCook . Read the latest version there — that copy is the one kept up to date.

Material và Cupertino từng bị “đóng băng” bên trong core SDK. Mọi cập nhật design phải đợi nhịp release quarterly của Flutter. Ở Flutter 3.47, cả hai thư viện đạt 1.0 dạng package độc lập trên pub.dev: material_ui và cupertino_ui . Bản trong SDK vẫn còn ở release này. Package là opt-in . Đó là chủ đích — team đóng contribution từ tháng 4 để đường migrate nhàm chán nhất có thể. Vì sao cần tách trong năm 2026 Release design hàng tuần. Bugfix và component mới không còn chờ flutter upgrade . Upgrade độc lập. App ghim SDK cũ vẫn update được look-and-feel mới. Core trung lập style. Nền tảng gọn hơn cho design system riêng (và cú sốc Liquid Glass / M3 Expressive từ vendor). Migrate bằng dart fix flutter pub add material_ui # nếu dùng Cupertino: flutter pub add cupertino_ui dart fix --apply --code=migrate_design_widgets Lệnh này rewrite import từ package:flutter/material.dart / cupertino.dart sang package mới. Nếu pubspec.yaml không tự đổi (bug sớm đã biết), thê...

Menu là nơi app Flutter hay “mở web” nhất. RawMenuAnchor là primitive chung; Cupertino và Material đều xây trên đó. Cupertino CupertinoMenuAnchor (community dẫn dắt, nổi bật davidhicks980) cho app iOS menu đúng kiểu UIKit: dismiss physics, nesting và focus khớp kỳ vọng nền tảng. Material MenuAnchor có animation Material 3 tùy chọn ( animated: true ) và SubmenuButton.hoverOpenDelay cho hover desktop. Bảng quyết định Mục tiêu Ưu tiên Sản phẩm iOS-first CupertinoMenuAnchor UI dày đặc desktop MenuAnchor + hoverOpenDelay Brand đa nền tảng Wrapper adaptive chọn theo platform Cạm bẫy Thứ tự callback close của RawMenuAnchor đã đổi — đọc breaking change trước khi upgrade. Đừng rebuild cả cây menu mỗi pointer event; giữ anchor ổn định. Bài viết gốc đăng tại FlutterCook . Bản trên đó là bản được cập nhật mới nhất.

Material and Cupertino used to be frozen inside the core SDK. That made design updates wait on the quarterly Flutter release train. In Flutter 3.47 both libraries reach 1.0 as standalone packages on pub.dev: material_ui and cupertino_ui . You still get the SDK copies this release. The packages are opt-in . That is deliberate — the team froze contributions in April so the migration path could be boring. Why the split matters in 2026 Three concrete outcomes: Weekly design releases. Bugfixes and new components no longer wait for flutter upgrade . Independent upgrades. An app pinned to an older SDK can still take the latest look and feel. Style-neutral core. A leaner foundation for custom design systems (and for Liquid Glass / M3 Expressive-style shocks from platform vendors). Migrate with dart fix flutter pub add material_ui # if you use Cupertino: flutter pub add cupertino_ui dart fix --apply --code=migrate_design_widgets The fix rewrites imports from packag...

Menus are where Flutter apps most often feel “webby.” RawMenuAnchor is the shared primitive; Cupertino and Material both build on it. Cupertino CupertinoMenuAnchor (community-led, notably davidhicks980) gives iOS apps a menu that behaves like UIKit: dismiss physics, nesting, and focus that match platform expectations. Material MenuAnchor gains optional Material 3 animations ( animated: true ) and SubmenuButton.hoverOpenDelay for desktop hover behavior. Decision table Target Prefer iOS-first product CupertinoMenuAnchor Desktop dense UI MenuAnchor + hoverOpenDelay Cross-platform brand Adaptive wrapper choosing by platform Pitfalls Callback close order changed on RawMenuAnchor — read the breaking-change note before upgrading. Do not rebuild the entire menu tree on every pointer event; keep anchors stable. Originally published on FlutterCook . Read the latest version there — that copy is the one kept up to date.

For nine years, import 'package:flutter/material.dart'; has been the first line of almost every Flutter file ever written. Flutter 3.47 begins ending that. material_ui and cupertino_ui are now standalone packages on pub.dev , both at 1.0, both published by the verified flutter.dev publisher. The copies inside the SDK still work — and are scheduled for formal deprecation in the November stable release . This is a bigger change than the diff suggests, so it is worth understanding the reasoning before you run the migration tool. Why decouple at all The Q2 2026 survey answers this more clearly than any blog post. Across every focus area, satisfaction is high: Dart at 92%, Android at 91%, the core framework at 90% . One number breaks the pattern — Cupertino widgets at 61%, down 6 points , the lowest-rated area in the survey. The structural cause is release cadence. Bound to the SDK, Cupertino could only ship fixes on the quarterly stable train. Apple ships design changes whe...

Flutter 3.47 landed on August 13, 2026, and for once the headline is not a feature — it is an architectural split. The design system is moving out of the SDK. Add Impeller becoming the default renderer on every desktop platform and Widget Previews going stable, and this is the most structurally significant Flutter release in years. The numbers behind it: 1,356 commits from 169 contributors, 66 of them first-timers , shipping as Flutter 3.47.0 • Dart 3.13.0 • DevTools 2.60.0 . Material and Cupertino become packages you choose The change everyone is talking about: material_ui and cupertino_ui are now standalone packages on pub.dev , both at 1.0. The libraries still live inside the SDK for now, but the SDK copies are scheduled for formal deprecation in the November stable release . Why this matters more than it sounds: Design systems can now ship on their own clock. Instead of waiting for a quarterly SDK release, Material and Cupertino can iterate weekly. Cupertino in particular ...

Suốt chín năm, import 'package:flutter/material.dart'; là dòng đầu tiên của gần như mọi file Flutter từng được viết. Flutter 3.47 bắt đầu kết thúc điều đó. material_ui và cupertino_ui giờ là package độc lập trên pub.dev , cả hai ở 1.0, cùng do publisher đã xác minh flutter.dev phát hành. Bản trong SDK vẫn chạy — và đã lên lịch deprecate chính thức ở bản stable tháng 11 . Đây là thay đổi lớn hơn vẻ ngoài của cái diff, nên hiểu lý do trước khi chạy công cụ migrate là đáng. Vì sao phải tách ra Khảo sát Q2 2026 trả lời điều này rõ hơn mọi bài blog. Ở mọi mảng trọng tâm, mức hài lòng đều cao: Dart 92%, Android 91%, core framework 90% . Một con số phá vỡ quy luật — Cupertino widgets 61%, giảm 6 điểm , mảng bị chấm thấp nhất khảo sát. Nguyên nhân cấu trúc là nhịp phát hành. Bị buộc vào SDK, Cupertino chỉ ship sửa lỗi được theo chuyến tàu stable hàng quý. Apple thì đổi thiết kế bất cứ lúc nào họ muốn. Một design system chỉ phản ứng được bốn lần mỗi năm sẽ luôn chạy sau nền tảng...

Flutter 3.47 ra mắt ngày 13/08/2026, và lần này tiêu điểm không phải một tính năng — mà là một cú tách kiến trúc. Hệ thống thiết kế đang rời khỏi SDK. Cộng thêm việc Impeller thành renderer mặc định trên mọi nền tảng desktop và Widget Previews lên stable, đây là bản phát hành có ý nghĩa cấu trúc nhất của Flutter trong nhiều năm. Con số đứng sau: 1.356 commit từ 169 người đóng góp, 66 người lần đầu tham gia , phát hành dưới dạng Flutter 3.47.0 • Dart 3.13.0 • DevTools 2.60.0 . Material và Cupertino thành package bạn tự chọn Thay đổi ai cũng đang bàn: material_ui và cupertino_ui giờ là package độc lập trên pub.dev , cả hai đều đạt 1.0. Các thư viện cũ vẫn nằm trong SDK ở thời điểm này, nhưng bản trong SDK đã được lên lịch deprecate chính thức ở bản stable tháng 11 . Vì sao điều này quan trọng hơn vẻ ngoài của nó: Design system giờ chạy theo nhịp riêng. Thay vì chờ bản SDK hàng quý, Material và Cupertino có thể ra bản mới hàng tuần. Cupertino đặc biệt cần điều này — xem số liệu k...