image_collage_widget 1.0.0

  • Readme
  • Changelog
  • Example
  • Installing
  • 68

Image Collage Widget #

A flutter package for creating photo collages in your applications.

Preview #

image image image

Key Features #

  • Create 11 different type of collages.
  • Start with or without images from gallery preloaded (Only for Android).
  • Allow user to add or remove photo into collage.
  • User can update images from gallery/camera.
  • Don't worry about permissions, we handled it.

Usage #

  • Step 2:- Prepare AndroidManifest.xml

         <uses-permission android:name="android.permission.CAMERA" />
         <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
         <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
  • Step 3:- Prepare Info.plist

         <string>Need to access photo library</string>
         <string>To upload your picture</string>
  • Step 4:- Add ImageCollageWidget in your dart file

          import 'package:image_collage_widget/image_collage_widget.dart';
          import 'package:image_collage_widget/utils/collage_type.dart';
       /// @param withImage:- If withImage = true, It will load image from given {filePath (default = "Camera")}
       /// @param collageType:- CollageType.CenterBig
               child: ImageCollageWidget(
                 collageType: widget.collageType,
                 withImage: true,
                 filePath: _directory?.path?.toString(),

Dependencies #

  • flutter_staggered_grid_view: ^0.2.7
  • flutter_bloc: ^0.9.0
  • flutter_file_manager: ^0.0.6
  • permission_handler: ^3.0.0
  • image_picker: ^0.5.0+9
  • equatable: ^0.2.3


Image Collage Widget is MIT-licensed.

Let us know! #

We’d be really happy if you send us links to your projects where you use our component. Just send an email to And do let us know if you have any questions or suggestion regarding our work.

[1.0.0] - 02 October 2019

  • Update the dependencies
  • Update the description

[0.0.2] - 10 April 2019

  • Added 11 different type of collages.
  • Allow user to add or remove photo into collage.
  • User can update images from gallery/camera.

[0.0.1] - 27 March 2019

  • Initial release.


import 'package:flutter/material.dart';
import 'package:image_collage_widget/utils/CollageType.dart';
import 'src/screens/collage_sample.dart';
import 'src/tranistions/fade_route_transition.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
      home: MyHomePage(),

class MyHomePage extends StatefulWidget {
  _MyHomePageState createState() => _MyHomePageState();

class _MyHomePageState extends State<MyHomePage> {
  var color = Colors.white;

  void initState() {

  Widget build(BuildContext context) {

    Widget buildRaisedButton(CollageType collageType, String text) {
     return RaisedButton(
        onPressed: () => pushImageWidget(collageType),
        shape: buttonShape(),
        color: color,
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Text(text),
    return Scaffold(
      appBar: AppBar(
        title: Text("Test"),
      body: Center(
        child: ListView(
          padding: EdgeInsets.all(16.0),
          shrinkWrap: true,
          children: <Widget>[
            buildRaisedButton(CollageType.VSplit, 'Vsplit'),
            buildRaisedButton(CollageType.HSplit, 'HSplit'),
            buildRaisedButton(CollageType.FourSquare, 'FourSquare'),
            buildRaisedButton(CollageType.NineSquare, 'NineSquare'),
            buildRaisedButton(CollageType.ThreeVertical, 'ThreeVertical'),
            buildRaisedButton(CollageType.ThreeHorizontal, 'ThreeHorizontal'),
            buildRaisedButton(CollageType.LeftBig, 'LeftBig'),
            buildRaisedButton(CollageType.RightBig, 'RightBig'),
            buildRaisedButton(CollageType.FourLeftBig, 'FourLeftBig'),
            buildRaisedButton(CollageType.VMiddleTwo, 'VMiddleTwo'),
            buildRaisedButton(CollageType.CenterBig, 'CenterBig'),

  pushImageWidget(CollageType type) async {
    await Navigator.of(context).push(
      FadeRouteTransition(page: CollageSample(type)),

  RoundedRectangleBorder buttonShape() {
    return RoundedRectangleBorder(
        borderRadius: new BorderRadius.circular(10.0));

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  image_collage_widget: ^1.0.0

2. Install it

You can install packages from the command line:

with Flutter:

$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:image_collage_widget/image_collage_widget.dart';
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Nov 19, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.0
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.6


Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Health suggestions

Fix lib/blocs/collage_event.dart. (-1.99 points)

Analysis of lib/blocs/collage_event.dart reported 4 hints:

line 9 col 7: This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: CheckPermissionEvent.index

line 23 col 7: This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: AskPermissionEvent.index

line 38 col 7: This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: AllowPermissionEvent.index

line 52 col 7: This class (or a class which this class inherits from) is marked as '@immutable', but one or more of its instance fields are not final: DenyPermissionEvent.index

Fix lib/blocs/collage_bloc.dart. (-1 points)

Analysis of lib/blocs/collage_bloc.dart reported 2 hints:

line 149 col 34: Avoid using braces in interpolation when not needed.

line 150 col 39: Avoid using braces in interpolation when not needed.

Fix lib/utils/KeyUtils.dart. (-1 points)

Analysis of lib/utils/KeyUtils.dart reported 2 hints:

line 3 col 14: Name non-constant identifiers using lowerCamelCase.

line 4 col 14: Name non-constant identifiers using lowerCamelCase.

Fix additional 6 files with analysis or formatting issues. (-1 points)

Additional issues in the following files:

  • lib/widgets/row_widget.dart (2 hints)
  • lib/blocs/bloc.dart (Run flutter format to format lib/blocs/bloc.dart.)
  • lib/blocs/collage_state.dart (Run flutter format to format lib/blocs/collage_state.dart.)
  • lib/image_collage_widget.dart (Run flutter format to format lib/image_collage_widget.dart.)
  • lib/utils/CollageType.dart (Run flutter format to format lib/utils/CollageType.dart.)
  • lib/utils/permission_type.dart (Run flutter format to format lib/utils/permission_type.dart.)

Maintenance issues and suggestions

Support latest dependencies. (-30 points)

The version constraint in pubspec.yaml does not support the latest published versions for 3 dependencies (equatable, flutter_bloc, permission_handler).


Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
equatable ^0.6.1 0.6.1 1.0.0
flutter 0.0.0
flutter_bloc ^0.21.0 0.21.0 2.0.1
flutter_file_manager ^0.2.0 0.2.0
flutter_staggered_grid_view ^0.3.0 0.3.0
image_picker ^0.6.1+4 0.6.1+11
permission_handler ^3.2.2 3.3.0 4.0.0
Transitive dependencies
bloc 0.15.0 2.0.0
collection 1.14.11 1.14.12
meta 1.1.7 1.1.8
path 1.6.4
path_provider 1.4.2
platform 2.2.1
provider 3.1.0+1
rxdart 0.22.6
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies