simple_image_crop 0.1.3

  • Readme
  • Changelog
  • Example
  • Installing
  • 95

Image Zoom and Cropping plugin for Flutter #

A simple and easy used flutter plugin to crop image on iOS and Android.

Image Cropping circle area Image Cropping rect area Image Cropping rect gif Image Cropping area gif

Installation #

Add simple_image_crop simple_image_crop as a dependency in pubspec.yaml.

Using #

Create a widget to load and edit an image: #

image can be of any type:

  ImgCrop(...),  //  ImageProvider
  ImgCrop.file(...) // Image file
  ImgCrop.asset(...) // Image assets your local
final imgCropKey = GlobalKey<ImgCropState>();

Widget _buildCropImage() {
  return Container(
      color: Colors.black,
      child: ImgCrop(
        key: cropKey,
        chipRadius: 150,  // crop area radius
        chipShape: 'circle', // crop type "circle" or "rect"
        image: Image.file(imageFile), // you selected image file
      ),
  );
}

Generate a cropped image: #

a async function get cropped file image:

  • croppedImage is you cropped image File
  • pictureQuality Can control image size and quality
  final croppedFile = await crop.cropCompleted(
    croppedImage,
    {pictureQuality: 900}
  )
floatingActionButton: FloatingActionButton(
  onPressed: () async {
    final crop = cropKey.currentState;
    final croppedFile =
        await crop.cropCompleted(args['image'], pictureQuality: 900);

    // show you croppedFile ……
    showImage(context, croppedFile);
  },

it's so esay !

0.0.1 #

init package

0.0.2 #

update email

0.1.0 #

fixed unused code

0.1.1 #

update README

0.1.2 #

update api findAncestorStateOfType

0.1.3 #

update README

example/lib/main.dart

import 'dart:io';
import 'dart:async';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:simple_image_crop/simple_image_crop.dart';

enum _sheetType { gallery, camera }

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      initialRoute: "/",
      routes: {
        "crop_page": (context) => SimpleCropRoute(),
        "/": (context) => MyHomeRoute()
      },
    );
  }
}

class MyHomeRoute extends StatefulWidget {
  @override
  _MyHomeRouteState createState() => new _MyHomeRouteState();
}

class _MyHomeRouteState extends State<MyHomeRoute> {
  final cropKey = GlobalKey<ImgCropState>();

  Future getImage(type) async {
    var image = await ImagePicker.pickImage(
        source: type == _sheetType.gallery
            ? ImageSource.gallery
            : ImageSource.camera);
    if (image == null) return;
    Navigator.of(context).pop();
    Navigator.of(context).pushNamed('crop_page', arguments: {'image': image});
  }

  void _showActionSheet() {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return SafeArea(
            child: Column(
              mainAxisSize: MainAxisSize.min, // 设置最小的弹出
              children: <Widget>[
                new ListTile(
                  leading: new Icon(Icons.photo_camera),
                  title: new Text("相机拍照"),
                  onTap: () async {
                    getImage(_sheetType.camera);
                  },
                ),
                new ListTile(
                  leading: new Icon(Icons.photo_library),
                  title: new Text("相册选择"),
                  onTap: () async {
                    getImage(_sheetType.gallery);
                  },
                ),
              ],
            ),
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('select image'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _showActionSheet,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

class SimpleCropRoute extends StatefulWidget {
  @override
  _SimpleCropRouteState createState() => _SimpleCropRouteState();
}

class _SimpleCropRouteState extends State<SimpleCropRoute> {
  final cropKey = GlobalKey<ImgCropState>();

  Future<Null> showImage(BuildContext context, File file) async {
    new FileImage(file)
        .resolve(new ImageConfiguration())
        .addListener(ImageStreamListener((ImageInfo info, bool _) {
      print('-------------------------------------------$info');
    }));
    return showDialog<Null>(
        context: context,
        builder: (BuildContext context) {
          return AlertDialog(
              title: Text(
                'Current screenshot:',
                style: TextStyle(
                    fontFamily: 'Roboto',
                    fontWeight: FontWeight.w300,
                    color: Theme.of(context).primaryColor,
                    letterSpacing: 1.1),
              ),
              content: Image.file(file));
        });
  }

  @override
  Widget build(BuildContext context) {
    final Map args = ModalRoute.of(context).settings.arguments;
    return Scaffold(
        appBar: AppBar(
          elevation: 0,
          title: Text(
            'Zoom and Crop',
            style: TextStyle(color: Colors.black),
          ),
          backgroundColor: Colors.white,
          leading: new IconButton(
            icon:
                new Icon(Icons.navigate_before, color: Colors.black, size: 40),
            onPressed: () => Navigator.of(context).pop(),
          ),
        ),
        body: Center(
          child: ImgCrop(
            key: cropKey,
            // chipRadius: 100,
            // chipShape: 'rect',
            maximumScale: 3,
            image: FileImage(args['image']),
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () async {
            final crop = cropKey.currentState;
            final croppedFile =
                await crop.cropCompleted(args['image'], pictureQuality: 600);
            showImage(context, croppedFile);
          },
          tooltip: 'Increment',
          child: Text('Crop'),
        ));
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  simple_image_crop: ^0.1.3

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:simple_image_crop/simple_image_crop.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
90
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
95
Learn more about scoring.

We analyzed this package on Jul 14, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.8.4
  • pana: 0.13.15
  • Flutter: 1.17.5

Analysis suggestions

Package does not support Flutter platform Linux

Because:

  • package:simple_image_crop/simple_image_crop.dart that declares support for platforms: Android, iOS

Package does not support Flutter platform Web

Because:

  • package:simple_image_crop/simple_image_crop.dart that declares support for platforms: Android, iOS

Package does not support Flutter platform Windows

Because:

  • package:simple_image_crop/simple_image_crop.dart that declares support for platforms: Android, iOS

Package does not support Flutter platform macOS

Because:

  • package:simple_image_crop/simple_image_crop.dart that declares support for platforms: Android, iOS

Package not compatible with SDK dart

Because:

  • simple_image_crop that is a package requiring null.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.68.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.12 1.14.13
meta 1.1.8 1.2.2
sky_engine 0.0.99
typed_data 1.1.6 1.2.0
vector_math 2.0.8 2.1.0-nullsafety
Dev dependencies
flutter_test