首页 > 解决方案 > Flutter:导航到不同页面时保持状态

问题描述

我有以下代码创建一个 Listview 并在每个项目的末尾添加一个图标。可以点击此图标以突出显示它。

问题是,当我离开页面时,项目被取消选择。我正在使用Navigator.of加载 Listview:

Navigator.of(context)
          .push(MaterialPageRoute<Null>(builder: (BuildContext context) {
        return new LikedList();
            }));

完整代码:

import 'package:flutter/material.dart';
import './images.dart';

class LikedList extends StatefulWidget {
  @override
  _LikedListState createState() => _LikedListState();
}

class _LikedListState extends State<LikedList> {
  List<bool> _likes = List.filled(ImagesState.likes.length,true);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Liked List'),
      ),
      body: ListView.separated(
        separatorBuilder: (context, index) => Divider(),
        itemCount: ImagesState.likes.length,
        itemBuilder: (context, index) {
          final item = ImagesState.likes[index];
          return ListTile(
            title: Text(item),
            trailing: IconButton(
              icon: _likes[index]
                  ? Icon(
                      Icons.favorite_border,
                      color: Colors.grey,
                    )
                  : Icon(
                      Icons.favorite,
                      color: Colors.red,
                    ),
              onPressed: () {
                setState(() {
                  print(_likes);
                  _likes[index] = !_likes[index];
                  print(_likes);
                });
              },
            ),
            onLongPress: () {
              setState(() {
                print(ImagesState.likes[index]);
                ImagesState.likes.removeAt(index);
              });
            },
          );
        },
      ),
    );
  }
}

标签: flutterdart

解决方案


推荐阅读