imageview360 1.2.0

Flutter Android iOS web

A Flutter package which provides 360 view of the images with rotation and gesture customisations.

imageview360 #

A Flutter package which provides 360 view of the images with rotation and gesture customisations.

Supported Dart Versions #

Dart SDK version >= 2.1.0

Demo Gif #

imageview360 Demo

Installation #

Pub

Add the Package

dependencies:
  imageview360: ^1.2.0

How to use #

Import the package in your dart file

import 'package:imageview360/imageview360.dart';

Basic usage :
ImageView360(
     key: UniqueKey(),
     imageList: imageList,
),

Note: For ImageView360 to show instant changes on hot reload, you need to provide UniqueKey() so that the widget rebuilds every time.

Customisable usage :
ImageView360(
    key: UniqueKey(),                                           
    imageList: imageList,                                       
    autoRotate: true,                                           //Optional
    rotationCount: 2,                                           //Optional
    rotationDirection: RotationDirection.anticlockwise,         //Optional
    frameChangeDuration: Duration(milliseconds: 50),            //Optional
    swipeSensitivity: 2,                                        //Optional
    allowSwipeToRotate: true,                                   //Optional
    onImageIndexChanged: (currentImageIndex) {                  //Optional
                          print("currentImageIndex: $currentImageIndex");
                        },
)

Note: For better experience always precache image before providing the images to the widget as follows.

Example for loading and precaching images from assets :
 List<ImageProvider> imageList = List<ImageProvider>();
   for (int i = 1; i <= 52; i++) {
      imageList.add(AssetImage('assets/sample/$i.png'));
// To precache images so that when required they are loaded faster.
      await precacheImage(AssetImage('assets/sample/$i.png'), context);
    }

Mandatory fields #

AttributeTypeUsage
imageListListThe list of images to be displayed

Customisable fields #

AttributeTypeDefault Value
autoRotateboolfalse
rotationCountint1
rotationDirectionRotationDirectionRotationDirection.clockwise
frameChangeDurationDurationDuration(milliseconds: 80)
swipeSensitivityint1 (Note : Range allowed is 1-5 , less than 1 would be considered 1 and more than 5 would be considered 5)
allowSwipeToRotatebooltrue
onImageIndexChangedFunction(int)(currentImageIndex){}

Blog Post #

To have a better understanding how this package works under the hood, checkout my blog post: 360 degree image showcase in Flutter

Created & Maintained By #

Harpreet Singh

Damanpreet Singh

License #

Copyright 2020 Harpreet Singh & Damanpreet Singh

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
53
likes
100
pub points
72%
popularity

A Flutter package which provides 360 view of the images with rotation and gesture customisations.

Repository (GitHub)
View/report issues

Documentation

API reference

Uploader

harpreetseera8525@gmail.com

License

Apache 2.0 (LICENSE)

Dependencies

flutter

More

Packages that depend on imageview360