custom_gif_loading 0.0.1 custom_gif_loading: ^0.0.1 copied to clipboard
A new Flutter Custom GIF Loading Package
A Flutter package to show custom gif loading with your gif file
Features #
Getting started #
-> Create a gif varible with initialize gif file in assets : Image gif = Image.asset('assets/GIF/Spinner.gif');
-> Start the loading in the overly display : Loading(gif).start(context);
-> Stop the loading : Loading.stop();
Usage #
import 'package:custom_gif_loading/custom_gif_loading.dart';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Custom GIF Loading Example',
showSemanticsDebugger: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
//Add your GIF file with gif variable
Image gif = Image.asset('assets/GIF/Spinner.gif');
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: Colors.blueAccent,
title: const Text(
'Custom GIF Loading Example',
style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
),
centerTitle: true,
),
body: Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
child: Center(
child: ElevatedButton(
onPressed: () {
//If click to button then loading is start.
Loading(gif).start(context);
Future.delayed(const Duration(seconds: 5), () {
//After 5 second loding is stop.
Loading.stop();
});
},
style: ElevatedButton.styleFrom(
primary: Colors.blueAccent,
padding: const EdgeInsets.symmetric(horizontal: 50, vertical: 20),
onPrimary: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
),
child: const Text(
'Start Loding',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
),
),
),
);
}
}