flutter_lightbox 0.1.2 copy "flutter_lightbox: ^0.1.2" to clipboard
flutter_lightbox: ^0.1.2 copied to clipboard

A Simple Lightbox Component for Flutter with swiping and thumbnail capabilities. Created as I could not find any lightbox components for flutter that met my requirements. Supports many customisation o [...]

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_lightbox/flutter_lightbox.dart';
import 'package:flutter_lightbox/image_type.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter LightBox Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter LightBox Demo'),
    );
  }
}

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  final List<String> images = [
    'https://picsum.photos/250?image=10',
    'https://picsum.photos/250?image=13',
    'https://picsum.photos/250?image=15',
  ];

  final List<String> assetImages = [
    'assets/images/pikachu_1.png',
    'assets/images/pikachu_2.png',
    'assets/images/pikachu_3.png',
  ];

  Widget buildImageList(List<String> images, ImageType imageType) {
    return SizedBox(
      height: 85,
      child: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: images.length,
        itemBuilder: (BuildContext context, int index) {
          return InkWell(
            onTap: () {
              showGeneralDialog(
                context: context,
                pageBuilder: (BuildContext context, Animation animation,
                    Animation secondaryAnimation) {
                  return LightBox(
                    initialIndex: index,
                    images: images,
                    imageType: imageType,
                  );
                },
              );
            },
            child: Container(
              width: 70,
              height: 65,
              decoration: BoxDecoration(
                border: Border.all(
                  color: const Color.fromRGBO(246, 246, 246, 1),
                  width: 2,
                ),
                borderRadius: BorderRadius.circular(5),
              ),
              child: FittedBox(
                fit: BoxFit.contain,
                child: imageType == ImageType.network
                    ? Image.network(images[index])
                    : Image.asset(images[index]),
              ),
            ),
          );
        },
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        // change color while the other colors stay the same.
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            const Text("Network Images Example"),
            buildImageList(images, ImageType.network),
            const SizedBox(
              height: 30,
            ),
            const Text("Asset Images Example"),
            buildImageList(assetImages, ImageType.imageAsset),
            const Text("")
          ],
        ),
      ),
    );
  }
}
4
likes
150
points
118
downloads

Publisher

unverified uploader

Weekly Downloads

A Simple Lightbox Component for Flutter with swiping and thumbnail capabilities. Created as I could not find any lightbox components for flutter that met my requirements. Supports many customisation options, please refer to github for more information. If you have any suggestions or improvements, feel free to raise issues or contribute by creating pull requests.

Repository (GitHub)
View/report issues

Topics

#flutter #lighthbox #carousel #widget #images

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_lightbox