Question

我可以在ListView中看到滚动条，并且可以滚动ListView。但是问题是我无法使用/拖动滚动条来滚动ListView。它只是显示为指示器，不响应触摸/手势。

这是ScrollBar的预期行为，还是我做错了什么？如果是这样，我如何才能在本地实现此目标（不使用软件包，还是必须这样做）？

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  final ScrollController _scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Scrollbar(
            isAlwaysShown: true,
            controller: _scrollController,
            child: ListView.builder(
                controller: _scrollController,
                itemCount: 100,
                itemBuilder: (context, index) {
                  return Card(
                      child: ListTile(
                    title: Text("Item: ${index + 1}"),
                  ));
                }),
          ),
        ),
      ),
    );
  }
}

Answer 1

您可以使用draggable_scrollbar。通过使用可拖动的滚动条，下面将为您提供完整的代码。

import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class MyApp extends StatelessWidget {
  final ScrollController _scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Padding(
          padding: const EdgeInsets.all(16.0),
          child: DraggableScrollbar.rrect(
            controller: _scrollController,
            padding: EdgeInsets.zero,
            child: ListView.builder(
                controller: _scrollController,
                itemCount: 100,
                itemBuilder: (context, index) {
                  return Card(
                      child: ListTile(
                    title: Text("Item: ${index + 1}"),
                  ));
                }),
          ),
        ),
      ),
    );
  }
}

滚动条不可拖动

1 个答案: