为什么下面的Flutter（Dart）代码不显示滚动条？

Question

我们可以上下滚动文本，但没有显示滚动条。

我显示滚动条的目的是让用户知道下面还有更多文本。

showDialog(
  context: context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: Text('Scrollable Alert Dialog'),
      content: SingleChildScrollView(
        child: Scrollbar(
          child: Column(
            children: [
              // add your scrollable content here
              // for example:
              for (var i = 1; i <= 20; i++)
                Text('Item $i'),
            ],
          ),
        ),
      ),
      actions: [
        TextButton(
          child: Text('Close'),
          onPressed: () => Navigator.of(context).pop(),
        ),
      ],
    );
  },
);

Answer 1

也许这 20 个项目不足以让它根据您的视口滚动。 SingleChildScrollView 仅当其子级尺寸大于其视口时才可滚动。此外，您可以使用

Scrollbar

包装可滚动的小部件 .

content: Scrollbar( // preferable 
  child: SingleChildScrollView(
    child: Column(
      children: [
        // add your scrollable content here
        // for example:
        for (var i = 1; i <= 220; i++) Text('Item $i'), //here 
      ],
    ),
  ),
),