decoration_flags 0.1.0

A lightweight, highly customizable Flutter widget to draw decorative hanging flags, flowers, and text banners along curved ropes using CustomPaint.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:decoration_flags/decoration_flags.dart';

void main() {
  runApp(
    const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: DecorationDemo(),
    ),
  );
}

class DecorationDemo extends StatelessWidget {
  const DecorationDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // appBar: AppBar(title: const Text('Decoration Flags Showcase')),
      body: SingleChildScrollView(
        padding: const EdgeInsets.symmetric(vertical: 20),
        child: Column(
          children: [
            _section(
              "Classic Party Bunting",
              DecorationFlags.triangles(count: 12, sag: 30),
            ),

            _section(
              "Multi-Arch Text Banner",
              DecorationFlags.text(
                text: "CONGRATS",
                totalArches: 2,
                sag: 50,
                flagColors: [Colors.teal, Colors.indigo, Colors.blue],
              ),
            ),

            _section(
              "Summer Flower Garland",
              DecorationFlags.flowers(
                count: 8,
                petalColor: Colors.orangeAccent,
                centerColor: Colors.white,
                ropeColor: Colors.green,
              ),
            ),

            _section(
              "Deep Sagging Triangles",
              DecorationFlags.triangles(
                count: 20,
                sag: 80,
                colors: [Colors.purple, Colors.pink],
              ),
            ),

            _section(
              "Simple Single Text Flag",
              DecorationFlags.text(text: "Welcome", sag: 20),
            ),
          ],
        ),
      ),
    );
  }

  Widget _section(String title, Widget decoration) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 40.0),
      child: Column(
        children: [
          Text(
            title,
            style: const TextStyle(
              fontWeight: FontWeight.bold,
              color: Colors.grey,
            ),
          ),
          const SizedBox(height: 10),
          decoration,
        ],
      ),
    );
  }
}