Spaces:
Configuration error
Configuration error
File size: 3,643 Bytes
78013c4 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 | library;
import 'package:flutter/material.dart';
/// Animated gradient orb background shared across all screens.
///
/// Wrapped in RepaintBoundary to isolate the animation layer from content,
/// preventing unnecessary repaints of child widgets during animation ticks.
/// Both orbs render in a single AnimatedBuilder to reduce build callbacks.
class AnimatedBackground extends StatefulWidget {
final Widget child;
const AnimatedBackground({super.key, required this.child});
@override
State<AnimatedBackground> createState() => _AnimatedBackgroundState();
}
class _AnimatedBackgroundState extends State<AnimatedBackground>
with SingleTickerProviderStateMixin {
late AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
vsync: this,
duration: const Duration(seconds: 28),
)..repeat(reverse: true);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final size = MediaQuery.sizeOf(context);
return Stack(
children: [
// Solid base
Container(color: const Color(0xFF000000)),
// Static emerald glow center
Positioned.fill(
child: Container(
decoration: const BoxDecoration(
gradient: RadialGradient(
center: Alignment.center,
radius: 0.65,
colors: [
Color(0x1410B981),
Colors.transparent,
],
),
),
),
),
// Animated orbs — both in a single builder to reduce frame callbacks
RepaintBoundary(
child: AnimatedBuilder(
animation: _controller,
builder: (context, child) {
final value = _controller.value;
final inverseValue = 1.0 - value;
return Stack(
children: [
// Purple orb (top-left drift)
Positioned(
top: -80 + (value * 100),
left: -60 + (value * 80),
child: Container(
width: size.width * 0.8,
height: size.height * 0.5,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: RadialGradient(
colors: [
const Color(0xFF8B5CF6).withValues(alpha: 0.12),
Colors.transparent,
],
),
),
),
),
// Sky-blue orb (bottom-right drift)
Positioned(
bottom: -80 + (inverseValue * 100),
right: -60 + (inverseValue * 80),
child: Container(
width: size.width * 0.85,
height: size.height * 0.5,
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: RadialGradient(
colors: [
const Color(0xFF38BDF8).withValues(alpha: 0.10),
Colors.transparent,
],
),
),
),
),
],
);
},
),
),
Positioned.fill(child: widget.child),
],
);
}
}
|