Skip to content

Instantly share code, notes, and snippets.

@jogboms
Last active July 14, 2023 10:45
Show Gist options
  • Save jogboms/3111f38bc3b1433fa12f90c057fd6997 to your computer and use it in GitHub Desktop.
Save jogboms/3111f38bc3b1433fa12f90c057fd6997 to your computer and use it in GitHub Desktop.
An Alternative idea to styling Text widgets
/// How to use
///
/// ModifiedText(
/// "hello",
/// modifier: TextModifiers.fontSize(50).bold.primaryColor,
/// )
class ModifiedText extends StatelessWidget {
const ModifiedText(this.data, {Key? key, this.modifier = TextModifiers}) : super(key: key);
final String data;
final TextModifierBuilder modifier;
@override
Widget build(BuildContext context) => Text(data, style: modifier(context));
}
import 'package:flutter/material.dart';
/// How to use
///
/// Text(
/// "hello",
/// TextModifiers.fontSize(50).bold.primaryColor(context)
/// )
// ignore: constant_identifier_names
const TextModifiers = TextModifierBuilder();
typedef TextModifier = TextStyle Function(TextStyle style, ThemeData theme);
class TextModifierBuilder {
const TextModifierBuilder([this._modifiers = const <TextModifier>[]]);
final List<TextModifier> _modifiers;
TextStyle call(BuildContext context) => build(context);
TextStyle build(BuildContext context) {
final theme = Theme.of(context);
return _modifiers.fold(const TextStyle(), (style, modifier) => modifier(style, theme));
}
TextModifierBuilder append(TextModifier modifier) =>
TextModifierBuilder([..._modifiers, modifier]);
TextModifierBuilder prepend(TextModifier modifier) =>
TextModifierBuilder([modifier, ..._modifiers]);
}
extension TextModifiersExtensions on TextModifierBuilder {
TextModifierBuilder get bold => append((style, _) => style.copyWith(fontWeight: FontWeight.bold));
TextModifierBuilder get primaryColor =>
append((style, theme) => style.copyWith(color: theme.colorScheme.primary));
TextModifierBuilder fontSize(double fontSize) =>
append((style, _) => style.copyWith(fontSize: fontSize));
}
import 'package:flutter/material.dart';
// ignore: constant_identifier_names
const TextModifiers = TextModifierBuilder();
class TextModifierContext {
const TextModifierContext({required this.style});
final TextStyle style;
TextModifierContext copyWith({TextStyle? style}) =>
TextModifierContext(style: style ?? this.style);
}
typedef TextModifier = TextModifierContext Function(TextModifierContext style, ThemeData theme);
class TextModifierBuilder {
const TextModifierBuilder([this._modifiers = const <TextModifier>[]]);
final List<TextModifier> _modifiers;
TextModifierContext call(BuildContext context) => build(context);
TextModifierContext build(BuildContext context) {
final theme = Theme.of(context);
return _modifiers.fold(
const TextModifierContext(style: TextStyle()),
(context, modifier) => modifier(context, theme),
);
}
TextModifierBuilder append(TextModifier modifier) =>
TextModifierBuilder([..._modifiers, modifier]);
}
extension TextModifiersExtensions on TextModifierBuilder {
TextModifierBuilder get bold => append(
(context, _) => context.copyWith(style: context.style.copyWith(fontWeight: FontWeight.bold)));
TextModifierBuilder get primaryColor => append((context, theme) =>
context.copyWith(style: context.style.copyWith(color: theme.colorScheme.primary)));
TextModifierBuilder fontSize(double fontSize) =>
append((context, _) => context.copyWith(style: context.style.copyWith(fontSize: fontSize)));
}
import 'package:flutter/material.dart';
/// How to use
///
/// Text(
/// "hello",
/// TextModifiers.from(context).fontSize(50).bold.primaryColor()
/// )
class TextModifiers {
static TextModifierBuilder from(BuildContext context) => TextModifierBuilder(Theme.of(context));
}
typedef TextModifier = TextStyle Function(TextStyle style, ThemeData theme);
class TextModifierBuilder {
TextModifierBuilder(this._themeData, [this._modifiers = const <TextModifier>[]]);
final ThemeData _themeData;
final List<TextModifier> _modifiers;
TextStyle call() => build();
TextStyle build() =>
_modifiers.fold(const TextStyle(), (style, modifier) => modifier(style, _themeData));
TextModifierBuilder append(TextModifier modifier) =>
TextModifierBuilder(_themeData, [..._modifiers, modifier]);
TextModifierBuilder prepend(TextModifier modifier) =>
TextModifierBuilder(_themeData, [modifier, ..._modifiers]);
}
extension TextModifiersExtensions on TextModifierBuilder {
TextModifierBuilder get bold => append((style, _) => style.copyWith(fontWeight: FontWeight.bold));
TextModifierBuilder get primaryColor =>
append((style, theme) => style.copyWith(color: theme.colorScheme.primary));
TextModifierBuilder fontSize(double fontSize) =>
append((style, _) => style.copyWith(fontSize: fontSize));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment