FLUTTER ECOSYSTEM

hyper-designed/box_transform

一个用于 UI 中矩形高级缩放的库。

box_transform 项目封面
Stars
84
Forks
22
最近推送(UTC)
2026年7月19日
项目状态
未归档
Hyperdesigned GitHub avatar
GITHUB Organization

Hyperdesigned ↗

语言DartHTMLSwiftShellRubyJavaObjective-C

技术话题

原始 README

以下为英文项目原文快照,最新内容请访问 GitHub。

展开 / 收起项目 README

Banner

Box Transform

Build Tests codecov

Box Transform provides packages that allows you to programmatically handle box resizing and dragging. It provides highly flexible, programmatically resizable and draggable boxes that can be used in any Dart or Flutter project.

Packages

Package Pub Description
box_transform Pub Version A pure Dart implementation for box transformation operations that does not rely on Flutter.
flutter_box_transform Pub Version A Flutter implementation that provides a flexible, customizable and easy to use interface tailored for Flutter projects.

Features

  • 📏 Dimension Constraining: Set maximum and minimum constraints to keep boxes within specific boundaries while resizing.
  • 🔁 Flipping Mechanics: Advanced positional-flipping when resizing hits extreme values with hard constraints.
  • 🔒 Drag Clamping: Specify clamping boxes to keep your transformable boxes within a specific region.
  • 🎨 Flexible Resizing Modes: Choose from four different resizing modes for more flexibility in how boxes are resized.
  • 📍 Customizable Anchor Points: Define resizing corner-handles to anchor different parts of the box when resizing.
  • 🎨 Customizable Handles: Use default resizing handles or define your own custom handles.
  • 🌀 Rotation Support: Rotate boxes around their center, with full rotated-aware drag, resize, flip, and clamping. Choose between BindingStrategy.originalBox (the unrotated logical rect stays in the clamp; rotated corners may extend outside) and BindingStrategy.boundingBox (the rendered axis-aligned footprint stays inside). Rotation gestures slide-then-freeze: when the requested angle would force the rect outside the clamp, the box slides into available slack first, then caps at the last feasible angle. Rotated force-flip also falls back to the natural direction when the flipped state can't fit, so the rect stays clamp-pinned instead of jumping or freezing.
  • 🚀 Easy Integration: Integrate Box Transform into your Dart or Flutter project with ease.

Getting Started

Go to the Getting Started page of the documentation to start using Box Transform.

Example App: box-transform-example.firebaseapp.com
Playground: box-transform-playground.firebaseapp.com

Documentation

Documentation is available at boxtransform.hyperdesigned.dev.

Contributing

See CONTRIBUTING.md for details.

See DEVELOPMENT.md for development setup.

Authors

https://avatars.githubusercontent.com/u/20423471?s=100
Birju Vachhani
https://avatars.githubusercontent.com/u/7407478?v=4
Saad Ardati

Feel free to join our Discord server for any inquiries or support!

https://raw.githubusercontent.com/hyper-designed/box_transform/HEAD/docs/assets/discord.png

License

Copyright © 2023 Hyperdesigned

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://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.