Question

由于某种原因，每当我尝试向上滚动时，我的StreamBuilder都会跳过整个Container。但是，只有当我从Firestore流中的某个点开始向上滚动时，它才会开始跳过Containers。也许下降了2000像素左右？无论哪种方式，重要的方面是当我将普通容器放在仅与StreamBuilders相同的方案中时，这不会发生。仅当我将其放在CustomScrollView中时，才会发生此问题。 （请参见下面的视频）

这件事发生在我尝试将StreamBuilder包装在Column / ListView中之后，以便可以将其他Container放在Stream Containers上方。将其包装在Column / ListView中不起作用，因为在Column中，另一个容器不会随着流的其余部分向下滚动。在ListView中，StreamBuilder具有自己的滚动系统，该滚动系统是独立的。

基本上，我的目标是要有一个滚动的小部件清单。顶部将与来自Firestore的部分（位于底部）分开。单击这些Firestore容器之一后，我将被带到另一页。

这是我达到目标的最接近的方法，但是如果有其他方法，我很想听听。

视频： 只有GREEN容器来自Firestore StreamBuilder。不是红色或蓝色的。

https://youtu.be/jOo08oLhZP8

代码：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:google_sign_in/google_sign_in.dart';
import 'package:firebase_auth/firebase_auth.dart';


class GeneralTopicsPage extends StatefulWidget {

  GeneralTopicsPage({this.user, this.googleSignIn, this.index});

  final FirebaseUser user;
  final GoogleSignIn googleSignIn;
  var index;

  @override
  _GeneralTopicsPageState createState() => new _GeneralTopicsPageState();
}

class _GeneralTopicsPageState extends State<GeneralTopicsPage> {

  @override
  Widget build(BuildContext context) {


    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            pinned: true,
            title: Text(
              "Testing",
            ),
          ),
          SliverPadding(
            //Works perfectly fine.
            padding: EdgeInsets.all(16.0),
            sliver: SliverList(
              delegate: SliverChildBuilderDelegate(
                (BuildContext context, int index) {
                  return Container(
                    margin: EdgeInsets.all(20.0),
                    color: Colors.red,
                    height: 400.0,
                    child: Center(
                      child: Text(
                        "This is a normal, hardcoded Container in red and it works perfectly fine. Notice the lack of skipping when scrolling up.",
                        style: TextStyle(
                          color: Colors.white
                        ),
                        textAlign: TextAlign.center,
                      ),
                    ),
                  );
                },
                childCount: 7,
              ),
            ),
          ),
           SliverPadding(
            //This is where it doesn't work as intended. Its behavior is separate from the containers located above and below it because it suddenly includes a StreamBuilder.
            padding: EdgeInsets.all(16.0),
            sliver: SliverList(
            delegate: SliverChildBuilderDelegate(
              (BuildContext context, int index) {
                return  StreamBuilder(
                  stream: Firestore.instance.collection("content").snapshots(),
                  builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
                    if (!snapshot.hasData) {
                      return Container(
                        child: Center(
                          child: CircularProgressIndicator(),
                        ),
                      );
                    } else {
                      return Container(
                        margin: EdgeInsets.all(20.0),
                        color: Colors.green,
                        height: 400.0,
                        child: Center(
                          child: Text(
                            snapshot.data.documents[index]['title'],
                            style: TextStyle(
                              color: Colors.white
                            ),
                            textAlign: TextAlign.center,
                          ),
                        ),
                      );
                    }
                  },
                );
              },
              childCount: 8,
            ),
          ),
        ),
        SliverPadding(
          //Works perfectly fine.
            padding: EdgeInsets.all(16.0),
            sliver: SliverList(
              delegate: SliverChildBuilderDelegate(
                (BuildContext context, int index) {
                  return Container(
                    margin: EdgeInsets.all(20.0),
                    color: Colors.blue,
                    height: 400.0,
                    child: Center(
                      child: Text(
                        "This is a normal, hardcoded Container in blue and it works perfectly fine. Notice the lack of skipping when scrolling up.",
                        style: TextStyle(
                          color: Colors.white
                        ),
                        textAlign: TextAlign.center,
                      ),
                    ),
                  );
                },
                childCount: 3,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

如果将Firestore StreamBuilder放在CustomScrollView中，为什么在向上滚动时会跳过？

0 个答案: