Skip to content

Commit

Permalink
Merge pull request #15 from subirMM/subir/black_hole
Browse files Browse the repository at this point in the history
Submission - Blackhole Animation - Subir Chakraborty
  • Loading branch information
subirMM authored Oct 10, 2023
2 parents 1cd7d5f + 5794313 commit 91f2740
Show file tree
Hide file tree
Showing 2 changed files with 184 additions and 0 deletions.
182 changes: 182 additions & 0 deletions lib/animations/black_hole/black_hole.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,182 @@
import 'package:flutter/material.dart';

import '../../contributors_card.dart';

class BlackHole extends StatefulWidget {
const BlackHole({super.key});

@override
State<BlackHole> createState() => _BlackHoleState();
}

class _BlackHoleState extends State<BlackHole> with TickerProviderStateMixin {
late AnimationController _rotationController;
late AnimationController _scaleController;
late Animation<double> _rotateAnimation;
late Animation<double> _borderRadiusAnimation;
late Animation<double> _scaleAnimation;

@override
void initState() {
super.initState();

//rotation animation controller
_rotationController = getAnimationController(4);
setAnimationListener(_rotationController);

//scale animation controller
_scaleController = getAnimationController(8);
setAnimationListener(_scaleController);

//rotation animation
_rotateAnimation = Tween(begin: 0.0, end: 10.0)
.animate(CurvedAnimation(parent: _rotationController, curve: Curves.easeInOut));
//border radius animation
_borderRadiusAnimation = Tween(begin: 150.0, end: 120.0)
.animate(CurvedAnimation(parent: _rotationController, curve: Curves.easeInOut));
//black hole scale animation
_scaleAnimation = Tween(begin: 0.95, end: 2.0).animate(
CurvedAnimation(parent: _scaleController, curve: Curves.bounceInOut));
}

@override
Widget build(BuildContext context) {
return Container(
color: Colors.black,
child: Stack(
alignment: Alignment.center,
children: [
Stack(
alignment: Alignment.center,
children: [
Transform.rotate(
angle: _rotateAnimation.value + 0.2,
child: Container(
width: 210,
height: 210,
decoration: BoxDecoration(
color: const Color(0xFF3B3449),
borderRadius: BorderRadius.all(
Radius.circular(_borderRadiusAnimation.value),
),
boxShadow: [
BoxShadow(
color: const Color(0xFFBC0BFA).withOpacity(0.7),
offset: const Offset(0.0, -7.0),
blurRadius: 150.0,
blurStyle: BlurStyle.outer,
spreadRadius: 10),
BoxShadow(
color: const Color(0xFFBC0BFA).withOpacity(0.4),
offset: const Offset(0.0, 12.0),
blurRadius: 120.0,
blurStyle: BlurStyle.outer,
spreadRadius: 5),
]),
),
),
Transform.rotate(
angle: _rotateAnimation.value * 2,
child: Container(
width: 200,
height: 200,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft:
Radius.circular(_borderRadiusAnimation.value + 10),
topRight:
Radius.circular(_borderRadiusAnimation.value - 2),
bottomLeft:
Radius.circular(_borderRadiusAnimation.value + 5),
bottomRight:
Radius.circular(_borderRadiusAnimation.value + 15),
),
boxShadow: [
BoxShadow(
color: const Color(0xFFBC0BFA).withOpacity(0.8),
offset: const Offset(-6.0, -2.0),
blurRadius: 150.0,
blurStyle: BlurStyle.outer,
spreadRadius: 8),
BoxShadow(
color: const Color(0xFF383E3F).withOpacity(0.8),
offset: const Offset(-6.0, 7.0),
),
]),
),
),
Transform.rotate(
angle: -_rotateAnimation.value,
child: Transform.scale(
scale: _scaleAnimation.value,
child: Container(
width: 190,
height: 190,
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.only(
topLeft:
Radius.circular(_borderRadiusAnimation.value - 2),
topRight:
Radius.circular(_borderRadiusAnimation.value + 3),
bottomLeft:
Radius.circular(_borderRadiusAnimation.value - 5),
bottomRight:
Radius.circular(_borderRadiusAnimation.value - 7),
),
boxShadow: [
BoxShadow(
color: const Color(0xFF000000).withOpacity(0.8),
offset: const Offset(-6.0, 10.0),
),
BoxShadow(
color: const Color(0xFF000000).withOpacity(0.5),
offset: const Offset(10.0, 0.0),
),
]),
),
),
),
],
),
const Positioned(
left: 0,
right: 0,
bottom: 32,
height: 100,
child: ContributorsCard(
imageUrl:
"https://ca.slack-edge.com/T02TLUWLZ-UKMME8H8U-825b8f468eac-512",
name: "Subir Chakraborty",
email: "[email protected]",
textColor: Colors.white,
),
),
],
),
);
}

AnimationController getAnimationController(int duration) {
return AnimationController(
vsync: this,
duration: Duration(seconds: duration),
);
}

void setAnimationListener(AnimationController controller) {
controller
..addListener(() {
setState(() {});
})
..addStatusListener((status) {
if (status == AnimationStatus.completed) {
controller.reverse();
} else if (status == AnimationStatus.dismissed) {
controller.forward();
}
})
..forward();
}
}
2 changes: 2 additions & 0 deletions lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import 'animations/animated_container/animated_container.dart';
import 'animations/crazy_squares/square_container_animation.dart';
import 'animations/day_night.dart';
import 'animations/fab_menu/fab_menu.dart';
import 'animations/black_hole/black_hole.dart';
import 'animations/rainbow_loader/rainbow_loader.dart';
import 'animations/fi_splash/fi_splash.dart';
import 'animations/ripple_wave/ripple_wave.dart';
Expand Down Expand Up @@ -65,6 +66,7 @@ class _AnimationsCarouselState extends State<AnimationsCarousel> {
const SquareContainerAnimation(),
const NeumorphismButtonGrid(),
const CelebrationButton(),
const BlackHole(),
];

@override
Expand Down

0 comments on commit 91f2740

Please sign in to comment.