Example of TweenSequence<Color> for a PageView

main.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'stackoverflow question',
      home: SafeArea(
        top: false,
        bottom: true,
        child: HomepageScreen(),
      ),
    );
  }
}

class HomepageScreen extends StatefulWidget {
  const HomepageScreen({Key key}) : super(key: key);

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

class _HomepageScreenState extends State<HomepageScreen>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<Color> animation;
  
  final colors = <TweenSequenceItem<Color>>[
      TweenSequenceItem(
        weight: 1.0,
        tween: ColorTween(begin: Colors.red, end: Colors.blue),
      ),
      TweenSequenceItem(
        weight: 1.0,
        tween: ColorTween(begin: Colors.blue, end: Colors.green),
      ),
      TweenSequenceItem(
        weight: 1.0,
        tween: ColorTween(begin: Colors.green, end: Colors.yellow),
      ),
      TweenSequenceItem(
        weight: 1.0,
        tween: ColorTween(begin: Colors.yellow, end: Colors.red),
      ),
    ];

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

    animation = TweenSequence<Color>(colors).animate(_controller)..addListener(() {
        setState(() {});
      });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: animation.value,
      body: Container(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Expanded(
              child: PageView.builder(
                physics: new PageScrollPhysics(),
                itemCount: colors.length,
                controller: PageController(viewportFraction: 0.8),
                onPageChanged: ((int index) {
                  _controller.animateTo(index / colors.length);
                }),
                itemBuilder: (_, i) {
                  return Padding(
                    padding:
                        EdgeInsets.only(left: i % 2 == 0 ? 0 : 15, bottom: 20),
                    child: Container(),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}