flutter에서 자식 위젯이 부모 위젯 함수 호출하기

flutter에서 자식 위젯이 부모 위젯 함수 호출하기를 샘플로 구현해 보았습니다.

 

구조를 조금 복잡하게 구성해 보았습니다.

 

<조건>

StatefulWidget A

A의 자식인 StatefulWidget B

B의 자식인 StatelessWidget C

C의 자식인 StatelessWidget D 인 구조에서

D 리스트 뷰 클릭 시 A 내 call 함수 실행하게 만드는 샘플

 

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: StatefulWidgetA(),
        ),
      ),
    );
  }
}

class StatefulWidgetA extends StatefulWidget {
  @override
  _StatefulWidgetAState createState() => _StatefulWidgetAState();
}

class _StatefulWidgetAState extends State<StatefulWidgetA> {
  void callFunction() {
    print("Function called from StatefulWidget A");
  }

  @override
  Widget build(BuildContext context) {
    return StatefulWidgetB(callFunction: callFunction);
  }
}

class StatefulWidgetB extends StatefulWidget {
  final Function callFunction;

  StatefulWidgetB({required this.callFunction});

  @override
  _StatefulWidgetBState createState() => _StatefulWidgetBState();
}

class _StatefulWidgetBState extends State<StatefulWidgetB> {
  @override
  Widget build(BuildContext context) {
    return StatelessWidgetC(callFunction: widget.callFunction);
  }
}

class StatelessWidgetC extends StatelessWidget {
  final Function callFunction;

  StatelessWidgetC({required this.callFunction});

  @override
  Widget build(BuildContext context) {
    return StatelessWidgetD(callFunction: callFunction);
  }
}

class StatelessWidgetD extends StatelessWidget {
  final Function callFunction;

  StatelessWidgetD({required this.callFunction});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        callFunction();
      },
      child: Container(
        padding: EdgeInsets.all(20.0),
        color: Colors.blue,
        child: Text(
          'Click me (D)',
          style: TextStyle(color: Colors.white),
        ),
      ),
    );
  }
}

 

 

dartpad 결과 화면