Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
skeleton_animation cover
Package detailsv0.1.4

skeleton_animation

Display skeleton animations in your app. It works on android, iOS and the web.

pub.dev API documentation Source code
30-day downloads
48
Likes
33
Pub points
70

Install package

flutter pub add skeleton_animation

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

The skeleton_animation package provides a simple way to display skeleton placeholders in Flutter apps across Android, iOS, and web platforms. It mimics the loading state of UI elements with animated gray shapes that resemble content before it's fully loaded. Ideal for improving perceived performance during data fetching, it helps maintain a smooth user experience by reducing visual abruptness. The package is lightweight and integrates seamlessly into existing widgets without requiring complex setup.

Use cases

  • Loading screens for lists
  • Placeholder views for images
  • Preventing layout shifts during data fetch
  • Enhancing UX during network delays
  • Animating content placeholders in forms

Key features

  • Cross-platform support (Android, iOS, Web)
  • Simple integration with existing widgets
  • Animated skeleton shapes
  • Minimal configuration required
  • Lightweight and performant

Suitable for

  • Developers building dynamic UIs
  • Apps with frequent data loading
  • UX-focused applications
  • Prototyping interactive screens
  • Projects aiming to reduce perceived load time

Considerations

  • Limited customization options
  • No built-in support for custom animation speeds
  • Requires manual handling of visibility states
  • Not suitable for static placeholder designs
  • Depends on external dependencies for advanced features

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

skeleton_animation

Pub Version

Creates a simple skeleton animation that can be used on android, iOS and the web.

How to use

import 'package:skeleton_animation/skeleton_animation.dart';

Skeleton(
  height: 12,
  style: SkeletonStyle.text
),

// or

SkeletonText(
  height: 12
)

Categories

Placeholder

Source repository

Projects using this package

No data available yet.