showcaser 0.1.0 copy "showcaser: ^0.1.0" to clipboard
showcaser: ^0.1.0 copied to clipboard

A gallery shell for component showcases: responsive entry tiles with cover art, routing to the page each one documents.

example/lib/main.dart

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

void main() => runApp(const ExampleApp());

/// The example catalogue: a handful of entries routing to placeholder pages.
///
/// Deliberately plain — the point is the gallery, not the pages behind it.
final _entries = <ShowcaseEntry>[
  for (final (title, subtitle, icon) in <(String, String, IconData)>[
    ('Buttons', 'Labelled actions across every variant and state', Icons.check),
    ('Chips', 'Selectable labels, single or in a group', Icons.label_outline),
    ('Text fields', 'Typed entry, on its own or under a label', Icons.edit),
    (
      'Cards',
      'Surfaces, and keeping their content readable',
      Icons.crop_square,
    ),
    ('Dividers', 'Rules between stacked or side-by-side content', Icons.remove),
    ('App bars', 'Page chrome, shown in place', Icons.web_asset),
    ('Tabs', 'Switching between peer sections', Icons.tab),
    ('Sheets', 'Modal sheets, headers and footers', Icons.more_horiz),
  ])
    ShowcaseEntry(
      title: title,
      subtitle: subtitle,
      icon: Icon(icon),
      builder: (_) => _PlaceholderPage(title: title),
    ),
];

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'showcaser',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.indigo),
      ),
      darkTheme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.indigo,
          brightness: Brightness.dark,
        ),
      ),
      // No ShowcaseTheme: this is the zero-config path, where the gallery
      // dresses itself in stock Material.
      home: Scaffold(
        appBar: AppBar(title: const Text('showcaser')),
        body: ShowcaseEntryList(entries: _entries),
      ),
    );
  }
}

/// Where a tapped entry lands.
class _PlaceholderPage extends StatelessWidget {
  const _PlaceholderPage({required this.title});

  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(title)),
      body: Center(child: Text('The $title page.')),
    );
  }
}
0
likes
160
points
151
downloads

Documentation

API reference

Publisher

verified publisherluisburgos.xyz

Weekly Downloads

A gallery shell for component showcases: responsive entry tiles with cover art, routing to the page each one documents.

Repository (GitHub)
View/report issues
Contributing

Topics

#showcase #gallery #catalog #design-system #widget

License

MIT (license)

Dependencies

flutter

More

Packages that depend on showcaser