[ Flutter ] Hive ( NoSql ) 데이터 저장

이전 hive 세팅이 끝났으므로

실제 데이터를 추가 기능을 구현

 

---

Box Add

이전 모달창에서 리스트에 추가하는 방식에서 hive에 데이터 추가 로직을 추가

버튼쪽에서는 이전 구현에서 바뀐점 없이 그대로 진행하며 addFixList함수에 로직을 추가

Container SaveChildButton(BuildContext context) {
    final fixSaveProvider =
        Provider.of<FixSaveProvider>(context, listen: false);
    return Container(
      margin: const EdgeInsets.fromLTRB(0, 0, 16.0, 0),
      alignment: Alignment.centerRight,
      child: ElevatedButton(
          onPressed: () {
            fixSaveProvider.addFixList(_controller.text);
            Navigator.pop(context);
          },
          style: ElevatedButton.styleFrom(
              backgroundColor: buttonColor,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(4)),
              elevation: 0),
          child: Text(
            '저장',
            style: TextStyle(color: textColor),
          )),
    );
  }

 

addFixList에 입력값을 받아와

해당 값을 Cost 타입의 객체로 변환

 

이후 만들어진 객체를 _costBox.add(cost) 를 사용하여 box에 추가

실제로 _costBox에서 값을 가져올 것이 아니라 fixedCost에 복사하여 사용하기 때문에 저장과 동시에 fixedCost리스트에도 값을 추가

class FixSaveProvider extends ChangeNotifier {
  late Box<Cost> _costBox;
  List<Cost> fixedCost = [];

  FixSaveProvider() {
    _initBox();
  }

  Future<void> _initBox() async {
    _costBox = await Hive.openBox<Cost>('costBox');
    // await _costBox.clear();
    fixedCost = _costBox.values.toList();
    notifyListeners();
  }

  List<Cost> get getFixedCost => fixedCost;

  void addFixList(String value) {
    Cost cost = Cost(id: getFixedCost.length + 1, title: "test", pay: value);
    _costBox.add(cost);
    fixedCost.add(cost);
    notifyListeners();
  }
}

 

hive를 사용하면 로컬에 저장이 되므로 테스트를 위해 이것저것 값을 넣었기에

_costBox.clear() 를 활용하여 필요시에 따라서 데이터를 초기화 

---

Load Data

이후 provider에서 get을 통해 fixedCost리스트를 가져와야하므로 사용할 컴포넌트 에서

proivder를 생성

class _FixedCostComponentState extends State<FixedCostComponent> {
  bool _isExpanded = false;

  @override
  Widget build(BuildContext context) {
    final fixSaveProvider = Provider.of<FixSaveProvider>(context);
    ....
    }

 

이후 데이터를 가져올 위젯에 provider를 파라미터로 전달

 children: [
              Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: ExpansionChildColumn(fixSaveProvider)),
            ],

 

전달받은 provider에서 이전 get으로 만든 fixedCost리스트를 가져와 저장 반복문을 활용하여 저장한 값을 화면에 뿌려준다.

  Column ExpansionChildColumn(FixSaveProvider fixSaveProvider) {
    final fixedCost = fixSaveProvider.getFixedCost;

    return Column(
      children: [
        for (int i = 0; i < fixedCost.length; i++)
          Padding(
            padding: const EdgeInsets.fromLTRB(0, 0.0, 16.0, 16.0),
            child: ExpansionChildList(fixedCost[i].title, fixedCost[i].pay),
          ),
        AddChildList(),
      ],
    );
  }

 

* provider에서 fixedCost리스트는 만들지 않고 사용해도 상관 없음.

이런식으로 바로 box를 get자체에 box.values.toList로 가져와도 사용 가능

class FixSaveProvider extends ChangeNotifier {
  late Box<Cost> _costBox;

  FixSaveProvider() {
    _initBox();
  }

  Future<void> _initBox() async {
    _costBox = await Hive.openBox<Cost>('costBox');
    notifyListeners();
  }

  List<Cost> get getFixedCost => _costBox.values.toList();

  void addFixList(String value) {
    Cost cost = Cost(id: getFixedCost.length + 1, title: "test", pay: value);
    _costBox.add(cost);
    notifyListeners();
  }
}