spinning_wheel 1.0.0 copy "spinning_wheel: ^1.0.0" to clipboard
spinning_wheel: ^1.0.0 copied to clipboard

Customizable animated spinning wheel for Flutter: fortune wheel, prize wheel and lucky draw with weighted odds, swipe to spin and themed frames.

example/lib/main.dart

import 'package:flutter/material.dart';

import 'screens/custom_segments_screen.dart';
import 'screens/frames_screen.dart';
import 'screens/game_screen.dart';
import 'screens/playground_screen.dart';
import 'screens/server_result_screen.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Spinning Wheel Example',
      theme: ThemeData(colorSchemeSeed: Colors.deepOrange),
      home: const HomeScreen(),
    );
  }
}

/// One entry in the list of demos.
class _Demo {
  final String title;
  final String description;
  final IconData icon;
  final WidgetBuilder builder;

  const _Demo(this.title, this.description, this.icon, this.builder);
}

final List<_Demo> _demos = [
  _Demo(
    'Prize game',
    'Five spins to score. Tap the center, swipe the wheel or press spin, '
        'and stop it early if you dare.',
    Icons.casino,
    (_) => const GameScreen(),
  ),
  _Demo(
    'Playground',
    'Try every option live: frames, indicator side, slice sizes and '
        'styles, spin speed, label overflow, right-to-left and more.',
    Icons.tune,
    (_) => const PlaygroundScreen(),
  ),
  _Demo(
    'Frames',
    'Four ready-made frames, recolored versions, a custom-painted frame '
        'and an image used as a frame.',
    Icons.circle_outlined,
    (_) => const FramesScreen(),
  ),
  _Demo(
    'Server-decided result',
    'The result comes from a (pretend) server and the wheel lands on it '
        'with spinTo().',
    Icons.cloud_sync,
    (_) => const ServerResultScreen(),
  ),
  _Demo(
    'Custom segments',
    'Typed values, widgets and image providers on slices, per-slice text '
        'styles and image loading placeholders.',
    Icons.widgets,
    (_) => const CustomSegmentsScreen(),
  ),
];

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Spinning Wheel')),
      body: ListView.separated(
        padding: const EdgeInsets.all(16),
        itemCount: _demos.length,
        separatorBuilder: (_, __) => const SizedBox(height: 12),
        itemBuilder: (context, index) {
          final demo = _demos[index];
          return Card(
            clipBehavior: Clip.antiAlias,
            child: ListTile(
              contentPadding:
                  const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
              leading: Icon(demo.icon, size: 32),
              title: Text(demo.title),
              subtitle: Text(demo.description),
              trailing: const Icon(Icons.chevron_right),
              onTap: () => Navigator.of(context)
                  .push(MaterialPageRoute(builder: demo.builder)),
            ),
          );
        },
      ),
    );
  }
}
13
likes
160
points
556
downloads

Documentation

API reference

Publisher

verified publisherniteshmandal1.com.np

Weekly Downloads

Customizable animated spinning wheel for Flutter: fortune wheel, prize wheel and lucky draw with weighted odds, swipe to spin and themed frames.

Repository (GitHub)
View/report issues

Topics

#widget #animation #game #ui #random

License

MIT (license)

Dependencies

flutter

More

Packages that depend on spinning_wheel