five_pointed_star 1.0.4 copy "five_pointed_star: ^1.0.4" to clipboard
five_pointed_star: ^1.0.4 copied to clipboard

Simple five pointed star control.

example/main.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Five Pointed Star Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const StarRatingExample(),
    );
  }
}

class StarRatingExample extends StatefulWidget {
  const StarRatingExample({Key? key}) : super(key: key);

  @override
  State<StarRatingExample> createState() => _StarRatingExampleState();
}

class _StarRatingExampleState extends State<StarRatingExample> {
  int _selectedCount = 0;
  final int _disabledCount = 3;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Five Pointed Star Examples'),
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // Basic Example
            _buildSection(
              title: 'Basic Example',
              child: FivePointedStar(
                count: 5,
                onChange: (count) {
                  setState(() {
                    _selectedCount = count;
                  });
                },
              ),
            ),
            
            const SizedBox(height: 20),
            
            // Custom Colors
            _buildSection(
              title: 'Custom Colors',
              child: FivePointedStar(
                count: 5,
                color: Colors.grey[300]!,
                selectedColor: Colors.amber,
                onChange: (count) {
                  setState(() {
                    _selectedCount = count;
                  });
                },
              ),
            ),
            
            const SizedBox(height: 20),
            
            // Different Sizes
            _buildSection(
              title: 'Different Sizes',
              child: Column(
                children: [
                  FivePointedStar(
                    count: 5,
                    size: const Size(20, 20),
                    gap: 2,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                  const SizedBox(height: 10),
                  FivePointedStar(
                    count: 5,
                    size: const Size(32, 32),
                    gap: 6,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                  const SizedBox(height: 10),
                  FivePointedStar(
                    count: 5,
                    size: const Size(48, 48),
                    gap: 8,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                ],
              ),
            ),
            
            const SizedBox(height: 20),
            
            // Different Star Counts
            _buildSection(
              title: 'Different Star Counts',
              child: Column(
                children: [
                  FivePointedStar(
                    count: 3,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                  const SizedBox(height: 10),
                  FivePointedStar(
                    count: 7,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                  const SizedBox(height: 10),
                  FivePointedStar(
                    count: 10,
                    onChange: (count) {
                      setState(() {
                        _selectedCount = count;
                      });
                    },
                  ),
                ],
              ),
            ),
            
            const SizedBox(height: 20),
            
            // Disabled State
            _buildSection(
              title: 'Disabled State',
              child: FivePointedStar(
                count: 5,
                disabled: true,
                defaultSelectedCount: _disabledCount,
                onChange: (count) {
                  // This won't be called when disabled
                },
              ),
            ),
            
            const SizedBox(height: 20),
            
            // With Default Selection
            _buildSection(
              title: 'With Default Selection',
              child: FivePointedStar(
                count: 5,
                defaultSelectedCount: 3,
                onChange: (count) {
                  setState(() {
                    _selectedCount = count;
                  });
                },
              ),
            ),
            
            const SizedBox(height: 20),
            
            // Current Selection Display
            Container(
              padding: const EdgeInsets.all(16),
              decoration: BoxDecoration(
                color: Theme.of(context).colorScheme.surfaceContainerHighest,
                borderRadius: BorderRadius.circular(8),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    'Current Selection: $_selectedCount',
                    style: Theme.of(context).textTheme.titleMedium,
                  ),
                  const SizedBox(height: 8),
                  Text(
                    'Selected stars: ${'★' * _selectedCount}${'☆' * (5 - _selectedCount)}',
                    style: const TextStyle(fontSize: 24),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildSection({required String title, required Widget child}) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: Theme.of(context).textTheme.titleLarge?.copyWith(
            fontWeight: FontWeight.bold,
          ),
        ),
        const SizedBox(height: 8),
        child,
      ],
    );
  }
}
2
likes
125
points
124
downloads

Publisher

unverified uploader

Weekly Downloads

Simple five pointed star control.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on five_pointed_star