Flutter:如何将数据从子窗口小部件传递到父母窗口小部件?

时间:2020-09-21 14:07:58

标签: flutter dart

我制作了自定义小部件,如果我单击Google地图上的新位置,则会返回单击的经度和纬度。 (每次我点击一个新位置时,都会带来新的经度和纬度。)

它转换为地址(title)。我想将数据(title)传递给父小部件,并显示给appbar(parent)的标题。如何将数据传递到父窗口小部件?

子文件

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  String title;
  Completer<GoogleMapController> _controller = Completer();

  @override
  Widget build(BuildContext context) {
    return Container(
      child: GoogleMap(
        onTap: (LatLng loc)async{
          title = await GoogleMapServices.getAddrFromLocation(loc.latitude, loc.longitude);
        },
        mapType: MapType.normal,
        initialCameraPosition: CameraPosition(
            target: LatLng(37.422006, -122.084117),
            zoom: 18.0
        ),
        onMapCreated: (GoogleMapController controller){
          _controller.complete(controller);
        },
        myLocationEnabled: true,
        myLocationButtonEnabled: true,
        compassEnabled: true,
        zoomGesturesEnabled: true,
        rotateGesturesEnabled: true,
        scrollGesturesEnabled: true,
        tiltGesturesEnabled: true,
      ),
    );
  }
}

父文件

class MainPage extends StatefulWidget {
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  @override
  String title = "Data";
  @override
  int _selectedIndex = 0;

  static List<Widget> _widgetOptions = <Widget>[
    Home(),
    Study1(),
    Study2(),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(title),
          backgroundColor: Colors.red,
        ),
        drawer: SideMenu(),
        body: IndexedStack(
          index: _selectedIndex,
          children: _widgetOptions,
        ),
        bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          backgroundColor: Colors.deepPurpleAccent,
          unselectedItemColor: Colors.white38,
          selectedItemColor: Colors.white,
          items: const <BottomNavigationBarItem>[
            BottomNavigationBarItem(
              icon: Icon(Icons.home),
              title: Text('Home'),
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.tune),
              title: Text('Study1'),
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.tune),
              title: Text('Study2'),
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.tune),
              title: Text('Study3'),
            )
          ],
          currentIndex: _selectedIndex,
          onTap: _onItemTapped,
        )
    );
  }

  void _onItemTapped(int index) {
    setState(() {
      if (index == 3) {
        Navigator.push(context, MaterialPageRoute(builder: (context) => Study3()));
      }
      else {
        _selectedIndex = index;
      }
    });
  }
}

1 个答案:

答案 0 :(得分:0)

您需要使用Function这样将数据发送到父小部件:

孩子:

class Home extends StatefulWidget {
  
  final Function(String title) getTitle;
  Home({this.getTitle})
  
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  String title;
  Completer<GoogleMapController> _controller = Completer();

  @override
  Widget build(BuildContext context) {
    return Container(
      child: GoogleMap(
        onTap: (LatLng loc)async{
          title = await GoogleMapServices.getAddrFromLocation(loc.latitude, loc.longitude);
        },
        mapType: MapType.normal,
        initialCameraPosition: CameraPosition(
            target: LatLng(37.422006, -122.084117),
            zoom: 18.0
        ),
        onMapCreated: (GoogleMapController controller){
          _controller.complete(controller);
        },
        myLocationEnabled: true,
        myLocationButtonEnabled: true,
        compassEnabled: true,
        zoomGesturesEnabled: true,
        rotateGesturesEnabled: true,
        scrollGesturesEnabled: true,
        tiltGesturesEnabled: true,
      ),
    );
  }
}

,然后当您在父级中调用它时,像这样使用它:

  static List<Widget> _widgetOptions = <Widget>[
    Home(
    getTitle:(title){
    //todo send it to app bar title
      print(title);
    }
    ),
    Study1(),
    Study2(),
  ];