beauty builders

lib/main.dart

@@ -20,83 +20,68 @@ class MyApp extends StatelessWidget {
   }
 }
 
-class LikeButtonDecorator extends StatelessWidget {
-  const LikeButtonDecorator({super.key, required this.child, required this.height, required this.width});
-
-  final Widget child;
-  final double height, width;
-
-  @override
-  Widget build(BuildContext context) {
-    return SizedBox(
-      height: height,
-      width: width,
-      child: Stack(
-        children: [
-          Center(child: child),
-          Padding(
-            padding: const EdgeInsets.all(2.0),
-            child: Align(
-              alignment: Alignment.topRight,
-              child: Container(
-                padding: const EdgeInsets.all(3.0),
-                decoration: const BoxDecoration(shape: BoxShape.circle, color: Colors.blue),
-                child: const Icon(Icons.thumb_up, color: Colors.white, size: 16),
-              ),
-            ),
-          ),
-        ],
-      ),
+///
+/// Shape Builder
+///
+abstract class ShapeBuilder {
+  Widget build(Size size, Widget child) {
+    return Container(
+      height: size.height,
+      width: size.width,
+      decoration: BoxDecoration(shape: boxShape, color: shapeColor),
+      child: Center(child: child),
     );
   }
+
+  BoxShape get boxShape;
+  Color get shapeColor;
 }
 
-class AnimatedPulsingBorderDecorator extends StatefulWidget {
-  const AnimatedPulsingBorderDecorator({super.key, required this.child});
-
-  final Widget child;
+class RedSquareBuilder extends ShapeBuilder {
+  @override
+  BoxShape get boxShape => BoxShape.rectangle;
 
   @override
-  State<StatefulWidget> createState() => AnimatedPulsingBorderDecoratorState();
+  Color get shapeColor => Colors.red;
 }
 
-class AnimatedPulsingBorderDecoratorState extends State<AnimatedPulsingBorderDecorator>
-    with SingleTickerProviderStateMixin {
-  late final AnimationController controller;
-  late final Animation<double> paddingAnimation;
+class BlueCircleBuilder extends ShapeBuilder {
+  @override
+  BoxShape get boxShape => BoxShape.circle;
 
   @override
-  void initState() {
-    super.initState();
-    controller = AnimationController(
-      duration: const Duration(milliseconds: 750),
-      vsync: this,
-    );
-    paddingAnimation = Tween<double>(begin: 0.0, end: 3.0).animate(controller);
-    controller.repeat(reverse: true);
-  }
-
-  @override
-  void dispose() {
-    super.dispose();
-    controller.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return AnimatedBuilder(
-      builder: (context, _) {
-        return Container(
-          padding: EdgeInsets.all(paddingAnimation.value),
-          decoration: BoxDecoration(color: Colors.amber, borderRadius: BorderRadius.circular(15.0)),
-          child: widget.child,
-        );
-      },
-      animation: paddingAnimation,
-    );
-  }
+  Color get shapeColor => Colors.blue;
 }
 
+///
+/// Message Builder (Writer seemed appropriate)
+///
+abstract class MessageWriter {
+  Text write(String text);
+}
+
+class HotMessageWriter extends MessageWriter {
+  @override
+  Text write(String text) => Text(text, style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 18));
+}
+
+class ColdMessageWriter extends MessageWriter {
+  @override
+  Text write(String text) => Text(text, style: const TextStyle(color: Colors.white, fontSize: 14));
+}
+
+final List<ShapeBuilder> builders = [
+  RedSquareBuilder(),
+  BlueCircleBuilder(),
+  RedSquareBuilder(),
+];
+
+final List<MessageWriter> writers = [
+  ColdMessageWriter(),
+  HotMessageWriter(),
+  HotMessageWriter(),
+];
+
 class MyHomePage extends StatefulWidget {
   const MyHomePage({super.key});
 
@@ -110,29 +95,20 @@ class _MyHomePageState extends State<MyHomePage> {
     return Scaffold(
       appBar: AppBar(
         backgroundColor: Theme.of(context).colorScheme.inversePrimary,
-        title: const Text('Decorator'),
+        title: const Text('Builders'),
       ),
       body: Center(
         child: Column(
           mainAxisAlignment: MainAxisAlignment.center,
           children: <Widget>[
-            const Text(
-              'Decorators!!',
+            const Text('Builders!!'),
+            ...List.generate(
+              3,
+              (index) => builders[index].build(
+                Size(80.0 * (index + 1), 90.0 * (index + 1)),
+                writers[index].write('build ${index + 1}'),
+              ),
             ),
-            LikeButtonDecorator(
-                height: 30,
-                width: 160,
-                child: ElevatedButton(
-                  onPressed: () {},
-                  child: const SizedBox(
-                    height: 30,
-                    width: 160,
-                    child: Center(child: Text('Like Me!')),
-                  ),
-                )),
-            const SizedBox(height: 20),
-            AnimatedPulsingBorderDecorator(
-                child: ElevatedButton(onPressed: () {}, child: const Text('Pulsing goodness!!')))
           ],
         ),
       ),