最初使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

这听起来似乎是不好的做法，但是您可以将一个空容器，将其他轮播小部件的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,
),