[Flutter] 위젯간 Data 전달하기(생성자 변수, 함수 포인터)

위젯간 데이터를 전달하는 방법은 Provider 등 다양한 라이브러리를 사용하는 방법이 존재하지만

여기서는 가장 기본적인 방법에 대해서 알아보겠다

Dart에서 제공하는 방법으로 함수를 변수로 넘긴다

Stateful 위젯에서 setState()가 호출되면 해당 위젯이 재 생성됨을 사용하는 방법이다

 

class _NumberingState extends State<Numbering> {

  int datatoSend = 0;   <-OtherWidget으로 전달하는 데이타

  int returnData =  -1  <- OtherWidget으로 부터 전달받는 데이타

 

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      ....

      body: Column(

        .....

          children:

           Container(

             ....

             child: Text('returnData - $retrunData'),  <- OtherWidget에서 버튼이 눌려지면 데이터 값이 반영된다

             ....

           Container(

            child: Center(

              child: RaisedButtern(

                onPressed: ( ) {

                  setState( ( ) {

                    dataToSend++;

                    print('dataToSend - $dataToSend');

                  });

                },

                child: Text('dataToSend - $dataToSend'),

              ), //RasisedButtun

            ), // Center

          ), //Container

          OtherWidget(received: dataToSend, function: returnDataFunction,)  <- onPressed되어 상태가 변할때 마다 생성자가 호출된다

         ....

  }

 

 // OtherWidget에 전달할 함수를 선언..호출되면 setState()가 호출되어 _NumberingState내의 위젯이 재 생성된다

  void returnDataFunction(int returnDt) {    

    setState(( ) {

      returnData = returnDt;

    });

  }            

}

 

class OtherWidget extends StatelessWidget {

  const OtherWidget( {

    Key key,

    @required this.received,  <- 생성자 호출시 전달받은 dataToSend 값을 저장한다.

    this.function,    <- 생성자가 호출되었을 때 인수로 넘어오는 함수의 포인터

  }) : super(Key: key);

 

  final int received;  

 

  @override

  Widget build(BuildContext context) {

    return RaisedButton(

      onPressed: ( ) {

        function( received * 2);   <- 버튼이 눌리면 returnDataFunction( ) 함수가 호출된다

      },

      child: Text('received data - $received'));  <- 호출될 때 수신된 데이터가 저장된다

  }

}

 

참고영상: www.youtube.com/watch?v=cuT1koj18yU