flutter 是否有任何deafult小部件一样,在图像或如果我需要这样做,如何才能实现?

w80xi6nr  于 2023-06-30  发布在  Flutter
关注(0)|答案(2)|浏览(105)

因此,我不寻找过滤器,但我正在寻找滚动部件。我试过生成列表视图项目和获取列表视图的位置来给予项目比率,但我无法在某些索引位置获得任何功能。任何帮助都是有益的。命名的小部件或特殊的小部件,可以让我这样做等。

cbjzeqam

cbjzeqam1#

您可以使用ListViewListView.builder来实现这一点,但是使用圆形小部件作为子部件。
你可以 checkout 这个tutorial来做水平列表。你可以 checkout this StackOverflow question,创建一个圆形按钮。或者你想使用CircleAvatar来代替按钮(在其中添加图像),你可以查看这个official doc

7lrncoxx

7lrncoxx2#

int _index = 0;
List<String> filters = [
    ImageConstant.imgEllipse14,
    ImageConstant.imgEllipse13,
    ImageConstant.imgEllipse12,
    ImageConstant.imgEllipse16,
    ImageConstant.imgEllipse15,
    ImageConstant.imgEllipse14,
    ImageConstant.imgEllipse13,
    ImageConstant.imgEllipse12,
    ImageConstant.imgEllipse16,
    ImageConstant.imgEllipse15,
  ];

Widget Scroller =
PageView.builder(
  itemCount: filters.length, // filters is a string array of image paths
  controller: PageController(viewportFraction: 0.22),
  onPageChanged: (int index) => setState(() => _index = index),
  itemBuilder: (_, i) {
     return Padding(
       padding: EdgeInsets.only(
           left: 13,
           top: 18,
           right: 13,
           bottom: 20),
       child: Transform.scale(
           scale: i == _index ? 2 : 1,
           child: Container(
           child: CircleAvatar(
              child: CustomImageView(
              imagePath: filters[i],
              radius: BorderRadius.circular(getHorizontalSize(21)),
              margin: getMargin(top: 20, bottom: 20),
           ),
         ),
       ),
     ),
   );
 },
);

您可以使用这种技术,也可以使用ScrollSnapList包https://pub.dev/packages/scroll_snap_list

相关问题