import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; import 'package:shimmer/shimmer.dart'; import 'package:test_sa/extensions/context_extension.dart'; import 'package:test_sa/extensions/int_extensions.dart'; import 'package:test_sa/extensions/text_extensions.dart'; import 'package:test_sa/extensions/widget_extensions.dart'; import '../../../models/lookup.dart'; import '../../../new_views/app_style/app_color.dart'; import '../../../providers/service_request_providers/equipment_status_provider.dart'; class EquipmentStatusButtons extends StatefulWidget { final Function(Lookup) onSelect; const EquipmentStatusButtons({Key key, this.onSelect}) : super(key: key); @override State createState() => _EquipmentStatusButtonsState(); } class _EquipmentStatusButtonsState extends State { int _selectedEquipmentStatusIndex = 0; @override void initState() { super.initState(); WidgetsFlutterBinding.ensureInitialized().addPostFrameCallback((timeStamp) { Provider.of(context, listen: false).getDate(); }); } @override Widget build(BuildContext context) { return Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ context.translation.equipmentStatus.heading5(context).paddingOnly(start: 16, end: 16), 8.height, Consumer( builder: (context, snapshot, _) { return snapshot.loading ? Shimmer( gradient: const LinearGradient(colors: [AppColor.primary40, AppColor.primary50, AppColor.primary60]), child: Row( children: [ const _Skelton().expanded, 8.width, const _Skelton().expanded, 8.width, const _Skelton().expanded, ], ).paddingOnly(start: 16, end: 16), ) : SizedBox( height: 36.toScreenHeight, child: ListView.builder( itemCount: snapshot.items.length + 1, scrollDirection: Axis.horizontal, shrinkWrap: true, padding: EdgeInsetsDirectional.only(start: 16.toScreenWidth), itemBuilder: (context, index) => Container( margin: EdgeInsets.symmetric(horizontal: 4.toScreenWidth), padding: EdgeInsets.symmetric(vertical: 8.toScreenHeight, horizontal: (_selectedEquipmentStatusIndex == index ? 12 : 8).toScreenWidth), alignment: Alignment.center, decoration: BoxDecoration( borderRadius: BorderRadius.circular(7), color: _selectedEquipmentStatusIndex == index ? AppColor.neutral30 : Colors.white, border: _selectedEquipmentStatusIndex == index ? Border.all(width: 1, color: AppColor.primary50) : null, boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.03), blurRadius: 14)], ), child: (index == 0 ? "All Assets" : snapshot.items[index - 1].name).tinyFont(context).custom(color: AppColor.neutral50), ).onPress(() { setState(() { _selectedEquipmentStatusIndex = index; }); widget.onSelect(index == 0 ? null : snapshot.items[index - 1]); }), ), ); }, ), ], ); } } class _Skelton extends StatelessWidget { const _Skelton({ Key key, }) : super(key: key); @override Widget build(BuildContext context) { return Container( padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: AppColor.neutral50.withOpacity(0.05), borderRadius: BorderRadius.circular(7), ), ); } }