Các Design Pattern Phổ Biến Trong Flutter
· 3 min read
1. MVC (Model-View-Controller)
1.1. Cấu Trúc
- Model: Quản lý dữ liệu và logic
- View: Hiển thị UI
- Controller: Xử lý tương tác người dùng
1.2. Ví Dụ
// Model
class User {
final String name;
final String email;
User(this.name, this.email);
}
// Controller
class UserController {
void updateUser(User user) {
// Logic xử lý
}
}
// View
class UserView extends StatelessWidget {
// UI components
}
2. MVVM (Model-View-ViewModel)
2.1. Thành Phần
- Model: Data và business logic
- View: UI và user interactions
- ViewModel: Kết nối Model và View
2.2. Implemention với Provider
class UserViewModel extends ChangeNotifier {
User _user;
User get user => _user;
void updateUser(User newUser) {
_user = newUser;
notifyListeners();
}
}
3. Repository Pattern
3.1. Cấu Trúc
- Repository Interface
- Remote Data Source
- Local Data Source
- Repository Implementation
3.2. Code Mẫu
abstract class UserRepository {
Future<User> getUser(int id);
Future<void> saveUser(User user);
}
class UserRepositoryImpl implements UserRepository {
final RemoteDataSource remote;
final LocalDataSource local;
UserRepositoryImpl(this.remote, this.local);
@override
Future<User> getUser(int id) async {
// Implementation
}
}
4. Singleton Pattern
4.1. Đặc Điểm
- Một instance duy nhất
- Global access point
- Lazy initialization
4.2. Ví Dụ
class ApiClient {
static final ApiClient _instance = ApiClient._internal();
factory ApiClient() {
return _instance;
}
ApiClient._internal();
}
5. Factory Pattern
5.1. Ứng Dụng
- Tạo objects động
- Encapsulation logic khởi tạo
- Tái sử dụng code
5.2. Implementation
abstract class Button {
void render();
}
class ButtonFactory {
static Button createButton(String type) {
switch (type) {
case 'material':
return MaterialButton();
case 'cupertino':
return CupertinoButton();
default:
throw Exception('Unknown button type');
}
}
}
6. Observer Pattern
6.1. Sử Dụng
- State management
- Event handling
- Real-time updates
6.2. Ví Dụ Với Stream
class DataStream {
final _controller = StreamController<Data>();
Stream<Data> get stream => _controller.stream;
void updateData(Data data) {
_controller.sink.add(data);
}
}
7. Builder Pattern
7.1. Ưu Điểm
- Xây dựng object phức tạp
- Step-by-step construction
- Flexible configuration
7.2. Code Example
class UserBuilder {
String? name;
String? email;
UserBuilder setName(String name) {
this.name = name;
return this;
}
User build() {
return User(name!, email!);
}
}
8. Best Practices
8.1. Khi Nào Sử Dụng
- Dự án lớn, phức tạp
- Cần tái sử dụng code
- Maintain dài hạn
- Team development
8.2. Lưu Ý
- Không over-engineering
- Chọn pattern phù hợp
- Documentation đầy đủ
- Unit testing
9. Anti-patterns Cần Tránh
- Massive View Controllers
- God Objects
- Tight Coupling
- Duplicate Code
10. Tools và Resources
- Analysis tools
- Linter rules
- Design pattern libraries
- Code generators