flutterx_utils 2.0.0

Flutter toolkit of typed extensions, JSON helpers, mutex and cancellation, tagged logging and layout widgets shared by the flutterx packages.

example/lib/main.dart

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

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

/// Shows a lightness slider over a color, logging through [Loggable] and throttling the log button with [MutexRun].
class ExampleApp extends StatelessWidget {
  /// Creates the example app.
  const ExampleApp({super.key});

  @override
  Widget build(BuildContext context) => MaterialApp(
    debugShowCheckedModeBanner: false,
    title: 'flutterx_utils example',
    theme: ThemeData(colorSchemeSeed: Colors.orange),
    home: const LoggableExample(),
  );
}

/// A page whose state logs and derives colors with the [ColorExt] operators.
class LoggableExample extends StatefulWidget {
  /// Creates the page.
  const LoggableExample({super.key});

  @override
  State<LoggableExample> createState() => _LoggableExampleState();
}

class _LoggableExampleState extends State<LoggableExample> with Loggable {
  final _run = MutexRun.first();
  double _value = 0;

  double get _lightness => (_value - .5) * 2;

  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: AppBar(title: const Text('flutterx_utils')),
    body: Center(
      child: Wrap(
        children: [
          for (final color in [Colors.pink.shade200, Colors.pink.shade500, Colors.grey, Colors.black])
            _swatch(color >> _lightness),
          Slider(value: _value, onChanged: (value) => setState(() => _value = value)),
        ],
      ),
    ),
    floatingActionButton: FloatingActionButton(
      onPressed: _logLightness,
      tooltip: 'Log',
      child: const Icon(Icons.add),
    ),
  );

  void _logLightness() => _run(() async {
    logInfo('lightness ${_lightness.toStringAsFixed(2)}');
    await Future<void>.delayed(const Duration(seconds: 1));
  }, fallback: null);

  Widget _swatch(Color color) => Container(
    width: 100,
    height: 100,
    color: color,
    child: Center(child: Text('#${color.hexString}')),
  );
}