[Flutter] 기초 - 화면끼리 데이터 전달(반환) 예제

이전 화면에 데이터 반환하기

• 다른화면에 값을 전달할 때에는 생성자로 값을 넘기면 된다.
• 이동한 화면에서 값을 호출한 화면으로 전달하고자 한다면

다음과 같이 이동할 화면을 호출한다. Navigator.push를 await로 호출하는 것이므로 저 코드를 포함한 함수는 async로 정의되어 있어야 한다. 호출된 화면이 종료되며 값을 반환하면 그 값은 result로 저장된다.

 

이동한 화면에서는 pop()으로 값을 반환한다. 두번째 파라메터로 반환한다.

전체소스는 다음과 같다.

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    title: '화면끼리 데이터연동',
    home: FirstScreen(),
  ));
}

class FirstScreen extends StatefulWidget {
  @override
  State<FirstScreen> createState() => _FirstScreenState();
}

class _FirstScreenState extends State<FirstScreen> {
  String result = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('화면끼리 데이터연동'),
      ),
      body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(result, style: TextStyle(fontSize: 30, color: Colors.blueGrey),),
          VerticalDivider(thickness: 3,),
          SendButton((data) {
            setState(() {
              result = data;
            });
          }),
        ],
      )),
    );
  }
}

class SendButton extends StatelessWidget {
  Function fnOnGetdata;
  SendButton(this.fnOnGetdata);

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        _sendDataToNextScreen(context);
      },
      child: Text('데이터 전송'),
    );
  }

  _sendDataToNextScreen(BuildContext context) async {
    // Navigator.push는 Future를 반환합니다. Future는 선택 창에서
    // Navigator.pop이 호출된 이후 완료될 것입니다.
    final result = await Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => NextScreen(<String>["1", "2", "3"])),
    );

    fnOnGetdata(result);
  }
}

class NextScreen extends StatelessWidget {
  List<String> buttonsTitle = [];
  NextScreen(this.buttonsTitle);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('선택하세요'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            for (var i = 0; i < buttonsTitle.length; i++) ...{
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: RaisedButton(
                  onPressed: () {
                    // 창을 닫고 결과 반환합니다.
                    Navigator.pop(context, '${buttonsTitle[i]}');
                  },
                  child: Text('${buttonsTitle[i]}'),
                ),
              )
            }
          ],
        ),
      ),
    );
  }
}