slider

https://stackoverflow.com/questions/53866967/how-to-create-a-carrousel-sliding-animation-with-pageview-in-flutter

import 'package:page_indicator/page_indicator.dart';必要

page_indicator: ^0.3.0

これも違う。

    PageIndicatorContainer container = new PageIndicatorContainer(
      child: new PageView(
        children: _list,

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

void main() => runApp(new Carousel());

class Carousel extends StatefulWidget {
  _CarouselState createState() => _CarouselState();
}

class _CarouselState extends State<Carousel>
    with SingleTickerProviderStateMixin {
  final PageController _controller = PageController();

  List<Widget> _list = [
    SliderBox(
        child: FlutterLogo(
      colors: Colors.red,
    )),
    SliderBox(
        child: FlutterLogo(
      colors: Colors.green,
    )),
    SliderBox(
        child: FlutterLogo(
      colors: Colors.blue,
    ))
  ];

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) => _animateSlider());
  }

  void _animateSlider() {
    Future.delayed(Duration(seconds: 2)).then((_) {
      int nextPage = _controller.page.round() + 1;

      if (nextPage == _list.length) {
        nextPage = 0;
      }

      _controller
          .animateToPage(nextPage,
              duration: Duration(seconds: 1), curve: Curves.linear)
          .then((_) => _animateSlider());
    });
  }

  @override
  Widget build(BuildContext context) {
    PageIndicatorContainer container = new PageIndicatorContainer(
      child: new PageView(
        children: _list,
        controller: _controller,
      ),
      length: _list.length,
      padding: EdgeInsets.fromLTRB(10, 40, 10, 10),
      indicatorSpace: 10,
      indicatorColor: Colors.grey[350],
      indicatorSelectorColor: Colors.grey,
    );

    return Stack(
      children: <Widget>[
        Container(color: Colors.grey[100], height: double.infinity),
        Container(
            color: Colors.white,
            child: container,
            margin: EdgeInsets.only(bottom: 50)),
      ],
    );
  }
}

class SliderBox extends StatelessWidget {
  final Widget child;
  const SliderBox({Key key, this.child}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(padding: EdgeInsets.all(10), child: child);
  }
}

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Carousel(),
    );
  }
}

class Carousel extends StatefulWidget {
  _CarouselState createState() => _CarouselState();
}

class _CarouselState extends State<Carousel>
    with SingleTickerProviderStateMixin {
  final PageController _controller = PageController();

  List<Widget> _list = [
    SliderBox(
        index: 0,
        child: FlutterLogo(
          colors: Colors.red,
        )),
    SliderBox(
        index: 2,
        child: FlutterLogo(
          colors: Colors.green,
        )),
    SliderBox(
        index: 3,
        child: FlutterLogo(
          colors: Colors.blue,
        ))
  ];

  @override
  void initState() {
    super.initState();
//    WidgetsBinding.instance.addPostFrameCallback((_) => _animateSlider());
  }

  void _animateSlider() {
    Future.delayed(Duration(seconds: 2)).then((_) {
      int nextPage = _controller.page.round() + 1;

      if (nextPage == _list.length) {
        nextPage = 0;
      }

      _controller
          .animateToPage(nextPage,
              duration: Duration(seconds: 1), curve: Curves.linear)
          .then((_) => _animateSlider());
    });
  }

  @override
  Widget build(BuildContext context) {
    PageIndicatorContainer container = PageIndicatorContainer(
      child: PageView(
          children: _list,
          controller: _controller,
          onPageChanged: (page) {
            print(page);
          }),
      length: _list.length,
      padding: EdgeInsets.fromLTRB(10, 40, 10, 10),
      indicatorSpace: 10,
      indicatorColor: Colors.grey[350],
      indicatorSelectorColor: Colors.grey,
    );

    return Stack(
      children: <Widget>[
        Container(color: Colors.grey[100], height: double.infinity),
        Container(
            color: Colors.white,
            child: container,
            margin: EdgeInsets.only(bottom: 50)),
      ],
    );
  }
}

class SliderBox extends StatefulWidget {
  final int index;
  final Widget child;
  const SliderBox({Key key, this.index, this.child}) : super(key: key);

  @override
  _SliderBoxState createState() => _SliderBoxState();
}

class _SliderBoxState extends State<SliderBox>
    with SingleTickerProviderStateMixin {
  AnimationController _animationController;

  @override
  void initState() {
    super.initState();
    _animationController = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 500),
    );

    _animationController.drive(
      AlignmentTween(
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    print(this.widget.index);
    return Container(
      padding: EdgeInsets.all(10),
      child: AlignTransition(
        alignment: _animationController
            .drive(
              CurveTween(
                curve: const Interval(0, 0.6, curve: Curves.fastOutSlowIn),
              ),
            )
            .drive(
              AlignmentTween(
                begin: Alignment.topLeft,
                end: Alignment.bottomRight,
              ),
            ),
        child: widget.child,
      ),
    );
  }

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }
}