flutter实现可缩放可拖拽双击放大的图片功能

可缩放可拖拽的功能,可实现图片或者其他widget的缩放已经拖拽
并支持双击放大的功能

我们知道官方提供了双击缩放,但是不支持拖拽的功能,我们要实现向百度地图那样可以缩放又可以拖拽的功能,官方的方法就不支持了。
下面先演示下功能:

参数只有两个:
1、child ,是一个widget,可以是图片或者任意的widget
2、doubleTapStillScale,默认是true,意思是双击一直放大,还是只放大一次,再次双击缩小到原图片的大小,如果为false,第一次双击放大图片2倍,再次双击回位。

1、导入依赖库

dependencies:
flutter:
sdk: flutter
flutter_drag_scale:
git: https://github.com/LiuC520/flutter_drag_scale.git

2、引入库:

import 'package:flutter_drag_scale/flutter_drag_scale.dart';

3、如下的用法:

import 'package:flutter/material.dart';
import 'package:flutter_drag_scale/flutter_drag_scale.dart'; class OpenImg extends StatefulWidget{
final String url;
// final Function onTap;
const OpenImg({Key key, this.url}):super(key: key);
@override
_OpenImgState createState() => _OpenImgState();
} class _OpenImgState extends State<OpenImg>{
Widget build(BuildContext context){
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.black,
),
body: DragScaleContainer(
doubleTapStillScale: true,
child: Container(
color: Colors.black,
height: MediaQuery.of(context).size.height,
child: Image.network(this.widget.url, fit: BoxFit.contain),
),
) );
}
}

操作完毕.自己动动试试吧,很简单的!!

flutter实现可缩放可拖拽双击放大的图片功能的更多相关文章

  1. C# 图片缩放,拖拽后保存成图片的功能

    窗体界面部分如下: 鼠标的缩放功能需要手动在 OpertaionImg.Designer.cs 文件里面添加一句代码,具体代码如下: //picturePhoto显示图片的控件 this.pictur ...

  2. C#实现GDI+基本图的缩放、拖拽、移动

    C#实现GDI+基本图的缩放.拖拽.移动示例代码如下: using System;using System.Collections.Generic;using System.ComponentMode ...

  3. 缩放系列(三):一个可以手势缩放、拖拽、旋转的layout

    弄了一个下午,终于搞出来了,PowerfulLayout 下面是一个功能强大的改造的例子: 可以实现以下需求: 1.两个手指进行缩放布局 2.所有子控件也随着缩放, 3.子控件该有的功能不能丢失(像b ...

  4. Android 自定义ImageView支持缩放,拖拽,方便复用

    今天刚发了一篇关于ImageView的缩放和拖拽的博客,然后我想了下,将他自定义下,方便我们来复用这个imageView,效果我就不多说了,http://blog.csdn.net/xiaanming ...

  5. C# 之文件拖拽和pixturBox缩放与拖拽

    文件拖拽: 效果:将一个文件拖拽到窗体的某个控件时,将该控件的路径显示在该控件上,只要拿到了路径自然可以读取文件中的内容了. 将一个控件的属性AllowDrop设置为true,然后添加DragDrop ...

  6. AJ学IOS(36)UI之手势事件旋转_缩放_拖拽

    AJ分享,必须精品 效果 完成一个图片的捏合缩放,拖拽,旋转动作. 设计思路 拖拽: 首先是最简单的拖拽 //拖拽 -(void)panTest { UIPanGestureRecognizer *p ...

  7. C#pictureBox滚轮缩放与拖拽

    [转载]C#pictureBox滚轮缩放与拖拽 [转载]C#中图像平移.缩放的实现技巧 [转载]c# 通过鼠标拖动.放大图片,GDI绘图通过鼠标拖动.放大

  8. vue富文本编辑器vue-quill-editor使用总结(包含图片上传,拖拽,放大和缩小)

    vue-quill-editor是vue很好的富文本编辑器,富文本的功能基本上都支持,样式是黑白色,简洁大方. 第一步下载 vue-quill-editor: npm i vue-quill-edit ...

  9. 移动端的拖拽这个demo实现的功能

    SQL数据库适合那些需求确定和对数据完整性要去严格的项目.NoSQL数据库适用于那些对速度和可扩展性比较看重的那些不相关的,不确定和不断发展的需求. 总所周知,网页的加载速度跟图片是有很大的关系的,因 ...

随机推荐

  1. unity探索者之UGUI圆形图片组件

    版权声明:本文为原创文章,转载请声明https://www.cnblogs.com/unityExplorer/p/13524824.html 使用UGUI进行游戏开发的过程中经常会遇到一个问题:玩家 ...

  2. C++ IO的一些注意点

    读入这个坑一直以来都深受其麻烦,把遇到一些注意点记一下吧. 1.getchar读入 以前练线段树的时候做到Acwing#246 Interval GCD(原题在CodeHunter上,人懒就在Acwi ...

  3. 基于python tkinter的点名小程序

    import datetimeimport jsonimport osimport randomimport tkinter as tkimport openpyxl # 花名册文件名excel_fi ...

  4. Federated Learning with Matched Averaging

    挖个坑吧,督促自己仔细看一遍论文(ICLR 2020),看看自己什么时候也能中上那么一篇(流口水)~ 郑重声明:原文参见标题,如有侵权,请联系作者,将会撤销发布! Abstract 联邦学习允许边缘设 ...

  5. Java动态代理(三)——Cglib动态代理

    一.Cglib动态代理Cglib是一个优秀的动态代理框架,它的底层使用ASM在内存中动态的生成被代理类的子类,使用Cglib即使代理类没有实现任何接口也可以实现动态代理功能.而且,它的运行速度要远远快 ...

  6. 《神经网络的梯度推导与代码验证》之FNN(DNN)的前向传播和反向推导

    在<神经网络的梯度推导与代码验证>之数学基础篇:矩阵微分与求导中,我们总结了一些用于推导神经网络反向梯度求导的重要的数学技巧.此外,通过一个简单的demo,我们初步了解了使用矩阵求导来批量 ...

  7. Mac上如何降级Java版本

    升级到了Java9,有些工具就不工作了.因此要降级到Java8.方法: /Library/Java/JavaVirtualMachines/下的高版本SDK即可

  8. 分享一款知识库平台系统-wcp

    入园这么些天了,今天搭建了一套知识库系统,使用效果还不错,分享一些过程经验. 搭建准备: 软件系统:WCP4.3免费版 (免费开源,支持Windows,使用简单,有傻瓜式一键安装包-win平台) 服务 ...

  9. Pandoanload涅槃重生,小白羊重出江湖?

    Pandoanload涅槃重生,小白羊重出江湖? 科技是把双刃剑,一方面能够砸烂愚昧和落后,另一方面也可能带给人类无尽的灾难. 原子物理理论的发展是的人类掌握了核能技术但是也带来了广岛和长崎的核灾难, ...

  10. Java获取CPU序列号

    获取CPU序列号 /** * 获取CPU序列号 * @return */ public static String getCpuId() throws IOException { Process pr ...