簡體   English   中英

Flutter-如何從Firestore檢索ID列表並在GridView中顯示其項目?

[英]Flutter - How to retrieve a list of IDs from Firestore and display their items in GridView?

我正在開發一個圖書應用,我需要顯示每個用戶的收藏夾列表,我可以將所有收藏夾保存在firestore中的數組中,但是我不知道如何將它們收藏到網格中。我使用StreamBuilder來檢索所有書籍,但是現在我不知道是否需要存儲它們以進行顯示以及如何顯示。 我試圖將所有收藏夾ID檢索到字符串列表,然后將它們加載到GridView中,但列表為null。

這是我的Firestore:

圖書Firestore 用戶Firestore

class _FavoriteScreenState extends State<FavoriteScreen> {

  UserModel model = UserModel();
  FirebaseUser firebaseUser;
  FirebaseAuth _auth = FirebaseAuth.instance;
  List<String> favorites;


  Future<List<String>> getFavorites() async{

  firebaseUser = await _auth.currentUser();

  DocumentSnapshot querySnapshot = await Firestore.instance.collection("users")
      .document(firebaseUser.uid).get();
  if(querySnapshot.exists && querySnapshot.data.containsKey("favorites") &&
    querySnapshot.data["favorites"] is List){
    return List<String>.from(querySnapshot.data["favorites"]);

  }
  return [];

  }


  @override
  Widget build(BuildContext context) {


    Widget _buildGridItem(context, index){

      return Column(
        children: <Widget>[
          Material(
            elevation: 7.0,
            shadowColor: Colors.blueAccent.shade700,
            child: InkWell(
              onTap: (){
                Navigator.of(context).push(MaterialPageRoute(
                    builder: (context) => DetailScreen(document)
                ));
              },
              child: Hero(
                tag: index['title'],
                child: Image.network(
                  index["cover"],
                  fit: BoxFit.fill,
                  height: 132,
                  width: 100,
                ),
              ),
            ),
          ),
          Container(
            width: 100,
            margin: EdgeInsets.only(top: 10, bottom: 5),
            child: Text(index["title"],
              textAlign: TextAlign.center,
              overflow: TextOverflow.ellipsis,
              maxLines: 2,
              style: TextStyle(
                fontSize: 10,
                fontWeight: FontWeight.w900,

              ),
            ),
          ),
        ],
      );
    }

    return Scaffold(

      body: favorites != null ? Stack(
        children: <Widget>[
          GridView.builder(
            padding: EdgeInsets.fromLTRB(16, 16, 16, 16),
            primary: false,
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 3,
              childAspectRatio: MediaQuery.of(context).size.width /
                  (MediaQuery.of(context).size.height),
              //crossAxisSpacing: 3,
              //mainAxisSpacing: 3
            ),
            itemBuilder: (context, index){
              return _buildGridItem(context, favorites[index]);
            },


          )

        ],
      )
      :
       Center(child: CircularProgressIndicator())
    );
  }

  @override
  void initState() async {
    // TODO: implement initState
    super.initState();
    favorites = await getFavorites();
  }

}

我不得不更換我的壁爐。

我創建了一個名為“ books”的新集合,其文檔為“ userIDs”,並創建了包含書籍及其信息的子集合。

現在,我可以輕松檢索喜歡的書了。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM