import 'package:carousel_slider/carousel_slider.dart'; import 'package:diplomaticquarterapp/core/model/packages_offers/requests/OffersCategoriesRequestModel.dart'; import 'package:diplomaticquarterapp/core/model/packages_offers/requests/OffersProductsRequestModel.dart'; import 'package:diplomaticquarterapp/core/service/packages_offers/PackagesOffersServices.dart'; import 'package:diplomaticquarterapp/core/viewModels/packages_offers/PackagesOffersViewModel.dart'; import 'package:diplomaticquarterapp/locator.dart'; import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/widgets/data_display/text.dart'; import 'package:diplomaticquarterapp/widgets/loadings/ShimmerLoading.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; class OffersAndPackagesWidget extends StatefulWidget { final List models; OffersAndPackagesWidget(this.models); @override _OffersAndPackagesWidgetState createState() => _OffersAndPackagesWidgetState(); } // - - - - - - - - - - - - - - // Carousel Widget // - - - - - - - - - - - - - - class _OffersAndPackagesWidgetState extends State { final double HEIGHT = 140; //200; final int AUTO_SLIDE_INTERVAL = 3; final int ANIMATION_DURATION = 1000; var service = locator(); @override Widget build(BuildContext context) { // TODO: implement build var option = CarouselOptions( height: HEIGHT, aspectRatio: 16 / 9, viewportFraction: 1, initialPage: 0, enableInfiniteScroll: true, reverse: false, autoPlay: true, autoPlayInterval: Duration(seconds: AUTO_SLIDE_INTERVAL), autoPlayAnimationDuration: Duration(milliseconds: ANIMATION_DURATION), autoPlayCurve: Curves.fastOutSlowIn, enlargeCenterPage: true, scrollDirection: Axis.horizontal, ); // return Container( // height: HEIGHT, // child: CarouselSlider.builder( // itemCount: widget.models.length, // itemBuilder: (BuildContext context, int itemIndex) { // var item = widget.models[itemIndex]; // return OfferPackagesItemWidget(model: item); // }, // options: option)); var header = Padding( padding: const EdgeInsets.only(right: 15, left: 15), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Texts( TranslationBase.of(context).offerAndPackages, color: Colors.red, fontSize: 15, bold: true, ), Texts( TranslationBase.of(context).viewAll, color: Colors.red, fontSize: 12, ) ], ), ); var headerSpaceVisible = true; var headerSpace = Visibility( child: header, visible: headerSpaceVisible, ); return Column( children: [ headerSpace, ShimmerLoadingWidget( onPreProccess: () { return service.getAllCategories(OffersCategoriesRequestModel(limit: 100, page: 1, sinceId: 0)); }, loadingWidget: () { return Texts( "Loading...", fontSize: 20, color: Colors.green, marginBottom: 10, marginTop: 10, ); }, realWidget: () { if (widget.models.isNotEmpty) { return Container( child: CarouselSlider.builder( itemCount: widget.models.length, itemBuilder: (BuildContext context, int itemIndex) { var item = widget.models[itemIndex]; return OfferPackagesItemWidget(model: item); }, options: option), ); } else { return Container(); } }, onFinish: () {}, ) // ], ); } } // - - - - - - - - - - - - - - // Carousel Item Widget // - - - - - - - - - - - - - - class OfferPackagesItemWidget extends StatefulWidget { final OfferPackagesItemModel model; OfferPackagesItemWidget({@required this.model}); @override State createState() { return _OfferPackagesItemWidgetState(); } } class _OfferPackagesItemWidgetState extends State { @override Widget build(BuildContext context) { var model = widget.model; return Card( clipBehavior: Clip.hardEdge, elevation: 5, shadowColor: Colors.grey, margin: EdgeInsets.only(left: 15, right: 15, bottom: 15), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10), side: BorderSide(color: Colors.white, width: 1)), child: Container( padding: EdgeInsets.only(left: 10, right: 20, top: 5, bottom: 5), width: MediaQuery.of(context).size.width, child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Texts( widget.model.title, color: Colors.red, fontSize: 20, ), Texts( widget.model.desc, color: Colors.red, fontSize: 12, ), Container( alignment: Alignment.bottomLeft, child: MaterialButton( height: 30, color: Color(0xFFD81A2E), onPressed: () => widget.model.action.onClick(model.item), child: Texts( TranslationBase.of(context).view, color: Colors.white, fontSize: 12, ), ), ), ], ), ) // Container( // child: Stack( // children: [ // Container( // width: MediaQuery.of(context).size.width, // child: Image.network( // model.bannerUrl, // fit: BoxFit.cover, // ), // ), // Align( // alignment: Alignment.bottomRight, // child: Container( // height: 25, // margin: EdgeInsets.all(5), // child: Row( // mainAxisAlignment: MainAxisAlignment.end, // children: [ // MaterialButton( // color: HexColor('#D81A2E'), // onPressed: () => model.action.onClick(model.item), // child: Texts( // TranslationBase.of(context).view, // color: Colors.white, // fontSize: 12, // marginLeft: 2, // marginRight: 2, // ), // ), // VerticalDivider( // color: Colors.white, // thickness: 1, // ), // MaterialButton( // color: HexColor('#D81A2E'), // onPressed: () => model.action.onClick(model.item), // child: Texts( // TranslationBase.of(context).viewAll, // color: Colors.white, // fontSize: 12, // marginLeft: 2, // marginRight: 2, // ), // ) // ], // )), // ), // ], // ), // ), ); } } // - - - - - - - - - - - - - - // Carousel Item Models // - - - - - - - - - - - - - - class OfferPackagesItemModel { String bannerUrl; String title; String desc; T item; OfferPackagesItemActionModel action; OfferPackagesItemModel(this.bannerUrl, this.title, this.desc, this.item, this.action); static List dummy() { List list = List(); list.add(OfferPackagesItemModel( "http://blog.naseej.com/hs-fs/hubfs/ellucian-banner-9.jpg?width=1486&height=782&name=ellucian-banner-9.jpg", "Sample Title", "Sample Desc here ....", "Sample Item", OfferPackagesItemActionModel("Click here", (item) { var vm_categories = locator(); vm_categories.service.getAllCategories(OffersCategoriesRequestModel(limit: 100, page: 1, sinceId: 0)).then((value) { print(value.toString()); print(value.toString()); }); var vm_products = locator(); vm_products.service.getAllProducts(request: OffersProductsRequestModel(categoryId: 125, limit: 100)).then((value) { print(value.toString()); print(value.toString()); }); }))); return list; } } class OfferPackagesItemActionModel { String actionTitle; Function(dynamic) onClick; OfferPackagesItemActionModel(this.actionTitle, this.onClick); }