我想在 Flutter 中创建以下类型的轮播视图
到目前为止我尝试过的
- 我已经有了这个
carousel_slider 1.4.1
包:flutter 包无法根据我的要求创建轮播视图 - 我已经尝试使用源代码并尝试根据我的要求进行修改但没有得到正确的解决方案这里是修改后代码的输出
- 我也试过这个中等职位。
- https://medium.com/@caleb_52205/using-animatedbuilder-and-pageview-builder-for-a-beautiful-carousel-3b05161d981d
我的代码
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/home.png'),
fit: BoxFit.cover,
),
shape: BoxShape.rectangle,
),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
width: 50.0,
height: 53.0,
child: Center(
child: Text(
"N",
style: TextStyle(
color: AppColors.textColor, fontSize: 20.0),
),
),
padding:
EdgeInsets.symmetric(horizontal: 10.0, vertical: 10.0),
decoration: BoxDecoration(
border:
Border.all(color: AppColors.textColor, width: 2)),
),
SizedBox(
height: 68,
),
Text(
"Hi",
style: TextStyle(fontFamily: 'f_book', fontSize: 16),
),
Text(
userName,
style: TextStyle(
fontFamily: 'f_bold',
fontSize: 28,
fontWeight: FontWeight.bold),
),
Container(
margin: EdgeInsets.only(top: 40),
child: CarouselSlider(
items: child,
autoPlay: false,
height: 400,
enableInfiniteScroll: true,
initialPage: 0,
enlargeCenterPage: true,
aspectRatio: 2.0,
onPageChanged: (index) {
setState(() {
_current = index;
});
},
),
),
Container(
margin: EdgeInsets.only(top: 40),
child: Center(child: Text(Constants.howDoesItWork)))
],
),
)
如果需要更多信息,请告诉我。提前致谢。您的努力将不胜感激。