【问题标题】:create a list form two list of different items创建一个列表,形成两个不同项目的列表
【发布时间】:2020-12-21 10:06:06
【问题描述】:

我想从另外两个不同类型的小部件列表中创建一个列表。我有一个带有 Item() 的列表和另一个带有 FlatButton() 的列表。我想在 ListView.builder 的顶部添加 Item() 和 FlatButton() 的下方。列表的长度首先通过添加或删除带有提供程序的 Item() 的按钮来更改,另一个通过在收藏夹屏幕底部添加 FlatButton() 的按钮来更改。我不想要两个列表,我想要一个列表,首先是 favList 的 Item(),然后是 emptyList 的 Flatbutton()。 favList 包含 Item() 和另一个 FlatButton()。我想要一个包含两个列表数据的 ListView,但项目不同。对于favList,它是一个带有文本、描述和收藏图标的项目。对于emptyList,它只是一个按钮。

列表是 emptyList 和 favModel.favList

这是我的 favorite_screen.dart 代码:

class Favorite extends StatelessWidget {
  final List<EmptyItem> emptyList = List<EmptyItem>();
  
  @override
  Widget build(BuildContext context) {
    return Consumer<FavModel>(builder: (context, favModel, child) {
      final favList = favModel.favList;
      List<dynamic> finalList = [...favModel.favList, ...emptyList].toSet().toList();
      return Scaffold(
        appBar: AppBar(
          title: Text('Favoris'),
        ),
        body: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Expanded(
                child: ListView.builder(
                    shrinkWrap: true,
                    itemCount: finalList.length,
                    itemBuilder: (context, index) {
                      return index < favList.length ? FavItem(index) : EmptyItem(); 
                    }),
              ),
              Padding(
                padding: EdgeInsets.all(10),
                child: FlatButton(
                  child: Text(
                    'Add a place !',
                    style: TextStyle(
                      fontSize: 20,
                      fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                  ),
                  onPressed: () {
                    emptyList.add(EmptyItem());
                  },
                  color: Colors.green,
                ),
              )
            ]),
      );
      
    });
  } 
}

一个按钮

class EmptyItem extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlatButton(onPressed: null, child: Text('Ajoute un favoris !'));
  }
}

一个项目


class FavItem extends StatelessWidget {
  final int index;

  FavItem(this.index);
  @override
  Widget build(BuildContext context) {
    return Consumer<FavModel>(builder: (context, favModel, child) {
      final favList = favModel.favList;
      return Row(
          children: [
            Flexible(
              flex: 1,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  TextObject(favList[index].title, favList[index].description),
                  Padding(
                    padding: const EdgeInsets.all(7.0),
                    child: GestureDetector(
                        child: Icon(
                          Icons.favorite,
                          color: Colors.red,
                          size: 32,
                        ),
                        onTap: () {
                          favModel.removeOfFavorite(index, index);
                        }),
                  ),
                ],
              ),
            )
          ],
      );
    });
  }
}

【问题讨论】:

  • 不能用return FavItem(index);,不能用return index &lt; favList.length ? FavItem(index) : EmptyItem(); ?

标签: list flutter dart


【解决方案1】:

全局变量

List<Item> favItems = [
  Item.fromId(0),
  Item.fromId(1),
  Item.fromId(2),
];

您最喜欢的页面

class FavoritePage extends StatefulWidget {
  FavoritePage({Key key}) : super(key: key);

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

class _FavoritePageState extends State<FavoritePage> {
  int flatButtonCounter;
  
  @override
  void initState() {
    super.initState();
    
    flatButtonCounter = 0;
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Title"),
      ),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              itemCount: favItems.length + flatButtonCounter,
              itemBuilder: (context, index) {
                return index < favItems.length ? ListTile(
                  title: Text(favItems[index].title),
                ) : ListTile(
                  title: Text("FlatButton()"),
                );
              },
            ),
          ),
          MaterialButton(
            child: Text("Add FlatButton()"),
            onPressed: () {
              flatButtonCounter ++;
            },
          ),
        ],
      ),
    );
  }
}

示例项目类

class Item {
  int id;
  String title;

  Item.fromId(int id) {
    this.id = id;
    this.title = "Item $id";
  }
}

添加或删除项目的服务

class FavService {
  static void addFav() {
    favItems.add(Item.fromId(favItems.length));
  }
  
  static void removeFav() {
    favItems.removeLast();
  }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-06-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多