State Management Package Documentation

Overview

This package provides a custom state management solution for Flutter applications without relying on external packages.
It supports synchronous and asynchronous state updates, nested state management, and performance optimization.

Getting Started

Add the package to your project

Import the necessary files into your Flutter project:

import 'lib/src/observable.dart';
import 'lib/src/state_manager.dart';
import 'lib/src/state_builder.dart';

Initialize a StateManager instance

final stateManager = StateManager();

Core Features and Usage

Initialize State

stateManager.setState('counter', 0);

Access State

Retrieve the current value of a state by its key:

final counter = stateManager.getState<int>('counter');

Update State Synchronously

stateManager.setState('counter', (counter ?? 0) + 1);

Update State Asynchronously

stateManager.setStateAsync('counter', Future.delayed(Duration(seconds: 2), () => 100));

Listen to State Changes

Add a listener to observe changes in a state:

stateManager.addStateListener<int>('counter', (newValue) {
  print('Counter updated: $newValue');
});

Remove Listeners

stateManager.removeStateListener<int>('counter', listenerFunction);

Nested State Management

Manage deeply nested structures:

stateManager.setNestedState('userProfile', 'newName', ['personalInfo', 'name']);

UI Updates with StateBuilder

StateBuilder<int>(
  stateKey: 'counter',
  builder: (context, value) {
    return Text('Counter: ${value ?? 0}');
  },
);

Reset or Clear States

Reset a specific state or all states:

stateManager.resetState('counter');
stateManager.clearAllStates();

Example Usage

A complete example integrating synchronous and asynchronous updates:

import 'package:flutter/material.dart';
final stateManager = StateManager();

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CounterScreen(),
    );
  }
}

class CounterScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    stateManager.setState('counter', 0);

    return Scaffold(
      appBar: AppBar(title: Text('State Manager Demo')),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          StateBuilder<int>(
            stateKey: 'counter',
            builder: (context, value) {
              return Text('Counter: ${value ?? 0}', style: TextStyle(fontSize: 24));
            },
          ),
          ElevatedButton(
            onPressed: () {
              final counter = stateManager.getState<int>('counter') ?? 0;
              stateManager.setState('counter', counter + 1);
            },
            child: Text('Increment'),
          ),
          ElevatedButton(
            onPressed: () async {
              await stateManager.setStateAsync(
                'counter',
                Future.delayed(Duration(seconds: 2), () => 100),
              );
            },
            child: Text('Set Async'),
          ),
        ],
      ),
    );
  }
}

Hướng dẫn sử dụng (Tiếng Việt)

Tổng quan

Package này cung cấp giải pháp quản lý state tùy chỉnh cho các ứng dụng Flutter mà không cần phụ thuộc vào các package bên ngoài.
Package hỗ trợ cập nhật state đồng bộ, bất đồng bộ, quản lý state dạng nested và tối ưu hiệu suất.

Bắt đầu sử dụng

Thêm package vào dự án của bạn

Import các file cần thiết vào dự án Flutter:

import 'lib/src/observable.dart';
import 'lib/src/state_manager.dart';
import 'lib/src/state_builder.dart';

Khởi tạo một đối tượng StateManager

final stateManager = StateManager();

Chức năng chính và cách sử dụng

Khởi tạo state

stateManager.setState('counter', 0);

Truy xuất state

Lấy giá trị hiện tại của state theo key:

final counter = stateManager.getState<int>('counter');

Cập nhật state đồng bộ

stateManager.setState('counter', (counter ?? 0) + 1);

Cập nhật state bất đồng bộ

stateManager.setStateAsync('counter', Future.delayed(Duration(seconds: 2), () => 100));

Lắng nghe thay đổi của state

Thêm listener để quan sát thay đổi:

stateManager.addStateListener<int>('counter', (newValue) {
  print('Giá trị counter đã thay đổi: $newValue');
});

Xóa listener

stateManager.removeStateListener<int>('counter', listenerFunction);

Quản lý state dạng nested

Quản lý cấu trúc dữ liệu phức tạp:

stateManager.setNestedState('userProfile', 'newName', ['personalInfo', 'name']);

Cập nhật UI với StateBuilder

StateBuilder<int>(
  stateKey: 'counter',
  builder: (context, value) {
    return Text('Counter: ${value ?? 0}');
  },
);

Reset hoặc xóa state

stateManager.resetState('counter');
stateManager.clearAllStates();

Ví dụ sử dụng

Ví dụ hoàn chỉnh:

import 'package:flutter/material.dart';
final stateManager = StateManager();

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CounterScreen(),
    );
  }
}

class CounterScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    stateManager.setState('counter', 0);

    return Scaffold(
      appBar: AppBar(title: Text('Demo State Manager')),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          StateBuilder<int>(
            stateKey: 'counter',
            builder: (context, value) {
              return Text('Counter: ${value ?? 0}', style: TextStyle(fontSize: 24));
            },
          ),
          ElevatedButton(
            onPressed: () {
              final counter = stateManager.getState<int>('counter') ?? 0;
              stateManager.setState('counter', counter + 1);
            },
            child: Text('Tăng giá trị'),
          ),
          ElevatedButton(
            onPressed: () async {
              await stateManager.setStateAsync(
                'counter',
                Future.delayed(Duration(seconds: 2), () => 100),
              );
            },
            child: Text('Cập nhật bất đồng bộ'),
          ),
        ],
      ),
    );
  }
}

Summary

This documentation provides both English and Vietnamese guides for the custom Flutter state management package.

Libraries

prostate