Flutter Previews - by Simon Lightfoot :: #HumpdayQandA on 19th November 2025 :: https://www.youtube.com/watch?v=OMlHgFZy4cg

humpday_2025-11-19_1.dart

// MIT License
//
// Copyright (c) 2025 Simon Lightfoot
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in all
// copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
// SOFTWARE.
//
import 'package:flutter/material.dart';
import 'package:flutter/widget_previews.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: const Home(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Example')),
      body: const Center(child: Text('Hello World')),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.blue,
      child: Padding(
        padding: const EdgeInsets.all(24.0),
        child: Center(
          child: const Text('RANDAL!'),
        ),
      ),
    );
  }
}

@Preview(
  name: 'My Sample Text',
  group: 'My Group',
)
Widget previewUseCaseRandalCoolnessWidget() {
  return Padding(
    padding: const EdgeInsets.all(24.0),
    child: SizedBox(
      width: 200.0,
      child: RandalCoolness(),
    ),
  );
}

@DoePreview(
  name: 'My Sample Text',
  group: 'My Group',
  previewSize: PreviewSize.device,
)
Widget mySampleText() {
  return Card(
    child: Center(
      child: const Text('Hello, World!'),
    ),
  );
}

enum PreviewSize { wrap, device }

final class DoePreview extends Preview {
  const DoePreview({
    super.group,
    super.name,
    this.previewSize = .wrap,
  });

  final PreviewSize previewSize;

  PreviewThemeData _previewThemeData() {
    return PreviewThemeData(
      materialLight: ThemeData.light(),
      materialDark: ThemeData.dark(),
    );
  }

  @override
  Preview transform() {
    final previewBuilder = super.transform().toBuilder();
    previewBuilder
      ..theme = _previewThemeData
      ..size = previewSize == .device ? Size(402, 874) : null
      ..wrapper = (child) {
        return Padding(
          padding: .all(24),
          child: child,
        );
      };
    return previewBuilder.build();
  }
}