87 lines
3.0 KiB
Dart
87 lines
3.0 KiB
Dart
|
import 'package:cached_network_image/cached_network_image.dart';
|
||
|
|
import 'package:carousel_slider/carousel_slider.dart';
|
||
|
|
import 'package:flutter/material.dart';
|
||
|
|
import '../../../constants.dart';
|
||
|
|
import '../../../models/banner_item.dart';
|
||
|
|
|
||
|
|
class BannerCard extends StatefulWidget {
|
||
|
|
List<BannerItem> banners;
|
||
|
|
BannerCard({required this.banners});
|
||
|
|
@override
|
||
|
|
State<BannerCard> createState() => _BannerCardState();
|
||
|
|
}
|
||
|
|
|
||
|
|
class _BannerCardState extends State<BannerCard> {
|
||
|
|
int currentIndex = 0;
|
||
|
|
|
||
|
|
@override
|
||
|
|
Widget build(BuildContext context) {
|
||
|
|
return Padding(
|
||
|
|
padding: const EdgeInsets.all(8.0),
|
||
|
|
child: Stack(
|
||
|
|
children: [
|
||
|
|
ClipRRect(
|
||
|
|
borderRadius: BorderRadius.circular(4),
|
||
|
|
child: CarouselSlider(
|
||
|
|
options: CarouselOptions(
|
||
|
|
height: 200,
|
||
|
|
aspectRatio: 16/9,
|
||
|
|
viewportFraction: 1,
|
||
|
|
initialPage: 0,
|
||
|
|
enableInfiniteScroll: true,
|
||
|
|
reverse: false,
|
||
|
|
autoPlay: true,
|
||
|
|
autoPlayInterval: const Duration(seconds: 3),
|
||
|
|
autoPlayAnimationDuration: const Duration(milliseconds: 800),
|
||
|
|
autoPlayCurve: Curves.fastOutSlowIn,
|
||
|
|
enlargeCenterPage: true,
|
||
|
|
scrollDirection: Axis.horizontal,
|
||
|
|
onPageChanged: (int val, reason){
|
||
|
|
setState(() {
|
||
|
|
currentIndex = val;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
),
|
||
|
|
items: widget.banners.map((i) {
|
||
|
|
return Builder(
|
||
|
|
builder: (BuildContext context) {
|
||
|
|
return CachedNetworkImage(
|
||
|
|
imageUrl: "${i.image}",
|
||
|
|
fit: BoxFit.cover,
|
||
|
|
width: double.infinity,
|
||
|
|
errorWidget: (context, _,err) => Container(color: Colors.grey.shade100,),
|
||
|
|
placeholder: (context,_) => Container(color: Colors.grey.shade100,),
|
||
|
|
);
|
||
|
|
},
|
||
|
|
);
|
||
|
|
}).toList(),
|
||
|
|
),
|
||
|
|
),
|
||
|
|
Container(
|
||
|
|
height: 200,
|
||
|
|
width: double.infinity,
|
||
|
|
padding: const EdgeInsets.only(bottom: 8),
|
||
|
|
alignment: Alignment.bottomCenter,
|
||
|
|
child: Row(
|
||
|
|
crossAxisAlignment: CrossAxisAlignment.end,
|
||
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
||
|
|
children: [
|
||
|
|
for(int i = 0; i < widget.banners.length; i++)Container(
|
||
|
|
height: 6,
|
||
|
|
width: 6,
|
||
|
|
margin: const EdgeInsets.only(right: 4),
|
||
|
|
decoration: BoxDecoration(
|
||
|
|
shape: BoxShape.circle,
|
||
|
|
color: (currentIndex == i) ? Constants.primaryColor : Colors.transparent,
|
||
|
|
border: Border.all(color: (currentIndex == i) ? Constants.primaryColor : Colors.grey)
|
||
|
|
),
|
||
|
|
)
|
||
|
|
],
|
||
|
|
),
|
||
|
|
)
|
||
|
|
],
|
||
|
|
),
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|