搜索插件、代码仓与 APP 分类

flexiges 封面
插件详情v1.0.2

flexiges

Flexi 是一个动态且全面的 Flutter 包,旨在为开发者提供轻松精确地拖动、缩放、旋转和调整其小部件大小的能力。Flexi 让这一切变得简单高效。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
35
喜欢数
4
Pub 分数
135

安装插件

flutter pub add flexiges

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

Flexiges 是一个 Flutter 包,可让开发者轻松实现动态触摸交互,例如拖动、缩放、旋转和缩放小部件。专为精确性和简洁性设计,它通过提供直观的手势控制来提升用户体验。该包支持多种平台,包括 Android、iOS、Web、macOS、Windows 和 Linux,适用于跨平台应用。设置简单,Flexiges 可无缝集成到现有项目中,帮助开发者创建互动性强且响应迅速的用户界面。

适合场景

  • 交互式 UI 组件
  • 拖拽式界面
  • 可缩放的图像查看器
  • 可旋转的 2D 元素
  • 基于手势的动画
  • 带有互动内容的教育类应用

主要特点

  • 拖动、缩放、旋转和调整小部件的大小
  • 高精度手势处理
  • 跨平台兼容性
  • 所需配置最少
  • 平滑的动画过渡
  • 支持多个触点

适合对象

  • 开发交互式应用的开发者
  • UI/UX 设计师实现手势操作
  • 教育类或游戏类应用
  • 需要动态 widget 操作的应用程序
  • 专注于快速原型设计的团队

使用建议

  • 可能会影响复杂嵌套控件的性能
  • 需要谨慎处理变换状态
  • 不适合静态布局
  • 最适合触控设备
  • 对高级变换的自定义有限

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

Flexi

Flexi is a Flutter package that provides a flexible widget for zooming, panning, and rotating child widgets.

Alt Text

Features

  • Zoom in and out of a widget.
  • Pan the widget by dragging it.
  • Rotate the widget using gestures.
  • Double-tap to reset the widget to its original state.
  • Configurable minimum and maximum scale limits.
  • Configurable maximum translation limits along the X and Y axes.
  • Enable/disable rotation, scaling, and translation individually.
  • Support for custom callbacks on scale start, update, and end events.

Installation

Add the following dependency to your pubspec.yaml file:

dependencies:
  flexi: ^1.0.0

Usage

Import the package in your Dart file:

import 'package:flexi/flexi.dart';

Wrap your widget with the Flexi widget:

FlexiGes(
  child: YourWidget(),
  minScale: 0.8, // Set the minimum scale limit (optional)
  maxScale: 2.5, // Set the maximum scale limit (optional)
  onScaleUpdate: (offset, scale, rotation) {
    // Handle scale update event
  },
  onScaleEnd: (details) {
    // Handle scale end event
  },
)

Parameters

  1. child: The child widget that you want to apply zoom, pan, and rotate features to. (required)
  2. minScale: The minimum scale factor for scaling the widget. Defaults to 0.8. (optional)
  3. maxScale: The maximum scale factor for scaling the widget. Defaults to 2.5. (optional)
  4. onScaleUpdate: A callback function that is triggered during the scale update event. It provides the current offset, scale factor, and rotation angle as parameters. (optional)
  5. onScaleEnd: A callback function that is triggered when the scale event ends. It provides the scale end details as a parameter. (optional)
  6. canRotate: Flag to enable/disable rotation. Defaults to true. (optional)
  7. canScale: Flag to enable/disable scaling. Defaults to true. (optional)
  8. canTranslate: Flag to enable/disable translation. Defaults to true. (optional)
  9. returnToOrigin: Flag to enable/disable returning to the original state on double-tap. Defaults to true. (optional)
  10. enabled: Flag to enable/disable the Flexi widget. Defaults to true. (optional)
  11. maxTranslationX: The maximum translation value along the X-axis. Defaults to 100. (optional)
  12. maxTranslationY: The maximum translation value along the Y-axis. Defaults to 100. (optional)

Example

Check out the example directory for a working example of using the Flexi widget.

Running Tests

To run the tests for the Flexi package, use the following command: flutter test flexi_test.dart

Contributing

Contributions are welcome! Please submit any issues or pull requests via the GitHub repository.

License

This project is licensed under the MIT License.

Feel free to customize the content further based on your package's specific details and testing instructions.

所属分类

依赖

依赖清单 1 项

源码仓库

使用此插件的项目

暂无相关数据。