219 lines
8.1 KiB
Dart
219 lines
8.1 KiB
Dart
import 'package:cached_network_image/cached_network_image.dart';
|
|
import 'package:carousel_slider/carousel_slider.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:initial_folder/models/banners_model.dart';
|
|
import 'package:initial_folder/providers/banners_provider.dart';
|
|
import 'package:initial_folder/screens/detail_course/detail_course_screen.dart';
|
|
import 'package:initial_folder/theme.dart';
|
|
import 'package:initial_folder/widgets/custom_navigator.dart';
|
|
import 'package:initial_folder/widgets/terms_and_privacy.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:shimmer/shimmer.dart';
|
|
import '../../../../size_config.dart';
|
|
|
|
class CarouselWithIndicatorDemo extends StatefulWidget {
|
|
@override
|
|
State<StatefulWidget> createState() {
|
|
return _CarouselWithIndicatorState();
|
|
}
|
|
}
|
|
|
|
class _CarouselWithIndicatorState extends State<CarouselWithIndicatorDemo> {
|
|
int _current = 0;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
Widget listBannerPicture(BannersModel listBanner) {
|
|
return InkWell(
|
|
onTap: () {
|
|
String? idCourse;
|
|
if (listBanner.courseId.isNotEmpty) {
|
|
idCourse = listBanner.courseId;
|
|
} else {
|
|
if (listBanner.url!.isNotEmpty) {
|
|
if (listBanner.url!
|
|
.contains('https://vocasia-v4-develop.vercel.app/')) {
|
|
List<String> urlList = listBanner.url!.split('/');
|
|
try {
|
|
idCourse = urlList.last;
|
|
} on StateError {
|
|
idCourse = '0';
|
|
}
|
|
Navigator.of(context, rootNavigator: true).push(
|
|
CustomNavigator(
|
|
child: DetailCourseScreen(
|
|
idcourse: idCourse ?? '0',
|
|
),
|
|
),
|
|
);
|
|
} else {
|
|
Navigator.of(context, rootNavigator: true).push(
|
|
MaterialPageRoute(
|
|
builder: (context) => TermsAndCondition(
|
|
// url: 'https://vocasia.id/home/contact',
|
|
url: listBanner.url!,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
}
|
|
},
|
|
splashColor: Colors.white10,
|
|
child: Container(
|
|
margin: EdgeInsets.symmetric(
|
|
horizontal: getProportionateScreenWidth(16),
|
|
),
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.all(Radius.circular(10)),
|
|
child: AspectRatio(
|
|
aspectRatio: 2,
|
|
child: CachedNetworkImage(
|
|
fadeInDuration: Duration(microseconds: 1),
|
|
imageUrl: listBanner.img.toString(),
|
|
fit: BoxFit.contain,
|
|
placeholder: (context, url) => Shimmer(
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color: ninthColor,
|
|
borderRadius: BorderRadius.circular(5),
|
|
),
|
|
),
|
|
gradient: LinearGradient(
|
|
stops: [0.2, 0.5, 0.6],
|
|
colors: [ninthColor, fourthColor, ninthColor])),
|
|
errorWidget: (context, url, error) => Icon(Icons.error),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
return Container(
|
|
child: Consumer<BannersProvider>(builder: (context, state, _) {
|
|
if (state.state == ResultState.Loading) {
|
|
return Padding(
|
|
padding: const EdgeInsets.all(18.0),
|
|
child: Shimmer.fromColors(
|
|
baseColor: Colors.white,
|
|
highlightColor: Colors.grey,
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(10),
|
|
color: Colors.white),
|
|
height: 210,
|
|
width: 50,
|
|
)),
|
|
);
|
|
} else if (state.state == ResultState.HasData) {
|
|
return Container(
|
|
child: Column(
|
|
children: [
|
|
CarouselSlider(
|
|
items: state.result
|
|
.map((banner) => listBannerPicture(banner))
|
|
.toList(),
|
|
options: CarouselOptions(
|
|
height: getProportionateScreenHeight(200),
|
|
disableCenter: true,
|
|
autoPlay: true,
|
|
autoPlayInterval: Duration(seconds: 10),
|
|
enlargeCenterPage: true,
|
|
viewportFraction: 1,
|
|
aspectRatio: 2,
|
|
onPageChanged: (index, reason) {
|
|
setState(() {
|
|
_current = index;
|
|
});
|
|
}),
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: state.result.map((url) {
|
|
int index = state.result.indexOf(url);
|
|
return Container(
|
|
width: getProportionateScreenWidth(6.0),
|
|
height: getProportionateScreenWidth(6.0),
|
|
margin: EdgeInsets.symmetric(
|
|
horizontal: getProportionateScreenWidth(3.0),
|
|
vertical: getProportionateScreenWidth(16)),
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: _current == index ? thirdColor : fourthColor,
|
|
),
|
|
);
|
|
}).toList()),
|
|
],
|
|
),
|
|
);
|
|
} else if (state.state == ResultState.NoData) {
|
|
final defaultBanners = [
|
|
'assets/images/deffault_banner.png',
|
|
'assets/images/default_banner_2.png'
|
|
];
|
|
|
|
return Column(
|
|
children: [
|
|
CarouselSlider.builder(
|
|
itemCount: defaultBanners.length,
|
|
itemBuilder: (context, index, realIndex) {
|
|
return Image.asset(
|
|
defaultBanners[index],
|
|
width: double.infinity,
|
|
);
|
|
},
|
|
options: CarouselOptions(
|
|
height: getProportionateScreenHeight(200),
|
|
autoPlay: true,
|
|
autoPlayInterval: Duration(seconds: 10),
|
|
enlargeCenterPage: true,
|
|
viewportFraction: 1,
|
|
aspectRatio: 2,
|
|
onPageChanged: (index, reason) {
|
|
setState(() {
|
|
_current = index;
|
|
});
|
|
},
|
|
),
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: List.generate(defaultBanners.length, (index) {
|
|
return Container(
|
|
width: getProportionateScreenWidth(6.0),
|
|
height: getProportionateScreenWidth(6.0),
|
|
margin: EdgeInsets.symmetric(
|
|
horizontal: getProportionateScreenWidth(3.0),
|
|
vertical: getProportionateScreenWidth(16),
|
|
),
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: _current == index ? thirdColor : fourthColor,
|
|
),
|
|
);
|
|
}),
|
|
),
|
|
],
|
|
);
|
|
} else if (state.state == ResultState.Error) {
|
|
return Padding(
|
|
padding: EdgeInsets.only(
|
|
left: getProportionateScreenWidth(76),
|
|
top: getProportionateScreenHeight(45),
|
|
),
|
|
child: Container(
|
|
width: getProportionateScreenWidth(480),
|
|
height: getProportionateScreenHeight(100),
|
|
color: Colors.transparent,
|
|
child: Text('Internet lemah, mohon muat ulang'),
|
|
),
|
|
);
|
|
} else {
|
|
return Center(child: Text(''));
|
|
}
|
|
}),
|
|
);
|
|
}
|
|
}
|