All Projects → skkallayath → Photofilters

skkallayath / Photofilters

Licence: mit
photofilters library for flutter

Programming Languages

4352 projects

Projects that are alternatives of or similar to Photofilters

An easy image editor integration for your Android apps.
Stars: ✭ 186 (-18.78%)
Mutual labels:  instagram, filters, photo
React Native Story
React native instagram story
Stars: ✭ 144 (-37.12%)
Mutual labels:  package, image, instagram
Flutter photo
Pick image/video from album by flutter. Support ios and android. UI by flutter, no native.
Stars: ✭ 285 (+24.45%)
Mutual labels:  plugin, image, photo
📷 A composable image editor using Core Image and Metal.
Stars: ✭ 2,495 (+989.52%)
Mutual labels:  image, photo, instagram
Flutter photo manager
Provide flutter with the ability to manage photos.
Stars: ✭ 294 (+28.38%)
Mutual labels:  plugin, image, photo
Gl React Instagramfilters
Instagram filters for gl-react and gl-react-native
Stars: ✭ 157 (-31.44%)
Mutual labels:  filters, instagram
jQueryRotate - plugin to rotate images by any angle cross-browse with animation support
Stars: ✭ 157 (-31.44%)
Mutual labels:  plugin, image
React Native Image Marker
Add text or icon watermark to your images
Stars: ✭ 170 (-25.76%)
Mutual labels:  image, photo
Stars: ✭ 181 (-20.96%)
Mutual labels:  image, photo
A simple and customizable Android full-screen image viewer with shared image transition support, "pinch to zoom" and "swipe to dismiss" gestures
Stars: ✭ 1,734 (+657.21%)
Mutual labels:  image, photo
图片/视频选择器 - 支持LivePhoto、GIF图片选择、3DTouch预览、在线下载iCloud上的资源、编辑图片/视频、浏览网络图片 功能 Imitation wx photo/image picker - support for LivePhoto, GIF image selection, 3DTouch preview, Download the resources on iCloud online, browse the web image function
Stars: ✭ 2,363 (+931.88%)
Mutual labels:  image, photo
🔲 Warp image transformation
Stars: ✭ 186 (-18.78%)
Mutual labels:  image, photo
Video and photo camera for iOS
Stars: ✭ 145 (-36.68%)
Mutual labels:  photo, instagram
Filterous 2
Instagram-like photo manipulation library for Node.js and Javascript on browser
Stars: ✭ 163 (-28.82%)
Mutual labels:  image, instagram
Adds seamless scrollView and instagram like zooming to UIImageViews in any view hierarchy.
Stars: ✭ 130 (-43.23%)
Mutual labels:  image, instagram
Flutter image editor
Flutter plugin, support android/ios.Support crop, flip, rotate, color martix, mix image, add text. merge multi images.
Stars: ✭ 181 (-20.96%)
Mutual labels:  plugin, image
📐 Configurable Custom Crop widget for Android
Stars: ✭ 2,185 (+854.15%)
Mutual labels:  image, photo
Video Thumbnail Generator
📷 Generate thumbnail sprites from videos.
Stars: ✭ 190 (-17.03%)
Mutual labels:  image, photo
Exiftool Vendored.js
Fast, cross-platform Node.js access to ExifTool
Stars: ✭ 200 (-12.66%)
Mutual labels:  image, photo
📁 JavaScript image uploader and editor, no backend required
Stars: ✭ 1,673 (+630.57%)
Mutual labels:  plugin, image

Photo Filters package for flutter

A flutter package for iOS and Android for applying filter to an image. A set of preset filters are also available. You can create your own filters too.


First, add photofilters and image as a dependency in your pubspec.yaml file.


No configuration required - the plugin should work out of the box.


No configuration required - the plugin should work out of the box.


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

import 'package:flutter/material.dart';
import 'package:path/path.dart';
import 'package:photofilters/photofilters.dart';
import 'package:image/image.dart' as imageLib;
import 'package:image_picker/image_picker.dart';

void main() => runApp(new MaterialApp(home: MyApp()));

class MyApp extends StatefulWidget {
  _MyAppState createState() => new _MyAppState();

class _MyAppState extends State<MyApp> {
  String fileName;
  List<Filter> filters = presetFiltersList;
  File imageFile;

  Future getImage(context) async {
    imageFile = await ImagePicker.pickImage(source:;
    fileName = basename(imageFile.path);
    var image = imageLib.decodeImage(imageFile.readAsBytesSync());
    image = imageLib.copyResize(image, width: 600);
     Map imagefile = await Navigator.push(
      new MaterialPageRoute(
        builder: (context) => new PhotoFilterSelector(
              title: Text("Photo Filter Example"),
              image: image,
              filters: presetFiltersList,
              filename: fileName,
              loader: Center(child: CircularProgressIndicator()),
              fit: BoxFit.contain,
    if (imagefile != null && imagefile.containsKey('image_filtered')) {
      setState(() {
        imageFile = imagefile['image_filtered'];

  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Photo Filter Example'),
      body: Center(
        child: new Container(
          child: imageFile == null
              ? Center(
                  child: new Text('No image selected.'),
              : Image.file(imageFile),
      floatingActionButton: new FloatingActionButton(
        onPressed: () => getImage(context),
        tooltip: 'Pick Image',
        child: new Icon(Icons.add_a_photo),

UI Screen Shots

Sample Images of Filters

No Filter No Filter AddictiveBlue AddictiveBlue AddictiveRed AddictiveRed Aden Aden
Amaro Amaro Ashby Ashby Brannan Brannan Brooklyn Brooklyn
Charmes Charmes Clarendon Clarendon Crema Crema Dogpatch Dogpatch
Earlybird Earlybird 1977 1977 Gingham Gingham Ginza Ginza
Hefe Hefe Helena Helena Hudson Hudson Inkwell Inkwell
Juno Juno Kelvin Kelvin Lark Lark Lo-Fi Lo-Fi
Ludwig Ludwig Maven Maven Mayfair Mayfair Moon Moon
Nashville Nashville Perpetua Perpetua Reyes Reyes Rise Rise
Sierra Sierra Skyline Skyline Slumber Slumber Stinson Stinson
Sutro Sutro Toaster Toaster Valencia Valencia Vesper Vesper
Walden Walden Willow Willow X-Pro II X-Pro II

Sample Images of Convolution Filters

Identity Identity Emboss Emboss Sharpen Sharpen Colored Edge Detection Colored Edge Detection
Blur Blur Edge Detection Medium Edge Detection Medium Edge Detection Hard Edge Detection Hard Guassian Blur Guassian Blur
Low Pass Low Pass High Pass High Pass Mean Mean


There are two types of filters. ImageFilter and ColorFilter.

Image Filter

Image filter applies its subfilters directly to the whole image one by one. It is computationally expensive since the complexity & time increases as the number of subfilters increases.

You can create your own custom image filter as like this:

    import 'package:photofilters/filters/image_filters.dart';

    var customImageFilter = new ImageFilter(name: "Custom Image Filter");

You can also inherit the ImageFilter class to create another image filter.

class MyImageFilter extends ImageFilter {
  MyImageFilter(): super(name: "My Custom Image Filter") {

Color Filter

Color filter applies its subfilters to each pixel one by one. It is computationally less expensive than the ImageFilter. It will loop through the image pixels only once irrespective of the number of subfilters.

You can create your own custom color filter as like this:

    import 'package:photofilters/filters/color_filters.dart';

    var customColorFilter = new ColorFilter(name: "Custom Color Filter");
        .addSubFilters([BrightnessSubFilter(0.5), HueRotationSubFilter(30)]);

You can inherit the ColorFilter class too

class MyColorFilter extends ColorFilter {
  MyColorFilter() : super(name: "My Custom Color Filter") {

Sub filters

There are two types of subfilters. One can be added to the ColorFilter and the other can be added to the ImageFilter. You can inherit ColorSubFilter class to implement the former and you can use the ImageSubFilter mixin to implement the latter. You can create a same subfilter that can be used for both Image and Color Filters. The BrightnessSubFilter is an example of this.

class BrightnessSubFilter extends ColorSubFilter with ImageSubFilter {
  final num brightness;

  ///Apply the [BrightnessSubFilter] to an Image.
  void apply(Uint8List pixels, int width, int height) =>
      image_filter_utils.brightness(pixels, brightness);

  ///Apply the [BrightnessSubFilter] to a color.
  RGBA applyFilter(RGBA color) =>
      color_filter_utils.brightness(color, brightness);

Getting Started

For help getting started with Flutter, view our online documentation.

For help on editing package code, view the documentation.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected]