Skip to content
Videos
Video

Flutter Animations: Interactive Page Flip Widget

by Andrea Bizzotto youtube.com

16 min 21.1k views

How to build an interactive page flip widget using Flutter's AnimationController, AnimationBuilder, gesture detectors and custom 3D matrix transforms. Written tutorial: https://codewithandrea.com/videos/flutter-animations-page-flip-widget-part1/ Starter project: https://codewithandrea.com/videos/flutter-animations-page-flip-widget-part1/images/page_flip_flutter_tutorial.zip page_flip_builder source on GitHub: https://github.com/bizz84/page_flip_builder page_flip_builder package on pub.dev: https://pub.dev/packages/page_flip_builder CONTENTS 00:00 - Intro 01:16 - Starter Project overview 02:35 - Page Flip Widget API design 04:15 - Implementing the public API for the Page Flip Widget 05:55 - AnimationController setup 09:43 - Adding the Page Flip rotation code with AnimatedBuilder 14:48 - Full source code & package on pub.dev Join my FREE email course to become a Flutter expert with the best resources, at your own pace: https://codewithandrea.com/newsletter/ Sign up for my upcoming Flutter Animations course: 👇👇 https://codewithandrea.com/courses/flutter-animations-masterclass/ Happy coding!

Made by

Andrea Bizzotto @andreabizzotto 🇬🇧 United Kingdom

Available for hire

Andrea Bizzotto has extensive experience in mobile app development, having built complex apps for various clients and as an independent developer. He is passion...

View Andrea on Flutter Pro
Forum

Questions about this, or something to add?

Discuss on the forum

Topics Animations

It's All Widgets

Apps by Andrea Bizzotto

  • Flight CO2 Calculator screenshot

    Flight CO2 Calculator

    Simple app to calculate the CO2 emissions from your flights.

    Open source

Report this · Wrote this? Claim it

Supported by