首页 > 解决方案 > Flutter:DraggableScrollbar 下不支持列

问题描述

这是 TabBarView() 的页面。我想在ListView.builder() 顶部添加一些文本或容器()ListView.builder()可以滚动。但不支持 column() 作为 DraggableScrollbar() 的子级。为什么这里不支持?

如何在启动ListView.builder()小部件之前添加 Text() 或任何容器()?

import 'package:boimarket/booksdescription.dart';
import 'package:boimarket/model/model.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:draggable_scrollbar/draggable_scrollbar.dart';

class StoryBooksCategory extends StatelessWidget {
  final ScrollController controller;
  const StoryBooksCategory({Key key, @required this.controller})
      : super(key: key);
  @override
  Widget build(BuildContext context) {
    var _height = MediaQuery.of(context).size.height;
    var _width = MediaQuery.of(context).size.width;
    final Color _whiteCream = Color.fromRGBO(250, 245, 228, 1);
    final Color _darkBlue = Color.fromRGBO(0, 68, 69, 1);
    return Align(
      alignment: Alignment.topCenter,
      child: Container(
        width: _width / 1.1,
        child: FutureBuilder(
          future: fetchBooks(),
          builder: (context, AsyncSnapshot<List<Book>> snapshot) {
            if (!snapshot.hasData) {
              return Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  LinearProgressIndicator(
                    backgroundColor: _whiteCream,
                  ),
                  Text("Loading"),
                ],
              );
            } else(snapshot.hasData) {
              var storyBooks =
                  snapshot.data.where((b) => b.category == 1).toList();
              storyBooks.sort((a, b) => a.name.compareTo(b.name));
              print(storyBooks.length);
              return DraggableScrollbar.rrect(
                controller: controller,
                backgroundColor: _darkBlue,
                child: Column(
                  children: [
                    Text("I want to add some text here"),
                    ListView.builder(
                      controller: controller,
                      scrollDirection: Axis.vertical,
                      itemCount: storyBooks.length,
                      itemBuilder: (context, index) {
                        return GestureDetector(
                          onTap: () {
                            Route route = MaterialPageRoute(
                              builder: (context) => BookDescription(
                                  storyBooksValue: storyBooks[index]),
                            );
                            Navigator.push(context, route);
                          },
                          child: Padding(
                            padding: const EdgeInsets.only(
                                left: 10.0, right: 10.0, top: 20.0),
                            child: Container(
                              width: _width / 1.1,
                              height: _height / 4,
                              decoration: BoxDecoration(
                                color: _whiteCream,
                                borderRadius: BorderRadius.all(
                                  Radius.circular(5.0),
                                ),
                                boxShadow: [
                                  BoxShadow(
                                    color: Colors.black26,
                                    blurRadius: 2,
                                    spreadRadius: 2,
                                    offset: Offset(2.0, 2.0),
                                  )
                                ],
                              ),
                            ),
                          ),
                        ),
                      },
                    ),
                  ],
                ),
              ),
            },
          },
        ),
      ),
    ),
  },
}

标签: flutteruser-interfacewidget

解决方案


推荐阅读