如何在 Flutter 中使用 Circle Items 制作 ListView 或 PageView 并调整当前 Circle 的大小？答案

【问题标题】：How to make a ListView or PageView with Circle Items in Flutter and resizing the current Circle bigger?如何在 Flutter 中使用 Circle Items 制作 ListView 或 PageView 并调整当前 Circle 的大小？
【发布时间】：2020-03-28 19:08:23
【问题描述】：

类似这样的东西：https://i.gyazo.com/2d60f65a1801eaaa58bcb1e795f7edec.png 带有圆圈。是否也可以这样做https://gyazo.com/f58e4c5db30013a832b70a839fdc1c03？

【问题讨论】：

标签： android listview flutter dart

【解决方案1】：

 //declare these
 PageController _pageController = PageController(viewportFraction: 0.5);
 int selectedPage = 0;
 List yourList =[];


 //in initState method
    _pageController.addListener(() {
      setState(() {
        selectedPage = controller.page;
      });
    });

  //inside body

     PageView(
          controller: _pageController,
          itemBuilder: (context, index) {
            if (index == selectedPage) {
               Container(
                  alignment: Alignment.center,
                  height:300.0,
                  width:300.0,
                  child: CircleAvatar(
                         backgroundImage: yourList[index],
                       //modify as you want
                      )
                )
            }
             else {
              Container(
                  alignment: Alignment.bottom,
                  height:100.0,
                  width:100.0,
                  child: CircleAvatar(
                         backgroundImage: yourList[index],
                       //modify as you want
                      )
            }
          },
          itemCount: yourList.length,
        ),

【讨论】：

您的意思是 index == selectedPage 而不是 position == selectedPage 吗？
是的！对不起！