Countdown Timer in flutter

byRakibul hasan -
0



import 'dart:async';
import 'package:flutter/material.dart';
import 'package:iistore/models/Discount.dart';
import 'package:iistore/services/BleezaService.dart';
import 'package:iistore/widgets/holableza/buildDiscountCarousel.dart';
import 'package:iistore/widgets/holableza/buildNewArrivals.dart';
import 'package:shimmer/shimmer.dart';
import '../../widgets/holableza/BestSellerList.dart';
import '../../widgets/home/sale_container.dart';

class HomeTab extends StatefulWidget {
const HomeTab({Key? key}) : super(key: key);

@override
State<HomeTab> createState() => _HomeTabState();
}

class _HomeTabState extends State<HomeTab> {
final BleezaService _bleezaService = BleezaService();
List<Discount> products = []; // List to hold fetched products
List<Discount> newArrivalProducts = [];

late Timer _timer;
int _days = 0;
int _hours = 0;
int _minutes = 0;
int _seconds = 0;
bool isLoading = true;

@override
void initState() {
super.initState();
fetchProducts();
fetchNewArrival();
_startTimer();
}

Future<void> fetchProducts() async {
try {
await Future.delayed(const Duration(seconds: 2));
List<Discount> fetchedProducts = await _bleezaService.getProducts();
setState(() {
products = fetchedProducts;
isLoading = false;
});
} catch (error) {
// Handle error
print('Error fetching products: $error');
}
}

// Fetch new arrival products
Future<void> fetchNewArrival() async {
try {
List<Discount> fetchedNewArrival = await _bleezaService
.getNewArrivalProducts(); // Replace with your method to fetch new arrival products
setState(() {
newArrivalProducts = fetchedNewArrival;
isLoading = false;
});
} catch (error) {
// Handle error
print('Error fetching new arrival products: $error');
}
}

@override
void dispose() {
_timer.cancel();
super.dispose();
}

void _startTimer() {
const oneSecond = Duration(seconds: 1);
_timer = Timer.periodic(oneSecond, (timer) {
if (_seconds > 0) {
setState(() {
_seconds--;
});
} else {
if (_minutes > 0) {
setState(() {
_minutes--;
_seconds = 59;
});
} else {
if (_hours > 0) {
setState(() {
_hours--;
_minutes = 59;
});
} else {
if (_days > 0) {
setState(() {
_days--;
_hours = 23;
_minutes = 59;
_seconds = 59;
});
} else {
_timer.cancel();
}
}
}
}
});
}

@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
buildSaleContainer(),
const SizedBox(height: 16.0),
const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Discount',
style: TextStyle(
fontSize: 20,
color: Colors.black,
fontWeight: FontWeight.w500,
),
),
],
),
const SizedBox(height: 16.0),
isLoading
? _buildShimmerLoader() // Show shimmer loader while fetching data
: buildDiscountCarousel(products),
const SizedBox(height: 16.0),
const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// Left side: Discount text
Text(
'New arrivals',
style: TextStyle(
fontSize: 20,
color: Colors.black,
fontWeight: FontWeight.w500,
),
),
],
),
const SizedBox(height: 16.0),
isLoading
? _buildShimmerLoader() // Show shimmer loader while fetching data
: buildNewArrivals(newArrivalProducts),
const SizedBox(height: 16.0),
BestSellerList(),
],
),
),
);
}

// Widget to build shimmer loader
Widget _buildShimmerLoader() {
return Column(
children: [
_buildShimmerContainer(),
const SizedBox(height: 16.0),
_buildShimmerContainer(),
],
);
}

Widget _buildShimmerContainer() {
return Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: Container(
height: 250, // Adjust height as needed
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
),
),
);
}
}

import 'dart:async';

import 'package:flutter/material.dart';

class CountdownTimer extends StatefulWidget {
final DateTime endTime;

const CountdownTimer({Key? key, required this.endTime}) : super(key: key);

@override
_CountdownTimerState createState() => _CountdownTimerState();
}

class _CountdownTimerState extends State<CountdownTimer> {
late Duration _timeRemaining;
late Timer _timer;

@override
void initState() {
super.initState();
_calculateTimeRemaining();
_startTimer();
}

@override
void dispose() {
_timer.cancel();
super.dispose();
}

void _calculateTimeRemaining() {
DateTime now = DateTime.now();
if (widget.endTime.isAfter(now)) {
_timeRemaining = widget.endTime.difference(now);
} else {
_timeRemaining = const Duration();
}
}

void _startTimer() {
const oneSecond = Duration(seconds: 1);
_timer = Timer.periodic(oneSecond, (timer) {
if (_timeRemaining.inSeconds > 0) {
setState(() {
_timeRemaining -= oneSecond;
});
} else {
_timer.cancel();
}
});
}

@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_buildTimeColumn(_timeRemaining.inDays.remainder(365).toString().padLeft(2, '0'), 'Days'),
_buildDivider(),
_buildTimeColumn((_timeRemaining.inHours % 24).toString().padLeft(2, '0'), 'Hours'),
_buildDivider(),
_buildTimeColumn((_timeRemaining.inMinutes % 60).toString().padLeft(2, '0'), 'Minutes'),
_buildDivider(),
_buildTimeColumn((_timeRemaining.inSeconds % 60).toString().padLeft(2, '0'), 'Seconds'),
],
),
);
}

Widget _buildTimeColumn(String time, String label) {
return Column(
children: [
Text(
time,
style: const TextStyle(
fontSize: 26.0,
color: Colors.white,
fontFamily: 'CustomFont',
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 4.0),
Text(
label,
style: const TextStyle(
fontSize: 16.0,
color: Colors.white,
fontFamily: 'CustomFont',
),
),
],
);
}

Widget _buildDivider() {
return Container(
width: 1, // Width of the vertical line
height: 42, // Height of the vertical line
color: const Color(0xFF3BA0FE), // Color of the vertical line
margin: const EdgeInsets.symmetric(horizontal: 8.0),
);
}
}






 import 'package:flutter/material.dart';

import 'package:iistore/common/app_colors.dart';
import 'package:iistore/common/styles.dart';

import 'CountdownTimer.dart';

Widget buildSaleContainer() {
return Container(
height: 136.0, // Adjust height as needed
decoration: BoxDecoration(
color: AppColors.containerColor,
borderRadius: BorderRadius.circular(8.0),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('50% off sale ends in',
style: AppTextStyles.saleHeaderStyle),
const SizedBox(height: 12.0),
CountdownTimer(
endTime: DateTime.now()
.add(const Duration(days: 5, hours: 12, minutes: 30)),
),
],
),
);
}

Tags:
Rakibul hasan

I am Rakibul hasan,Front and Back-End Developer.I am also good at database like mysql,Firebase,mssql. I'm a Workaholic Person and I love my job as a mobile application developer i never get tired for it. Its been always fasinating to me working for new creation. I am very passionate about my work.I do my job passionately and dedicatedly.I try to do my project with clean code and gather efficiency. The greatest quality of mine is patience.I can code all day long. I never feel bored during coding and i can't take rest until my code is completed.I can adapt anything very quickly. I am also very sincere,responsible,hard working and confident regarding my works.Each and Every Project is important to me and I like to take Challenge.

Post a Comment

Previous Post Next Post