shimmer_widget 1.0.0

Chiroyli yuklash animatsiyalari uchun Flutter loyihangizga silliq porlash effektini osongina qo'shing.

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(title: const Text("ShimmerWidget Example")),
        body: const ShimmerLoadingEffect(),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildShimmerProfileCard(),
          const SizedBox(height: 20),
          _buildShimmerListItem(),
          const SizedBox(height: 10),
          _buildShimmerListItem(),
          const SizedBox(height: 10),
          _buildShimmerListItem(),
        ],
      ),
    );
  }

  Widget _buildShimmerProfileCard() {
    return ShimmerWidget.fromColors(
      baseColor: Colors.grey[300]!,
      highlightColor: Colors.grey[100]!,
      child: Container(
        width: double.infinity,
        height: 120,
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(12),
        ),
      ),
    );
  }

  Widget _buildShimmerListItem() {
    return ShimmerWidget.fromColors(
      baseColor: Colors.grey[300]!,
      highlightColor: Colors.grey[100]!,
      child: Row(
        children: [
          Container(
            width: 50,
            height: 50,
            decoration: const BoxDecoration(
              color: Colors.white,
              shape: BoxShape.circle,
            ),
          ),
          const SizedBox(width: 10),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  width: double.infinity,
                  height: 12,
                  color: Colors.white,
                ),
                const SizedBox(height: 5),
                Container(
                  width: 150,
                  height: 12,
                  color: Colors.white,
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}