In this flutter example tutorial we are going to learn load gif images in flutter application.Gif images are used to display animated graphics with multiple objects. Normally animate images will display in web browsers. in this we will show you load gif images in flutter application. Load Gif Image from Online URL To load images from network we will use Image.network() widget, with the same widget we will load the gif images also Load Gif Image from Assets folder Add your gif image in assets folder and declare images in pubspec.yaml file assets: Now load image from assets folder by using Image.asset() widget This will gives the output like below Complete example code for load gif images in flutter application
We are loading the GIF images
Image.network(
'https://www.funimada.com/assets/images/cards/big/christmas-38.gif',
width: 200,
height: 200,
fit: BoxFit.contain,
)
- logo.png
- cristmas.gif
Image.asset("assets/cristmas.gif",width: 200,
height: 200,)
import 'package:flutter/material.dart';
void main() async{
runApp(LoadGifImages());
}
class LoadGifImages extends StatelessWidget{
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text("Flutter Load Gif Images"),),
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text("Load From URL",style: TextStyle(fontSize: 20,fontWeight: FontWeight.bold),),
SizedBox(height: 10,),
Image.network(
'https://www.funimada.com/assets/images/cards/big/christmas-38.gif',
width: 200,
height: 200,
fit: BoxFit.contain,
),
SizedBox(height: 30,),
Text("Load From URL",style: TextStyle(fontSize: 20,fontWeight: FontWeight.bold),),
SizedBox(height: 10,),
Image.asset("assets/cristmas.gif",width: 200,
height: 200,)
],
),
),
),
);
}
}
Article Contributed By :
|
|
|
|
5799 Views |