Flutter如何将无限滚动ListView列表居中显示在屏幕中央

你在Scaffold的body里加的Center组件位置本身没有错误，不生效的核心原因是ListView.builder默认会撑满父组件给到的全部水平可用宽度，Center拿到的子组件宽度和屏幕可用宽度完全一致，自然不会出现居中留白的效果。

不需要调整Center的位置，只需要给ListView.builder加上宽度约束，限制它的最大宽度即可，修改_RandomWordsState的build返回逻辑，完整修改后的代码片段如下：

@override
Widget build(BuildContext context) {
  return ConstrainedBox(
    // 限制列表最大宽度，宽屏设备下不会拉满整行
    constraints: const BoxConstraints(maxWidth: 600),
    child: ListView.builder(
      padding: const EdgeInsets.all(16.0),
      itemBuilder: (context, i) {
        if (i.isOdd) return const Divider();

        final index = i ~/ 2;
        if (index >= _suggestions.length) {
          _suggestions.addAll(generateWordPairs().take(10));
        }
        return ListTile(
          title: Text(
            _suggestions[index].asPascalCase,
            style: _biggerFont
          ),
        );
      },
    ),
  );
}

• 小屏手机设备上，屏幕宽度本身小于设置的600最大宽度，列表会自动适配全屏宽度，不会出现内容截断、显示不全的问题
• 平板、桌面端等宽屏设备上，列表最多占据600宽度，剩余的左右空间会被外层的Center组件自动均分，实现预期的居中、两侧留白的效果
• 如果觉得600宽度不合适，可以自行调整maxWidth的数值匹配设计需求

内容的提问来源于stack exchange，提问作者helpoatmeal