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

A Flutter widget that recreates the macOS dock with smooth scaling animations, hover effects, and customizable parameters for a native-like experience.

macos_dock #

A Flutter widget that recreates the macOS dock effect with smooth animations and customizable parameters.

Live Example #

Check out the live demo: MacOS Dock Demo

Features #

  • 🔄 Smooth scaling animation on hover
  • ⬆️ Upward translation effect
  • 🎯 Neighboring icons scale effect
  • 🎨 Highly customizable parameters
  • 🖼️ Support for any widget as dock items
  • ↕️ Dynamic height adjustment
  • 🎬 Customizable animation duration

MacOS Dock Demo

Installation #

Add this to your package's pubspec.yaml file:

dependencies:
  macos_dock: ^1.0.1

Usage #

MacosDock(
  iconSize: 50,
  scaleFactor: 1.5,
  translateFactor: 1.0,
  children: (scale) => [
    Image.asset('assets/finder.png'),
    Image.asset('assets/safari.png'),
    Image.asset('assets/messages.png'),
  ],
)

Customization #

The dock can be customized with several parameters:

MacosDock(
  iconSize: 50,              // Base size of icons
  iconSpacing: 8,           // Space between icons
  scaleFactor: 1.5,         // How much icons scale up
  translateFactor: 1.0,     // How much icons move up
  radiusFactor: 1.0,        // Spread of the hover effect
  defaultMaxScale: 2.5,     // Maximum scale factor
  defaultMaxTranslate: -30, // Maximum upward translation
  animationDuration: const Duration(milliseconds: 200),
  children: (scale) => [
    // Your dock items here
  ],
)

Additional Parameters #

  • iconSize: Base size of the icons (default: 40)
  • iconSpacing: Space between icons (default: 8)
  • scaleFactor: Controls the magnitude of the scaling effect (default: 1)
  • translateFactor: Controls the magnitude of the upward translation (default: 1)
  • radiusFactor: Controls how far the scaling effect spreads to neighboring icons (default: 1)
  • defaultMaxScale: Maximum scale factor for icons (default: 2.5)
  • defaultMaxTranslate: Maximum upward translation in pixels (default: -30)
  • animationDuration: Duration of the scaling/translation animations (default: 200ms)

Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

17
likes
0
points
37
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter widget that recreates the macOS dock with smooth scaling animations, hover effects, and customizable parameters for a native-like experience.

Repository (GitHub)
View/report issues

Funding

Consider supporting this project:

www.buymeacoffee.com

License

unknown (license)

Dependencies

flutter

More

Packages that depend on macos_dock