text_style_preview 0.1.3 icon indicating copy to clipboard operation
text_style_preview: ^0.1.3 copied to clipboard

Preview a TextStyle based on Material Design's Typography. No more confusion in scale selection.

Preview a TextStyle based on Material Design's Typography

Features #

Ever been confused by Type Scale? (e.g. titleMedium, labelLarge) https://m3.material.io/styles/typography/type-scale-tokens

text_style_preview allows you to easily preview TextStyle

text_style_preview

Getting started #

Add dependency to your pubspec file #

dependencies:
  text_style_preview: <latest version>

Usage #

Basic usage #

Wrap Text widget with TextStylePreview widget.

const TextStylePreview(
  child: Text('Sample Text'),
),

Advanced usage #

You can customize the Preview by specifying the Style, etc.

TextStylePreview(
  initTypeScaleCategory: TypeScaleCategory.headlineSmall,
  applyCustomStyle: (textStyle) => textStyle.apply(
    color: Colors.blue,
    fontSizeFactor: 1.5,
  ),
  // set stye like this
  style: TextStylePreviewStyle(
    modalHeight: 300,
    barrierColor: Colors.transparent,
    showDivider: true,
    descriptionBuilder: (typeScaleCategory, textStyle) =>
        typeScaleCategory.name,
  ),
  child: const Text('Sample Text2'),
),

ThemeExtension #

With ThemeExtension, you can use the same style throughout the app!

@override
Widget build(BuildContext context) {
  return MaterialApp(
    theme: ThemeData(
      useMaterial3: true,
      primarySwatch: Colors.red,
      // set default stye like this
      extensions: const [
        TextStylePreviewStyle(
          showDivider: false,
        ),
      ],
    ),
    home: const TextStylePreviewDemoScreen(),
  );
}
5
likes
140
pub points
50%
popularity
screenshot
image

Publisher

verified publisher iconk9i.app

Preview a TextStyle based on Material Design's Typography. No more confusion in scale selection.

Homepage
Repository (GitHub)

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on text_style_preview