如何在flutter中从另一个dart文件获取Map长度?

时间:2018-03-29 17:52:39

标签: dart flutter

这是我的main.dart文件和map.dart文件的代码。 在这里,我试图获得Map<>的长度从Map<>中删除一些键后,从main.dart文件中的map.dart文件联系点击"从地图中删除元素" map.dart文件中的按钮。 我从main.dart文件中的map.dart创建了MyMap类的对象,以获取Map的数据。 但我得到mapLength的初始值为0。 但我希望输出应该是Map<>的长度。通过单击凸起的按钮来联系"获取地图的长度"在main.dart。

main.dart

import 'package:flutter/material.dart';
import 'package:passing_length/map.dart';

void main() => runApp(new MyApp());


class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  var mapPage = new MyMap();


  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text(widget.title),
        ),
        body: new Center(
            child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  print(mapPage.mapLength());
                },
                child: new Text("Get length of map"),
              ),
            ),
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  Navigator.push(
                    context,
                    new MaterialPageRoute(builder: (context) => new MyMap()),
                  );
                },
                child: new Text("Goto new Page"),
              ),
            ),
          ],
        )));
  }
}

map.dart

class MyMap extends StatefulWidget {
  @override
  _MyMapState createState() => new _MyMapState();

  int mapLength() {
    return new _MyMapState().mapLength;
  }
}

class _MyMapState extends State<MyMap> {
  Map<String, int> contact = {
    "AAAA": 1111,
    "BBBB": 2222,
    "CCCC": 3333,
    "DDDD": 4444,
    "EEEE": 5555,
    "FFFF": 6666,
    "GGGG": 7777,
  };

  int mapLength = 0;

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: "My Map",
      home: new Scaffold(
          appBar: new AppBar(title: new Text("My Map")),
          body: new Center(
              child: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    contact.remove(contact.keys.elementAt(contact.length - 1));
                    mapLength = contact.length;
                    print(mapLength);
                  },
                  child: new Text("Remove element from map"),
                ),
              ),
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  child: new Text("Go Back"),
                ),
              ),
            ],
          ))),
    );
  }
}

2 个答案:

答案 0 :(得分:0)

要理解为什么这不起作用,我认为您需要更好地了解StatefulWidgets,States和Stateless小部件如何在Flutter中工作。我建议您通过Flutter开始使用codelab,尤其是stateful widgets上的部分,并且可能会花一些时间阅读stateful widgetstate文档。< / p>

但是TLDR如下 - 继承StatefulWidget的类应该只用于存储通过构造函数传入的东西,并且应该是不可变的。然后,继承State的类可以通过widget.finalMemberVariable访问这些参数。这背后的想法是每次完成封闭小部件中的新构建时,都会创建一个新的StatefulWidget,但关联的State可能在构建之间是持久的。除非您使用GlobalKeys,否则您永远不应该尝试从窗口小部件树中提取信息,但是当您使用不同的页面和导航器时,它们并不适用。

另外,如果您只是阅读了代码,那么您会看到mapLength设置为0并且在构建功能之前不会更改 - 当您正在调用return new _MyMapState().mapLength;时,您正在创建尚未建成的新州,当然地图长度为0。

它不是100%清楚你在这里尝试做什么,但我会猜测。您有一个带有联系人按钮的主页。当用户点击它时,他们会被带到联系人页面,在那里他们可以删除联系人。当您返回主页面时,您希望获得用户仍然拥有的联系人数量。

首先,我建议使用数据库或持久存储联系人的东西。这样你就可以添加/删除/编辑它们,它们会在应用程序关闭后继续存在。这样您就可以使用从主页和联系人页面访问您创建的数据库的任何方式 - 您在主页上查询数字并在联系人页面上进行实际的数据库操作。一个相当容易使用的插件是sqflite,尽管还有其他一些可以使用的Firebase。

另一种选择是,如果您只想在他们弹出该页面后想要联系人数量,并且您不希望您的主页面访问联系人数量,那么您可以在你从州里做Navigator.popNavigator.pop(context, contact.length)。在您的主页面中,您希望使用期货(类似Navigator.push(...))或使用async / await来保存Navigator.push(...).then((result) { setState(() { this.num = result }) })的结果。

总而言之,似乎你并不清楚如何实际使用Flutter。我建议首先关注flutter网站上的一些教程和代码,然后再尝试开发自己的应用程序,因为它们会让你更好地了解如何做这类东西。

答案 1 :(得分:0)

我是@rmtmckenzie提到的第二个,这是您的代码编辑,以显示如何在两个页面之间传递修改过的联系人地图:

main.dart

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Map<String, int> _contact = new Map();

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  print(_contact.length);
                },
                child: new Text("Get length of map"),
              ),
            ),
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  Navigator.push(
                    context,
                    new MaterialPageRoute(builder: (context) => new MyMap()),
                  ).then((contact) {
                    setState(() => _contact = contact);
                  });
                },
                child: new Text("Goto new Page"),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

map.dart

class MyMap extends StatefulWidget {
  @override
  _MyMapState createState() => new _MyMapState();
}

class _MyMapState extends State<MyMap> {
  Map<String, int> contact = {
    "AAAA": 1111,
    "BBBB": 2222,
    "CCCC": 3333,
    "DDDD": 4444,
    "EEEE": 5555,
    "FFFF": 6666,
    "GGGG": 7777,
  };

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: "My Map",
      home: new Scaffold(
        appBar: new AppBar(title: new Text("My Map")),
        body: new Center(
          child: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    contact.remove(contact.keys.elementAt(contact.length - 1));
                  },
                  child: new Text("Remove element from map"),
                ),
              ),
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    Navigator.pop(context, contact);
                  },
                  child: new Text("Go Back"),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

总而言之,我建议您查看flutter_flux或类似的插件,它允许您在整个应用程序中管理状态,而无需在页面之间连续传递值。示例应用程序可以在链接的仓库中找到,或here