如何在Flutter中只显示最后一个元素

slwdgvem  于 2023-10-22  发布在  Flutter
关注(0)|答案(3)|浏览(127)

我有一个书签列表,我想在UI中只显示最后/最近的书签图书,但无法找到一种方法来做到这一点,所以任何帮助或建议将不胜感激。
我试过bookmarkedBook.last;但还是没用

List<BookModel> bookmarkedBook = [];
  late int bookId = 1;
  @override
  void initState() {
    super.initState();
    _updateTotalBookmarks();
  }

  void _updateTotalBookmarks() {
    final bookmarkController =
        provider.Provider.of<BookmarkController>(context, listen: false);
    setState(() {
      bookmarkedBook = bookmarkController.bookinStorage
          .where((book) => bookmarkController.isBookBookmarked(book.id ?? -1))
          .toList();

      bookmarkedBook.last;
    });
  }
SingleChildScrollView(
                      child: provider.Consumer<BookmarkController>(
                        builder: (context, data, child) {
                          return Column(
                            children: [
                              ListView.builder(
                                physics: NeverScrollableScrollPhysics(),
                                shrinkWrap: true,
                                itemCount: bookmarkedBook.length,
                                itemBuilder: (BuildContext context, int index) {
                                  final book = bookmarkedBook[index];
                                  return GestureDetector(
                                    onTap: () {
                                    },
                                    child: Container(
                                      height: 200,
                                      width: 130, // Specify the desired width
                                      padding: EdgeInsets.fromLTRB(10, 0, 0, 0),
                                      child: Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.center,
                                        children: [
                                          Image.asset(
                                            book.bookCoverPic ?? '',
                                            height: 150,
                                            width: 190,
                                          ),
                                        ],
                                      ),
                                    ),
                                  );
                                },
                              ),
                            ],
                          );
                        },
                      ),
                    ),
aiqt4smr

aiqt4smr1#

是否只显示最后一个书签(一个书签)?或者你想从最近到最早显示书签吗?(评论提问)
案例一:只显示最后一个书签(只有一个)

final numbers = <int>[1, 2, 3];
print(numbers.last); // 3

案例2:从最近到最早显示书签

  • 先把你的单子翻过来
var myList = [24, 56, 84, 92];
  var reversedList = new List.from(myList.reversed);
zazmityj

zazmityj2#

你可以通过在BookModel中添加一个时间戳来实现这一点,然后在取第一个时间戳之前按倒序排序。
所以你的模型看起来像:

class BookModel {
  int id;
  String title; 
  DateTime timestamp;

  BookModel({
    required this.id,
    required this.title, 
    required this.timestamp
  });
}

然后在添加书签时,你必须设置时间戳,比如:

BookModel book = BookModel(
  id: 1,
  title: 'Book Title',
  timestamp: DateTime.now()
);

然后使用时间戳按降序对书签列表进行排序:

bookmarkedBook.sort((a, b) => b.timestamp.compareTo(a.timestamp));

所以第一个元素将是最近的元素,比如:

BookModel mostRecent = bookmarkedBook.first;

现在你可以显示最新的你可以在how you can sort lists according to the order specified by the compare function.上参考这个文档

9lowa7mx

9lowa7mx3#

根据我的理解,你只想放慢最后一个书签进入你的UI。
在您的ListView.builder中,您已经将itemCount指定为bookmarkedBook.length,那么它会做什么呢?它会将所有书签填充到ListView中。现在你需要做什么?
解决方案:
1-设置ListView的长度为1(它将只为listView创建一个项目)
2-重构你的itemBuilder,像这样在itemBuilder中设置book

final book = bookmarkedBook.last;

P.S.从_updateTotalBookmarks()方法中删除bookmarkedBook.last

相关问题