상세 컨텐츠

본문 제목

flutter 모델화(model)하여 구현하기

flutter

by carecat 2025. 7. 14. 22:48

본문

반응형

flutter  모델화하여 구현하기 입니다.

보통 소프트웨어 공학에서 MVC (Model View Controller) 이라고  합니다.

 

왜 할까요?

데이타 객체의 구조(변수는 어떤타입이며, 선언된 변수를 갖고)와 동작(함수는 선언된 변수를 갖고

어떻게 동작)을 정의해서 사용하면 재사용성과 관리가 편리해 집니다.~

만약 모델화 하지 않는다면 매번 데이타 가공시 데이타 타입과 동작등을  반복적으로 코딩해야 합니다..

 

flutter 에서는 주로 외부자료 통신(json 데이타 다룰때, database 자료 다룰때) 활용합니다..

 

[흐름도]

Model(데이타 타입,동작선언)   <-->   Controller(앱화면에 보여지기전) <--->    View(앱화면)       

   [JSON / DB 데이타..]                                      [처리]                                     [화면 View]

 

1.모델 클래스 선언: json 전송받은 데이타, 데이타베이스 데이타의 데이타 타입, 함수 동작

   회원 인적정보를 간단한 예로 보겠습니다...

 

  class UserProfile {
  int members;
  String name;
  String email;

  UserProfile({required this.members, required this.name, required this.email});  //생성자

  // 데이타 서버전송시 사용함수 맵형태로 전송  => 앱에서 서버로 데이타 저장시
  Map<String, dynamic> toMap() {
    return {
      'members': members,
      'name': name,
      'email': email,
    };
  }

  // 서버로부터 전송된  데이타를 클래스 객체화   =>앱의 위젯에 담기위해 객체화 시킴
  factory UserProfile.fromMap(Map<String, dynamic> map) {
    return UserProfile(
      id: map['id'] ?? '',
      name: map['name'] ?? '',
      email: map['email'] ?? '',
    );
  }
}

 

자, 그럼 선언된 객체로  controller 모델에서 구현합니다.

 firebase 사용 가정함.

 

-서버로 데이타 전송 toMap() 

import 'package:cloud_firestore/cloud_firestore.dart';

Future<void> saveUser(UserModel user) async {
  final docRef = FirebaseFirestore.instance.collection('users').doc(user.id); //이곳의 users 와 user는 서버 컬렉션 

  문서아이디 정보임.
  await docRef.set(user.toMap());
}

 

-서버에서 수신된 데이이타 객체화 / 싱글도큐먼트일때.

Future<UserModel?> getUser(String userId) async {
  final docSnapshot = await FirebaseFirestore.instance.collection('users').doc(userId).get();

  if (docSnapshot.exists) {
    return UserModel.fromMap(docSnapshot.data()!);
  }
  return null;
}

 

-서버에서 수신된 데이타 객체화 / 복수의 도큐먼트일때 , 즉 쿼리결과에 여러 도큐먼트가 존재할때.(QuerySnapShot일때.)

 

Future<List<UserModel>?> getUsers() async {

List<map<string,dynamic>>  listdocs =[];  //빈 리스트 생성
  final docSnapshot = await FirebaseFirestore.instance.collection('users').get();

  if (docSnapshot.docs.isNotEmpty) {

   for (QueryDocumentSnapshot doc in docSanpshot.docs) {  //쿼리도큐먼트로 각각읽음

        listdocs.add(doc.data());  //빈리스트에 담음

    }
    return

       listdocs.map((e) => UserModel.fromMap(e)).toList();  //리스트화해서 리턴!


  }
  return null;
}

 

마지막으로 앱에서 상기 구현한 리턴결과 값으로 앱에 구현해주면 됩니다.

 

이외, 외부자료 쿼리기능에 대한  helpler 파일이 더 있긴합니다. 

이 파일에서 실질적으로 서버에 접속해서 (json, db 쿼리 기능 구현)합니다.

요건 다음기회에 함 언급해 보겠습니다.

 

 

   

 

 

 

 

 

반응형

관련글 더보기