BLOC CUBIT 정말 좋은 SWITCH 문으로 사용하기..

 

 

 

처음 if문 접했을때 riverpod 을 보고, switch를 적용 하고 .

문서 살펴보면서 만들어본 예제이고 앞으로 저도 이렇게 사용하려고 합니다.

디폴트를 _=> 이렇게 설정하는걸 발견, bloc는 모두 설정하다보니 ,

귀차니즘이 찾은 작성법입니다. 디폴트 없나 하고,, 찾다보니 찾아 지더군요. .

 

아래 코드는 예제로 만든 코드로 각 상태마다 페이지를 구성 합니다.

페이시 시작할때, 로딩중일때, 완료했을때, 에러날때, ..등등 상태설정해서

응용이 가능합니다.

 

return Scaffold(

appBar: AppBar(title: const Text('LIst Cubit')),

body: BlocBuilder<PersonCubit, PersonState>(

builder: (context, state)

=> switch (state) {

PersonInitialState() => _build_Empty(),

PersonUpdateState() => _build_List(state.person),

_ => _build_Empty(), // 디폴트 , state를 전체 switch 적용할때는 안해도된다.

},),);

 

class ListHomeCubit extends StatefulWidget {
  const ListHomeCubit({super.key});

  @override
  State<ListHomeCubit> createState() => _ListHomeCubitState();
}

class _ListHomeCubitState extends State<ListHomeCubit> {
  // @override
  // void dispose() {
  //   context.read<PersonCubit>().dispose();
  //   super.dispose();
  // }

  @override
  Widget build(BuildContext context) {
    final nameControl = context.read<PersonCubit>().nameController;
    final addressControl = context.read<PersonCubit>().addressController;

    return Scaffold(
      appBar: AppBar(title: const Text('LIst Cubit')),
      body: BlocBuilder<PersonCubit, PersonState>(
        builder: (context, state) => switch (state) {
          PersonInitialState() => _build_Empty(),
          PersonUpdateState() => _build_List(state.person),
             _ => _build_Empty(), // 디폴트 , state를 전체 switch 적용할때는 안해도된다.
        },
      ),
    );
  }

// //{
//                 if (state is PersonInitialState) {
//                   _build_Empty();
//                 }
//                 if (state is PersonUpdateState) {
//                   return _build_List(state.person);
//                 }
//                 return Container();
//               }

  Widget _build_Empty() {
    return Container(
      padding: const EdgeInsets.all(10),
      child: Column(
        children: [
          TextField(controller: context.read<PersonCubit>().nameController),
          const SizedBox(height: 10),
          TextField(controller: context.read<PersonCubit>().addressController),
          const SizedBox(height: 10),
          MaterialButton(
              onPressed: () {
                context.read<PersonCubit>().addPerson(context.read<PersonCubit>().nameController.text,
                    context.read<PersonCubit>().addressController.text);
                //    setState(() {});
              },
              color: Colors.teal,
              child: const Text('Add Contact')),
          const Center(child: Text('Empty List')),
        ],
      ),
    );
  }

  Widget _build_List(List<Person> personslist) {
    return Container(
      padding: const EdgeInsets.all(10),
      child: Column(
        children: [
          TextField(controller: context.read<PersonCubit>().nameController),
          const SizedBox(height: 10),
          TextField(controller: context.read<PersonCubit>().addressController),
          const SizedBox(height: 10),
          MaterialButton(
              onPressed: () {
                context.read<PersonCubit>().addPerson(context.read<PersonCubit>().nameController.text,
                    context.read<PersonCubit>().addressController.text);
            
              },
              color: Colors.teal,
              child: const Text('Add Contact')),
          //
          Expanded(
            child: ListView.builder(
              itemCount: personslist.length,
              itemBuilder: (context, index) {
                final person = personslist[index];
                return ListTile(
                  title: Text(person.name),
                  subtitle: Text(person.address),
                  trailing: IconButton(
                      onPressed: () {
                        context.read<PersonCubit>().subPerson(index);
                        
                      },
                      icon: const Icon(Icons.delete)),
                );
              },
            ),
          )
        ],
      ),
    );
  }

//
}