在颤动中具有捕捉效果的水平滚动卡

在颤动中具有捕捉效果的水平滚动卡,第1张

颤动中具有捕捉效果的水平滚动

使用

PageView
ListView

import 'package:flutter/material.dart';main() => runApp(MaterialApp(home: MyHomePage()));class MyHomePage extends StatelessWidget {  @override  Widget build(BuildContext context) {    return Scaffold(      appBar: AppBar(        title: Text('Carousel in vertical scrollable'),      ),      body: ListView.builder(        padding: EdgeInsets.symmetric(vertical: 16.0),        itemBuilder: (BuildContext context, int index) {          if(index % 2 == 0) { return _buildCarousel(context, index ~/ 2);          }          else { return Divider();          }        },      ),    );  }  Widget _buildCarousel(BuildContext context, int carouselIndex) {    return Column(      mainAxisSize: MainAxisSize.min,      children: <Widget>[        Text('Carousel $carouselIndex'),        SizedBox(          // you may want to use an aspect ratio here for tablet support          height: 200.0,          child: PageView.builder( // store this controller in a State to save the carousel scroll position controller: PageController(viewportFraction: 0.8), itemBuilder: (BuildContext context, int itemIndex) {   return _buildCarouselItem(context, carouselIndex, itemIndex); },          ),        )      ],    );  }  Widget _buildCarouselItem(BuildContext context, int carouselIndex, int itemIndex) {    return Padding(      padding: EdgeInsets.symmetric(horizontal: 4.0),      child: Container(        decoration: BoxDecoration(          color: Colors.grey,          borderRadius: BorderRadius.all(Radius.circular(4.0)),        ),      ),    );  }}


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/4894682.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-11-12
下一篇 2022-11-12

发表评论

登录后才能评论

评论列表(0条)

保存