Skip to content

Media widgets for Flutter that make it easy for you to upload images to your backend.

License

Notifications You must be signed in to change notification settings

nylo-core/media-pro

Repository files navigation

Media Pro

Latest Release Version Latest Stable Version GitHub stars

Media Pro is a package that provides a set of widgets to help you work with media in your Flutter apps.

Widgets

  • SingleMediaPicker
  • GridImagePicker

SingleImagePicker is a widget that allows the user to upload a single image from their gallery.

You can use SingleImagePicker.compact or SingleImagePicker.simple to display the widget.

import 'package:media_pro/media_pro.dart';

SingleImagePicker.compact(
    defaultImage: "https://via.placeholder.com/150",
    apiUploadImage: ApiRequest(url: "https://myserver.test/upload-image"), // The url to send the image too
    setImageUrlFromResponse: (response) { 
    // `setImageUrlFromResponse` this function will set Widget's image from the response. 
    // After the user has selected an image, the [response] will be the response from the server. 
    // Return the image url from the response.
        if (response['media'] == null) return null;
            dynamic media = response['media'];
            return media['original_url'];
        },
),

GridImagePicker is a widget that allows the user to upload multiple images from their gallery.

import 'package:media_pro/media_pro.dart';

GridImagePicker(
  maxImages: 8,
  defaultImages: () async {
    List<Map<String, dynamic>> data = [
      {
        "id": 1,
        "original_url": "https://via.placeholder.com/150",
      },
      {
        "id": 2,
        "original_url": "https://via.placeholder.com/150",
      },
    ]; 
    return data;
  },
  setImageUrlFromItem: (item) {
    if (item['original_url'] == null) return null;
    return item['original_url'];
  },
  apiUploadImage: ApiRequest(
    url: "https://mysite.com/uploads/animals",
    method: "post",
  ),
  imageQuality: 80,
  allowedMimeTypes: ["image/jpeg", "image/png"],
  maxSize: 1024 * 1024 * 7, // 7mb
  setMainImageFromItem: (item) {
    return false;
  },
  apiDeleteImage: (item) {
    return ApiRequest(
      url: "https://mysite.com/uploads/delete/${item['id']}",
      method: "delete",
    );
  },
  apiMainImage: (item) => ApiRequest(
    url: "https://mysite.com/main",
    method: "post",
  ),
),

Getting started

Installation

Add the following to your pubspec.yaml file:

dependencies:
  media_pro: ^2.0.0

or with Dart:

dart pub add media_pro

Requirements

IOS - info.plist

...
<key>NSPhotoLibraryUsageDescription</key>
<string>To upload images to your ...</string>
<key>NSCameraUsageDescription</key>
<string>This app requires access to the camera.</string>

Usage

import 'package:media_pro/media_pro.dart';

Coming soon

  • Video Pickers
  • Audio Pickers
  • File Pickers
  • Better documentation

Try the example app to see how it works.

Changelog

Please see CHANGELOG for more information what has changed recently.

Social

Licence

The MIT License (MIT). Please view the License File for more information.