adaptive_shimmer 0.0.2

A package to give adaptive shimmer effect to your widgets

Adaptive Shimmer provides easy shimmer effect to any child widget with the facility to turn and off shimmer anytime to save lot of code duplication and extra codes

Features

Adaptive shimmer is able to mock the shape of its child widget, shimmer colors, loop, animation duration, direction of shimmer etc are customisable

Getting started

Supports Android, IOS, Linux, MACOS, WEB, Windows VERSION 0.0.1

Usage

AdaptiveShimmer can be used for minimal coding and easy implementation of shimmer effects in your applications and provide interactive UI

import 'package:adaptive_shimmer/adaptive_shimmer.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});


  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Adaptive Shimmer Example',
      theme: ThemeData(

        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Adaptive Shimmer Example'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});


  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {


  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(

        backgroundColor: Theme.of(context).colorScheme.inversePrimary,

        title: Text(widget.title),
      ),
      body: Center(

          child: AdaptiveShimmer(
            //pass any widget you want to shimmer, here using a empty container
            //other properties like colors,loop,duration etc are customisable
            child: Container(
              color: Colors.amber,
              height: 100,width: 100,
            ),
            //set loading to true to turn on shimmer & false to turn off shimmer (typically to represent when data is loading or not)
            loading: true,
            // baseColor: Colors.grey[300]!,
            // highlightColor: Colors.grey[100]!,
            // enabled: true,
            // period:  const Duration(milliseconds: 1500),
            // direction:ShimmerDirection.ltr,
            // loop: 0,
          )
      ),
    );
  }
}

Additional information

Based on package shimmer: