dart - flutter : Refresh same screen with different data and back button

标签 dart flutter flutter-layout flutter-animation flutter-sliver

几天前,我最近开始探索 Flutter。我创建了一个包含一些行的列表。 有些行有子数据。

现在屏幕顶部有自定义按钮。

final topAppBar = AppBar(
  elevation: 0.1,
  backgroundColor: Color.fromRGBO(0, 113, 188, 1.0),
  title: Text("RESOURCES", style: TextStyle(
    color: Colors.white,
    fontFamily: 'Raleway-ExtraBold',
    fontWeight: FontWeight.w900,
    fontSize: 20.0,
  ),),
  leading: IconButton(
    icon: new Image.asset('assets/images/settings.png'),
  ),
);

当用户点击这些行时,我只想用子数据刷新列表,并通过更新顶部的“后退按钮”来推送效果。

下面的代码能够通过推送效果导航屏幕,但是我们如何使用数据和后退按钮来维护应用程序的状态。

ListTile makeResourcesListTile(Resources resources) => ListTile(
      contentPadding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 0.0),
      title: Text(
        resources.title,
        style: TextStyle(
          color: Colors.white,
          fontSize: 14.0,
          fontWeight: FontWeight.bold,
          fontFamily: "Raleway-Bold",
        ),
      ),
      trailing:
          Icon(Icons.keyboard_arrow_right, color: Colors.white, size: 30.0),
      onTap: () {

            Navigator.pushNamed(context, ‘/listScreen’);



      },
    );

请推荐。提前谢谢你

最佳答案

我认为你应该看看:Passing data between screens in Flutter

这是您要找的吗?

乐:

如果您只想更改列表的数据源并添加后退按钮,请尝试以下代码:

class MyHomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _MyHomePageState();
  }
}

class _MyHomePageState extends State<MyHomePage> {
  bool showDetails = false;
  String title = 'Resources';

  List<Resource> resources = [
    new Resource('1', 'one', null),
    new Resource('2', 'two', [new Resource('Child', 'Child', null)]),
    new Resource('3', 'three', null),
    new Resource('4', 'four', [
      new Resource('Child', 'Child', null),
      new Resource('Child', 'Child', null)
    ]),
    new Resource('5', 'five', null)
  ];
  List<Resource> currentSource;

  @override
  Widget build(BuildContext context) {
    if (!showDetails) {
      currentSource = resources;
    }

    Widget showResourcesList() {
      return new ListView.builder(
          itemCount: currentSource.length,
          itemBuilder: (BuildContext context, int index) {
            return new ListTile(
                title: Center(
                  child: Text(currentSource[index].name),
                ),
                onTap: () {
                  setState(() {
                    if (currentSource[index].children != null) {
                      title = 'Children for ' + currentSource[index].name;
                      currentSource = resources[index].children;
                      showDetails = true;
                    }
                  });
                });
          });
    }

    Widget showBackButton() {
      return IconButton(
        icon: Icon(Icons.arrow_back),
        onPressed: () {
          setState(() {
            showDetails = false;
            currentSource = resources;
            title = 'Resources';
          });
        },
      );
    }

    Widget showSettingsButton() {
      return IconButton(
        icon: Icon(Icons.settings),
        onPressed: () {},
      );
    }

    return Scaffold(
      appBar: AppBar(
        elevation: 0.1,
        backgroundColor: Color.fromRGBO(0, 113, 188, 1.0),
        title: Text(
          title,
          style: TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.w900,
            fontSize: 20.0,
          ),
        ),
        leading: showDetails ? showBackButton() : showSettingsButton(),
      ),
      body: showResourcesList(),
    );
  }
}

class Resource {
  String name;
  String description;

  List<Resource> children;

  Resource(this.name, this.description, this.children);
}

我使用了一个代表应用程序状态的 bool 变量 (showDetails),并且在点击 listTile 时更改了数据源。

关于dart - flutter : Refresh same screen with different data and back button,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54978352/

相关文章:

flutter - 如何将行对齐到固定位置

android - 如何在列表中创建列表?

dart - 如何居中对齐堆叠元素,以及如何水平拉伸(stretch)一个?

dart - 如何展平一个列表?

以像素为单位的字符串长度抖动

android - Flutter oneSignal 通知图标未设置

flutter - 通过在Flutter中拖动项目,是否可以对 ListView 构建器中的项目进行重新排序?

flutter - GridView.count 适应子尺寸

dart - 如何使用 Dart 删除尾随零

flutter - 文本小部件未显示在 ListTile flutter 中