将 Flutter 滚动视图的第一个小部件最初居中对齐，但随后所有选定的小部件也居中对齐

Question

我想要达到的目标

我想让 ScrollView 的第一个小部件最初居中。但是如果滚动视图被滚动，滚动视图应该与父视图具有相同的宽度，并且居中的小部件应该是选定的。

接近

我的第一个想法是使用initialScrollOffset 属性。但这似乎没有任何效果。

@override
  Widget build(BuildContext context) {
    return ListView(
      scrollDirection: Axis.horizontal,
      children: _buildCarouselItems(),
      itemExtent: FrettirConstants.cardWidth,
      controller: new ScrollController(
          debugLabel: "Carousel",
          initialScrollOffset: -200,
        keepScrollOffset: true
      ),
    );
  }

草图

Answer 1

这听起来像是一个不好的做法，但您可以将一个空的 Container 添加到第一个位置，该容器的宽度是其他轮播小部件的 3/4。

在我的虚拟代码中，每个轮播小部件的长度为 160，而空容器必须有 3/4 的其他小部件。这样，第一个轮播小部件是完全可见的，而第二个是 3/4 可见性。

Container(
  width: 160.0 * 3 / 4,
  color: Colors.transparent,
),
Container(
  margin: EdgeInsets.only(
    right: 10.0
  ),
  width: 160.0,
  color: Colors.red,
),
Container(
  margin: EdgeInsets.symmetric(
      horizontal: 10.0
  ),
  width: 160.0,
  color: Colors.blue,
),