BuildContext

Creating and Displaying a snackbar

Snackbar를 화면에 표시하려면 Scaffold.of를 사용하여 scaffold에 대한 참조를 가져와야 합니다.

Scaffold.of(context).showSnackBar(mySnackBar)

class MyDocumentsScreen extends StatelessWidget {
   build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My documents'),
      ),
      body: RaisedButton(
        child: Text("Save all"),
        onPressed: () => Scaffold.of(context).showSnackBar(mySnackBar),
      ),
    );
  }
}

버튼을 누르면 snackbar 대신 아래와 같은 에러가 출력됩니다.

Scaffold.of() called with a context that does not contain a Scaffold.

of

Scaffold.of(context)는 주어진 buildContext에서 가장 가까운 ancestor scaffold를 반환합니다. of는 Flutter의 여러 위치에서 사용할 수 있습니다.

BuildContext

Context

빌드 된 모든 widget의 트리 구조 내에서 widget의 위치에 대한 참조

Context는 하나의 Widget에만 속하며, Widget A에 하위 Widget이있는 경우 A의 Context는 직접 하위 Context의 상위 Context가 된다.
(widget 트리와 동일한 구조)

위 다이어그램에서 색칠된 사각형으로 구분된 부분이 context이다.
이 Statement를 보면 알 수 있듯이 child context에서 ancestor widget을 쉽게 찾을 수 있다.
Parent context에서 descendant widget을 찾을 수도 있지만 비효율적이다.

그럼 다시 예제로 돌아가서,

class MyDocumentsScreen extends StatelessWidget {
  build(BuildContext context) {
  // context is login screen
}

Scaffold를 생성했더라도 build method의 BuildContext는 현재 widget이 아니라 Parent(Login screen, without scaffold)입니다.
결과적으로 Scaffold.of(context)는 Scaffold를 찾지 못하고 오류를 발생시킵니다.

Solution

class MyDocumentsScreen extends StatelessWidget {
   build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('My documents'),
        ),
        body: Builder( //body now wrapped in a Builder
          builder: (context) => // new BuildContext has a reference to the scaffold
           RaisedButton(
                child: Text('Save all'),
                onPressed: () => Scaffold.of(context).showSnackBar(mySnackBar),
              ),
        ));
  }
}