imageview360

一个Flutter软件包,可提供360度图像视图,并具有旋转和手势自定义功能。

支持的Dart版本

Dart SDK版本 >= 2.12.0

演示GIF

imageview360 Demo

安装

Pub

添加包

dependencies:
  imageview360: ^1.2.0

如何使用

在您的 dart 文件中导入该包

import 'package:imageview360/imageview360.dart';
基本用法

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

注意:要使ImageView360在热重载时立即显示更改,您需要提供UniqueKey(),以便小部件每次都重建。

自定义用法

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");
                        },
)

注意:为了获得更好的体验,请始终在提供图像给小部件之前预先加载图像,如下所示。

从资产加载和预加载图像的示例

 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);
    }

必填字段

属性 类型 用法
imageList 列表 要显示的图像列表

可自定义字段

属性 类型 默认值
autoRotate 布尔值
rotationCount 整数 1
rotationDirection RotationDirection RotationDirection.clockwise
frameChangeDuration 持续时间 Duration(milliseconds: 80)
swipeSensitivity 整数 1(注意:允许范围为1-5,小于1将视为1,大于5将视为5)
allowSwipeToRotate 布尔值
onImageIndexChanged Function(int) (currentImageIndex){}

博文

为了更好地理解此软件包的工作原理,请查看我的博文: Flutter中的360度图像展示

创建和维护者

Harpreet Singh

Damanpreet Singh

许可证

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

https://apache.ac.cn/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.

GitHub

查看 Github