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

Question

Something like this: https://i.gyazo.com/2d60f65a1801eaaa58bcb1e795f7edec.png with circles. Is it also possible to do something like this https://gyazo.com/f58e4c5db30013a832b70a839fdc1c03 ?

Answer 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,
        ),