jlouage / flutter-carousel-pro

Flutter Carousel Pro
MIT License
214 stars 90 forks source link

[Feature] Support CachedNetworkImages #15

Open ThinkDigitalSoftware opened 6 years ago

ThinkDigitalSoftware commented 6 years ago

This will help improve presentation without a lengthy workaround. Although it would show loading the first time, it would load from the cache on subsequent runs. Ignore horrible quality gif

carouselpro

idofilus commented 5 years ago

I was also needed to have it supported, and I was only required to have simple indicators. I ended up creating my own:

import 'package:flutter/material.dart';

class PageIndicator extends StatefulWidget
{
    int max;
    int current;

    PageIndicator({this.max, this.current});

    @override
    State createState() => PageIndicatorState();
}

class PageIndicatorState extends State<PageIndicator>
{
    final double indicatorSize = 10.0;
    final double indicatorMargin = 5.0;
    final Color indicatorInactiveBackground = Colors.white;
    final Color indicatorActiveBackground = Colors.blue;

    @override
    Widget build(BuildContext context)
    {
        if (widget.max <= 1)
            return Container();

        List<Widget> indicators = [];

        for (int i = 0; i < widget.max; i++)
        {
            indicators.add(
                Container(
                    width: indicatorSize,
                    height: indicatorSize,
                    decoration: BoxDecoration(
                        color: widget.current == i ? indicatorActiveBackground : indicatorInactiveBackground,
                        shape: BoxShape.circle
                    ),
                    margin: EdgeInsets.symmetric(horizontal: indicatorMargin)
                )
            );
        }

        return Container(
            padding: const EdgeInsets.only(bottom: 10.0),
            alignment: AlignmentDirectional.bottomCenter,
            height: 20.0,
            decoration: BoxDecoration(
                boxShadow: [
                    BoxShadow(
                        color: Color(0x1A000000),
                        blurRadius: 30.0,
                        spreadRadius: 10.0,
                        offset: Offset(0.0, -10.0)
                    )
                ]
            ),
            child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: indicators
            ),
        );
    }
}

class Carousel extends StatefulWidget
{
    List<Widget> children;

    Carousel({this.children});

    @override
    State createState() => CarouselState();
}

class CarouselState extends State<Carousel>
{
    final PageController _controller = PageController();
    int currentPage = 0;

    @override
    void initState()
    {
        super.initState();

        _controller.addListener(controllerListener);
    }

    @override
    Widget build(BuildContext context)
    {
        return Stack(
            children: <Widget>[
                PageView(
                    physics: new AlwaysScrollableScrollPhysics(),
                    children: widget.children,
                    controller: _controller,
                ),
                Align(
                    alignment: AlignmentDirectional.bottomCenter,
                    child: PageIndicator(max: widget.children.length, current: currentPage),
                )
            ],
        );
    }

    @override
    void dispose()
    {
        _controller.removeListener(controllerListener);
        super.dispose();
    }

    controllerListener()
    {
        if (_controller.page.round() != currentPage)
            setState(() => currentPage = _controller.page.round());
    }
} 

Usage:

Carousel(
    children: [/* Your widgets */],
)
premy commented 5 years ago

Will CachedNetworkImages support get added anytime soon?

ThinkDigitalSoftware commented 5 years ago

I just ended up building it in myself. I just deleted enough code in the package so I could insert my own widget

On Sun, Jan 20, 2019, 4:37 PM premy <notifications@github.com wrote:

Will CachedNetworkImages support get added anytime soon?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/jlouage/flutter-carousel-pro/issues/15#issuecomment-455917809, or mute the thread https://github.com/notifications/unsubscribe-auth/AV-HffiNJc0LNDvvzvY7rMEZD4xiDmeMks5vFQvAgaJpZM4WCvx8 .

pat64j commented 5 years ago

@idofilus You're a life saver. I learn't a lot from your code. THANKS!