app/lib/components/carousel.dart

97 lines
3 KiB
Dart
Raw Normal View History

// ignore_for_file: dead_code
2022-05-15 17:21:27 +02:00
import 'package:carousel_slider/carousel_slider.dart';
2022-05-16 02:51:47 +02:00
import 'package:flutter/material.dart';
2022-05-15 17:21:27 +02:00
class Carousel extends StatefulWidget {
2022-05-16 02:42:29 +02:00
const Carousel({Key? key}) : super(key: key);
2022-05-15 17:21:27 +02:00
@override
State<Carousel> createState() => _CarouselState();
}
final List<String> imgList = [
2022-05-16 03:01:04 +02:00
'assets/images/carousel_1.webp',
'assets/images/carousel_2.webp',
2022-05-16 08:07:15 +02:00
'assets/images/carousel_3.webp',
2022-05-15 17:21:27 +02:00
];
class _CarouselState extends State<Carousel> {
int _current = 0;
final CarouselController _controller = CarouselController();
2022-05-15 17:21:27 +02:00
final List<Widget> imageSliders = imgList
2022-05-16 02:42:29 +02:00
.map(
(item) => Container(
margin: const EdgeInsets.all(5.0),
child: ClipRRect(
borderRadius: const BorderRadius.all(Radius.circular(5.0)),
child: Stack(
children: <Widget>[
Image.asset(item, fit: BoxFit.cover, width: 1000.0),
Positioned(
bottom: 0.0,
left: 0.0,
right: 0.0,
child: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [
Color.fromARGB(200, 0, 0, 0),
Color.fromARGB(0, 0, 0, 0)
],
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
2022-05-15 17:21:27 +02:00
),
),
2022-05-16 02:42:29 +02:00
padding: const EdgeInsets.symmetric(
vertical: 10.0, horizontal: 20.0),
child: const SizedBox(
width: 1.0,
)),
),
],
)),
),
)
2022-05-15 17:21:27 +02:00
.toList();
@override
Widget build(BuildContext context) {
2022-05-16 02:42:29 +02:00
return CarouselSlider(
2022-05-15 17:21:27 +02:00
items: imageSliders,
carouselController: _controller,
options: CarouselOptions(
aspectRatio: 2.0,
enlargeCenterPage: true,
enableInfiniteScroll: false,
initialPage: 2,
autoPlay: true,
onPageChanged: (index, reason) {
setState(() {
_current = index;
});
}),
);
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: imgList.asMap().entries.map((entry) {
return GestureDetector(
onTap: () => _controller.animateToPage(entry.key),
child: Container(
width: 12.0,
height: 12.0,
margin:
const EdgeInsets.symmetric(vertical: 8.0, horizontal: 4.0),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: (Theme.of(context).brightness == Brightness.dark
? Colors.white
: Colors.white
.withOpacity(_current == entry.key ? 0.9 : 0.4)),
),
));
}).toList(),
2022-05-16 02:42:29 +02:00
);
2022-05-15 17:21:27 +02:00
}
}