다이얼로그

  body: Dialog(child: Text('asg')),
onPressed: (){
            showDialog(context: context, builder: (context){
              return Dialog(child: Text('안녕'));
            });
          },

이렇게 넣으면 버튼 누를 때 뜨게끔 만들려 했는데 안됨… MaterialApp 을 바깥으로 보낼 것

void main() {
  runApp(MaterialApp(
    home: MyApp()
  )); // 앱 시작해주세요 라는 뜻임
}

이렇게 해주면 동작 함.

왜 이렇게 되는 것이냐…(원리)

context 에대한 설명

context란, 커스텀 위젯을 만들 때 마다 강제로 생성됨. build 함수 안에 context라는 파타미터, 이게 계속 쓰는 애임.

이 context가 무슨 뜻이냐 (부모 위젯이 누구인지 정보를 담고 있는 정보임)

Scaffold의 부모 위젯들을 뜻함. (쉽게 말해 족보임) scaffold이거의 부모 위젯? MaterialApp 임.

onPressed: (){
            print(context.findAncestorWidgetOfExactType<MaterialApp>());
            showDialog(context: context, builder: (context){
              return Dialog(child: Text('안녕'));
            });
          },

위와 같이 코딩하면 부모중에 MaterialApp을 찾아줌

context를 사용해야하는 함수들

    showDialog
    Scaffold.of
    Navigator.pop
    Theme.of 
    등등

context 입력 안하면 작동 안함. 그런데 showDialog 는 context를 입력해줘야하는데 부모중에 MaterialApp 이라는 애가 있어야 잘 작동을 함. 그런데 아까 동작 안하는 코드는 build 안에 return MaterialApp 이였기 때문에 부모가 없이 곧장 MaterialApp 을 가리키기 때문에 동작을 안함 그래서 부모를 밖으로 뺀 것임

또 다른 방법 : context(족보) 생성해주는 방법 전구 표시 눌러서 wrap with builder 이걸 눌러서 builder를 만들면 context가 새로 정해짐.

Class 간에 변수 공유 어떻게할거냐…

변수 범위라는게 있기 때문에 맘대로 갔다 쓸 수 없음.

state를 전송을 해줘야하는데,

  1. 보내고
  2. 등록하고
  3. 쓰면 됨.
1. 전송

Custom Widget

return DialogUI(작명 : 변수명)
2. 등록
const DialogUI({Key? key, this.state}) : super(key: key);
  final state; // 변경 못함, 안하는게 좋기 때문에 관습적으로 final 씀

이렇게 사용하면 됨.

3. 쓰기
  child: Text(state.toString())),
변수의 지정
const DialogUI(a,b) //이렇게 저장가능
const DialogUI({Key? key, this.state}) //중괄호로 감싸면 선택적 변수를 의미함

숙제

완료 버튼 누르면 a state + 1 되게 만들 것.

부모에게 state 전송 못함. (패륜전송 불가!) 옆집에게 state 전송 못함. (불륜전송 불가!)

최대한 위에 있는 부모가 가지고 있는것이 좋다.

함숫 만들기

addOne(){
    setState((){
      total++;
    });
  }

함수 보내기

  return DialogUI(addOne: addOne);

함수 사용하기

TextButton(onPressed: (){addOne();}, child: Text('완료')),

변수 만들어서 담기

// 1. controller 만들기
   var inputData = TextEditingController();
  TextField( controller: inputData),
// 2. onChaged 사용하기
   var inputData2 = '';
  TextField( onChanged: (text){ inputData2 = text; },),

TextFiled가 여러개일 경우 2번째 방법이 좋다. 변수 여러개 만들땐 [](List),{}(Map) 이렇게 쓰면 된다.

숙제

완료 버튼 누를 시 사람 항목 새로 생성될 수 있도록 힌트 : state 수정만 되면 됨

// 함수 생성
addState(text){
    name.add(text);
  }
// 사용하기
TextButton(onPressed: (){
              addState(inputData2);
                addOne();
              }, child: Text('완료')),

응용 사항

  • 빈칸이면 완료눌러도 추가 안되게
  • 이름 옆에 삭제버튼
  • 이름 순 정렬
  • 폰번호 추가 (배열 구조 변경)