用于 Listview.Builder 的 Flutter 滚动条

Question

I would like to implement a Scrollbar on a Listview.Builder infinite list with over 100 cards. However, while the below code runs, the scrollbar does not appear at any time. It is always invisible.

I am wrapping the Listview.Builder in the scrollview, seen below.

I have seen little documentation on Flutter's Scrollbar besides the official docs. https://docs.flutter.io/flutter/material/Scrollbar-class.html

Any advice would be greatly appreciated!

Widget build(BuildContext context) {
return new Scaffold(
  appBar: new AppBar(
    title: new Text("Cards"),
  ),
  body: new RefreshIndicator(
    child: new Container(
      child: new Column(
        children: <Widget>[
          new Flexible(
            child: new StreamBuilder(
              stream: FirebaseStream
                 builder: (context, snapshot) {
          //I wrap the Listview.builder 
          //in the Scrollbar right below here
                new Scrollbar(child: ListView.builder(
                  controller: _CardExamplecrollController,
                      [code continues...]

Answer 1

Wrapping ListView with a Scrollbar widget should display a scrollbar when the list is scrolled, regardless if you're using ListView.builder or List<Widget> for the ListView. Verified using Flutter stable channel version 1.22.4

Here's a sample

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Scrollbar(
          child: ListView.builder(
            itemCount: 30,
            itemBuilder: (context, index) {
              return Card(
                child: Container(
                  padding: EdgeInsets.all(16.0),
                  child: Text('Item ${index + 1}'),
                ),
              );
            },
          ),
        ),
      ),
    );
  }
}