A Flutter plugin to create views using Concentric Transition Clipper. Useful for onboarding, page transitions, custom clippers, painters etc.
Inspired by Cuberto - Animated Onboarding Screens
- Add this to your pubspec.yaml
dependencies: concentric_transition: ^1.0.3
- Get the package from Pub:
flutter packages get
- Import it in your file
import 'package:concentric_transition/concentric_transition.dart';
- ๐บ Concentric PageView
- ๐ณ๏ธ Concentric Clipper
- ๐ Concentric PageRoute
- Using ConcentricPageView widget
import 'package:concentric_transition/concentric_transition.dart';
ConcentricPageView(
colors: <Color>[Colors.white, Colors.blue, Colors.red],
itemCount: 1, // null = infinity
physics: NeverScrollableScrollPhysics(),
itemBuilder: (int index, double value) {
return Center(
child: Container(
child: Text('Page $index'),
),
);
},
);
- Using ConcentricPageRoute widget
Navigator.push(context, ConcentricPageRoute(builder: (ctx) {
return NextPage();
}));
- Using ConcentricClipper widget
import 'package:concentric_transition/concentric_transition.dart';
ClipPath(
clipper: ConcentricClipper(
progress: 0.1, // from 0.0 to 1.0
reverse: false,
radius: 30.0,
verticalPosition: 0.82,
),
child: Container(
color: Colors.green,
),
)
- Check out the complete Example