flutter_custom_paint_plus 0.0.1

flutter_custom_paint_plus: ^0.0.1 copied to clipboard

example/lib/main.dart

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

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Custom Paint Plus Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Custom Paint Plus Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 0;

  static const List<Widget> _pages = [
    ShapesDemo(),
    PatternsDemo(),
    EffectsDemo(),
    CombinedDemo(),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: _pages[_selectedIndex],
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        currentIndex: _selectedIndex,
        onTap: (index) {
          setState(() {
            _selectedIndex = index;
          });
        },
        items: const [
          BottomNavigationBarItem(
            icon: Icon(Icons.circle_outlined),
            label: 'Shapes',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.pattern),
            label: 'Patterns',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.blur_on),
            label: 'Effects',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.layers),
            label: 'Combined',
          ),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            'Shapes Demo',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 20),

          // Circle
          const Text('Circle',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: CirclePainter(
                radius: 50.0,
                color: Colors.blue,
                strokeWidth: 3.0,
                strokeColor: Colors.black,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Rectangle
          const Text('Rectangle',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: RectanglePainter(
                width: 100.0,
                height: 60.0,
                color: Colors.green,
                cornerRadius: 15.0,
                strokeWidth: 2.0,
                strokeColor: Colors.green.shade800,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Polygon (Hexagon)
          const Text('Polygon (Hexagon)',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: PolygonPainter(
                sides: 6,
                radius: 50.0,
                color: Colors.orange,
                strokeWidth: 2.0,
                strokeColor: Colors.deepOrange,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Star
          const Text('Star',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: StarPainter(
                points: 5,
                outerRadius: 50.0,
                innerRadius: 25.0,
                color: Colors.yellow,
                strokeWidth: 2.0,
                strokeColor: Colors.orange,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            'Patterns Demo',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 20),

          // Dots Pattern
          const Text('Dots Pattern',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: DotsPatternPainter(
                spacing: 20.0,
                dotSize: 6.0,
                color: Colors.red,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Lines Pattern
          const Text('Lines Pattern',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: LinesPatternPainter(
                spacing: 15.0,
                lineThickness: 2.0,
                color: Colors.blue,
                isHorizontal: true,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Grid Pattern
          const Text('Grid Pattern',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: GridPatternPainter(
                spacing: 25.0,
                lineThickness: 1.0,
                color: Colors.grey,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            'Effects Demo',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 20),

          // Shadow Effect
          const Text('Shadow Effect',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: ShadowPainter(
                basePainter: CirclePainter(
                  radius: 40.0,
                  color: Colors.blue,
                ),
                offset: const Offset(8, 8),
                blurRadius: 15.0,
                color: Colors.black54,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Gradient Effect
          const Text('Gradient Effect',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: GradientPainter(
                basePainter: RectanglePainter(
                  width: 80.0,
                  height: 80.0,
                  color: Colors.blue,
                  cornerRadius: 20.0,
                ),
                colors: [Colors.blue, Colors.purple, Colors.red],
                gradientType: GradientType.radial,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Blur Effect
          const Text('Blur Effect',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: BlurPainter(
                basePainter: StarPainter(
                  points: 5,
                  outerRadius: 40.0,
                  innerRadius: 20.0,
                  color: Colors.yellow,
                ),
                blurRadius: 8.0,
                blurStyle: BlurStyle.normal,
              ),
            ),
          ),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text(
            'Combined Effects Demo',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          ),
          const SizedBox(height: 20),

          // Complex combination
          const Text('Complex Combination',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 150,
            child: CustomPaint(
              painter: ShadowPainter(
                basePainter: GradientPainter(
                  basePainter: BlurPainter(
                    basePainter: CirclePainter(
                      radius: 50.0,
                      color: Colors.blue,
                    ),
                    blurRadius: 5.0,
                    blurStyle: BlurStyle.normal,
                  ),
                  colors: [Colors.blue, Colors.purple, Colors.pink],
                  gradientType: GradientType.sweep,
                ),
                offset: const Offset(10, 10),
                blurRadius: 20.0,
                color: Colors.black54,
              ),
            ),
          ),
          const SizedBox(height: 20),

          // Pattern with effects
          const Text('Pattern with Effects',
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
          const SizedBox(height: 10),
          SizedBox(
            height: 120,
            child: CustomPaint(
              painter: ShadowPainter(
                basePainter: DotsPatternPainter(
                  spacing: 25.0,
                  dotSize: 8.0,
                  color: Colors.green,
                ),
                offset: const Offset(5, 5),
                blurRadius: 10.0,
                color: Colors.black38,
              ),
            ),
          ),
        ],
      ),
    );
  }
}