cached_network_lottie 0.0.3 copy "cached_network_lottie: ^0.0.3" to clipboard
cached_network_lottie: ^0.0.3 copied to clipboard

Cached network Lottie to load and cache network .json and .lottie files.

example/lib/main.dart

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Cached Network Lottie Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Cached Network Lottie'),
          elevation: 2,
        ),
        body: ListView(
          padding: const EdgeInsets.all(16),
          children: [
            const Text(
              'Examples',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 8),
            const Text(
              'The widget automatically detects the file format(.json, .lot, .lottie) and uses the appropriate renderer.',
              style: TextStyle(color: Colors.grey),
            ),
            const SizedBox(height: 24),
            Card(
              child: Padding(
                padding: EdgeInsets.all(16),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        const Text('Lottie JSON'),
                        CachedNetworkLottie(
                          'https://lottie.host/580f1627-4688-4032-b5d5-5827f53806fc/s0UIo43moM.json',
                          width: 200,
                          height: 200,
                          repeat: true,
                        ),
                      ],
                    ),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        const Text('DotLottie'),
                        CachedNetworkLottie(
                          'https://lottie.host/93d94043-ceda-4647-936e-6ba98c133621/uLZDyw5PYR.lottie',
                          width: 200,
                          height: 200,
                          repeat: true,
                          // stateMachineId: 'StateMachine1', // Mouse hover state machine
                        ),
                      ],
                    ),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        const Text('Telegram Stickers'),
                        CachedNetworkLottie(
                          'https://telegram.org/file/464001484/1/bzi7gr7XRGU.10147/815df2ef527132dd23',
                          width: 200,
                          height: 200,
                          repeat: true,
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}