rotation_three_d_effect 0.2.1 rotation_three_d_effect: ^0.2.1 copied to clipboard
A Flutter package inspired by SwiftUI's rotation3DEffect that allows to apply a Three Dimensional rotation to any Widget.
Rotation 3D Effect #
A Flutter package inspired by SwiftUI's rotation3DEffect that allows to apply a Three Dimensional rotation to any Widget.
Installation #
Add the following line to your pubspec.yaml file:
dependencies:
rotation_three_d_effect: ^0.2.1
Usage #
- Import the package:
import 'package:rotation_three_d_effect/rotation_three_d_effect.dart';
- Apply 3D Rotation Effect: a) Limited Returns In Place:
Rotation3DEffect.limitedReturnsInPlace(
child: Text(
'Hello 3D Rotation! \n(Returns in place)',
style: TextStyle(fontSize: 35),
),
)
b) Limited Rotation (No Return in Place):
Rotation3DEffect.limited(
maximumPan: 80,
child: FilledButton.tonal(
onPressed: () {},
child: const Text("Limited 3D Rotation (No return in place)"),
),
)
c) Full 3D Rotation:
Rotation3DEffect(
child: FlutterLogo(
size: 150,
),
)
d) Full Custom:
Rotation3DEffect(
maximumPan: 20,
returnsInPlace: true,
returnInPlaceDuration: const Duration(seconds: 2),
child: Card(
elevation: 6,
color: Colors.amber[300],
shadowColor: Colors.black,
child: const SizedBox(
height: 160,
width: 300,
child: Center(child: Text("Rotating Card")),
),
),
)
e) Full Custom with Initial and End Offset of your chosing:
Rotation3DEffect(
maximumPan: 90,
returnsInPlace: true,
returnInPlaceDuration: const Duration(milliseconds: 200),
initalPosition: const Offset(45, 90),
endPosition: const Offset(45, 90),
child: const Card(
elevation: 6,
color: Colors.green,
shadowColor: Colors.black,
child: SizedBox(
height: 160,
width: 300,
child: Center(
child: Text(
"Rotating Card\nInitial and end pos:\nx: 45, y: 90")),
),
),
)
Important Notice #
This project is still in development, bugs may be present and I encourage you to report them. New features are under development and will be coming in the next weeks.