0

我对另一个 CustomScrollView 中的 CustomScrollView 有不良行为。

下面我展示了所需的行为:

期望的行为 GIF

下面我展示了实际行为:

实际行为 GIF

我已经尝试过 NestedScrollView 类,但是我无法获得所需的行为,我将非常感谢一个可能的解决方案。

编码:

主页.dart

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  ScrollController _scrollControllers = new ScrollController();
  int value = 1;

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: SafeArea(
        child: FutureBuilder(
          future: API.getCategories(),
          builder: (c, snapshot) {
            if (!snapshot.hasData) {
              return Center(
                child: CircularProgressIndicator(),
              );
            }
            List<Tab> tabs = new List<Tab>();
            List<PostList> tabsData = new List<PostList>();
            for (int i = 0; i < snapshot.data.length; i++) {
              if ( i == 0 ) {
                tabs.add(Tab(
                  child: Text(
                    "Todos",
                    style: TextStyle(color: Theme.of(context).primaryColor),
                  ),
                ));
                tabsData.add(PostList());
              }
              tabs.add(Tab(
                child: Text(
                  snapshot.data[i].title,
                  style: TextStyle(color: Theme.of(context).primaryColor),
                ),
              ));
              tabsData.add(PostList());
//              tabsData.add(Center(child: CircularProgressIndicator(),));
            }
            return DefaultTabController(
              length: snapshot.data.length + 1,
              child: CustomScrollView(
                physics: new ClampingScrollPhysics(),
                controller: _scrollControllers,
                slivers: [
                  headerSliverApp(),
                  lastBroadcastTitle(),
                  LastBroadCastList(),
                  categoriesHorizontalTabs(tabs),
                  categoriesTabs(tabsData),
                ],
              ),
            );
          },
        ),
      ),
    );
  }

  headerSliverApp() {
    return SliverAppBar(
      title: Image.asset(
        "assets/images/logo.png",
        height: 35.0,
      ),
      centerTitle: true,
    );
  }

  lastBroadcastTitle() {
    return SliverList(
      delegate: SliverChildListDelegate(
        [
          Padding(
            padding: EdgeInsets.only(
              left: 20.0,
              top: 15.0,
            ),
            child: Text(
              'Emisiones',
              style: Theme.of(context).textTheme.headline1,
            ),
          ),
        ],
      ),
    );
  }
  categoriesHorizontalTabs(tabs) {
    return SliverAppBar(
      pinned: true,
      backgroundColor: Theme.of(context).backgroundColor,
      title:
      TabBar(
        labelColor: Theme.of(context).primaryColor,
        indicatorColor: Colors.pink,
        isScrollable: true,
        tabs: tabs,
        indicator: UnderlineTabIndicator(
          borderSide: BorderSide(
              color: Theme.of(context).primaryColor, width: 3.0),
        ),
      ),
    );
  }
  categoriesTabs(tabsData) {
    return SliverList(
      delegate: SliverChildListDelegate(
        [
          SizedBox(
            height: MediaQuery.of(context).size.height,
            child: TabBarView(
              children: tabsData,
            ),
          ),
        ],
      ),
    );
  }
}

PostList 小部件

class PostList extends StatefulWidget {
  ScrollController scrollControllers;
  PostList({this.scrollControllers});

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

class _PostListState extends State<PostList>
    with AutomaticKeepAliveClientMixin {
  List<Post> posts = new List<Post>();
  bool isLoading = false;
  ScrollController _scrollController = new ScrollController();
  int page = 0;

  void getPosts() {
    if (!isLoading) {
      setState(() {
        page++;
        isLoading = true;
      });

      API.getPosts(category: 0, page: page).then((_post) {
        setState(() {
          print(_post);
          isLoading = false;
          posts.addAll(_post);
        });
      });
    }
  }

  @override
  void initState() {
    super.initState();
    getPosts();
    _scrollController.addListener(() {
      print(_scrollController.position.pixels);
      if (_scrollController.position.pixels ==
          _scrollController.position.maxScrollExtent - 0) {
        getPosts();
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return CustomScrollView(
      physics: new AlwaysScrollableScrollPhysics(),
      controller: _scrollController,
      slivers: [
        SliverList(
            delegate: SliverChildBuilderDelegate(
                  (BuildContext context, int index) {
                return postItem(context, index);
              },
              childCount: posts.length,
            )
        ),
      ],
    );
  }

  Widget postItem(BuildContext context, int index) {
    return PostItem(posts[index]);
  }

  @override
  void dispose() {
    _scrollController.dispose();
    super.dispose();
  }

  @override
  bool get wantKeepAlive => true;
}
4

0 回答 0