extended_wrapper 1.0.1 copy "extended_wrapper: ^1.0.1" to clipboard
extended_wrapper: ^1.0.1 copied to clipboard

Customizable Flutter widgets with spine/tail designs for chat bubbles, tooltips, and directional UI elements.

1.0.1 #

  • Modify the README.md to be more clear and concise.

1.0.0 #

Initial release of the Extended Wrapper package base on wrapper by toly1994.com - a Flutter widget for creating customizable containers with spined edges, perfect for chat bubbles, tooltips, and other UI elements.

✨ Features #

Core Widget

  • Wrapper: Main widget for creating containers with customizable spines
  • Wrapper.just: Simplified constructor for basic containers without spines
  • WrapperPainter: Custom painter for rendering the wrapper with spines and shadows

Spine Types

  • SpineType.top: Spine pointing upward (ideal for tooltips above content)
  • SpineType.left: Spine pointing leftward (perfect for chat bubbles from others)
  • SpineType.right: Spine pointing rightward (perfect for chat bubbles from user)
  • SpineType.bottom: Spine pointing downward (ideal for tooltips below content)

Customization Options

  • spineHeight: Controls the height/length of the spine (default: 8.0)
  • angle: Controls the angle of the spine tip (default: 75°)
  • radius: Controls the corner radius of the container (default: 5.0)
  • offset: Controls the horizontal/vertical offset of the spine (default: 15)
  • color: Sets the fill color of the wrapper (default: Colors.green)
  • strokeWidth: Optional border stroke width
  • formEnd: Positions the spine at the end instead of the beginning
  • padding: Customizable padding around the child content
  • shadow: Optional BoxShadow for depth and elevation

Advanced Features

  • Custom Spine Path Builder: Define custom spine shapes using SpinePathBuilder
  • Shadow Support: Built-in shadow rendering with proper spine shadow calculation
  • Responsive Design: Automatically adjusts padding based on spine type
  • Performance Optimized: Efficient rendering with minimal rebuilds

Use Cases

  • Chat Bubbles: Create realistic chat interfaces with left/right spines
  • Tooltips: Design tooltips with top/bottom spines
  • Callouts: Highlight important information with custom spine shapes
  • Speech Bubbles: Build comic-style speech bubbles
  • Custom UI Elements: Create unique containers for any design need

🎯 Examples Included #

  • Basic wrapper with default settings
  • Simple wrapper without spine
  • Chat bubble examples (left and right spines)
  • Tooltip examples (top and bottom spines)
  • Custom spine shapes (triangle, curved)
  • Advanced features (stroke, end positioning, different angles)

📦 Dependencies #

  • Flutter SDK
  • No additional external dependencies

🔧 Technical Details #

  • Built with Flutter's CustomPainter for optimal performance
  • Supports all Flutter platforms (iOS, Android, Web, Desktop)
  • Follows Material Design principles
  • Fully customizable and extensible
  • Comprehensive test coverage included
0
likes
160
points
39
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

Customizable Flutter widgets with spine/tail designs for chat bubbles, tooltips, and directional UI elements.

Homepage

License

MIT (license)

Dependencies

flutter

More

Packages that depend on extended_wrapper