multi_image 1.0.0
multi_image: ^1.0.0 copied to clipboard
A Flutter package to display multiple images with gallery support and shimmer loading.
import 'package:flutter/material.dart';
import 'package:multi_image/multi_image.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
scaffoldBackgroundColor: Colors.white,
),
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: const Text('MultiImage Example'),
),
body: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: SafeArea(
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(height: 20),
Text(
'Image 1',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
MultiImage(
openGalleryBackground: Colors.blueAccent.shade700,
imageUrls: [
'https://camo.githubusercontent.com/a0668daf0094614bfeda6610c92a80a3e37bf884010a41ec096dfbf88d294618/68747470733a2f2f6d706661686d6f7a736c68616a7479756d6c75672e73757061626173652e636f2f73746f726167652f76312f6f626a6563742f7075626c69632f6769746875622f2f556e7469746c656425323064657369676e2532302833292e706e67'
],
context: context,
),
SizedBox(height: 20),
Text(
'Image 2',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
MultiImage(
imageUrls: [
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
],
context: context,
),
SizedBox(height: 20),
Text(
'Image 3',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
MultiImage(
imageUrls: [
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://camo.githubusercontent.com/a0668daf0094614bfeda6610c92a80a3e37bf884010a41ec096dfbf88d294618/68747470733a2f2f6d706661686d6f7a736c68616a7479756d6c75672e73757061626173652e636f2f73746f726167652f76312f6f626a6563742f7075626c69632f6769746875622f2f556e7469746c656425323064657369676e2532302833292e706e67',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
],
context: context,
),
SizedBox(height: 20),
Text(
'Image 4 or more',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
SizedBox(height: 20),
MultiImage(
fallbackColor: Colors.blue.shade900,
fallbackImage: Icon(
Icons.image_not_supported_outlined,
color: Colors.blue,
size: 48,
),
openGalleryBackButtonIcon: Icon(
Icons.arrow_back_ios_new_outlined,
color: Colors.white,
),
imageUrls: [
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://imgs.search.brave.com/elHgvfkPfbFAJSDQ0Xv83KeTDGuJQw9IPxH8_yrpMGs/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly93d3cu/bWlxdWlkby5jb20v/d3AtY29udGVudC91/cGxvYWRzLzIwMjUv/MDUvaGVhZGVyLTYt/dG9wLWZsdXR0ZXIt/YWx0ZXJuYXRpdmVz/LWZvci1tb2Rlcm4t/YXBwLWRldmVsb3Bt/ZW50LmpwZw',
'https://camo.githubusercontent.com/a0668daf0094614bfeda6610c92a80a3e37bf884010a41ec096dfbf88d294618/68747470733a2f2f6d706661686d6f7a736c68616a7479756d6c75672e73757061626173652e636f2f73746f726167652f76312f6f626a6563742f7075626c69632f6769746875622f2f556e7469746c656425323064657369676e2532302833292e706e67'
],
context: context,
),
SizedBox(height: 40),
],
),
),
),
),
),
);
}
}