formatted_text_hooks 4.0.1 copy "formatted_text_hooks: ^4.0.1" to clipboard
formatted_text_hooks: ^4.0.1 copied to clipboard

A simple text formatting package. Use to format text in TextField and Text widgets. Hooks version of formatted_text.

pub package BSD-3-Clause License

Introduction #

  • Formatted Text is a Text formatting package.

  • One text can be wrapped aroung with multiple patterns to apply multiple TextStyles merged together. ( All TextStyles should be able to merged together )

  • Child wrappers can be applied to substrings and they will be merged with parenet wrapper style. ( All TextStyles should be able to merged together )

  • This package includes,

    • Text View
    • Text Editing Controller
    • Selection toolbar

Packages #

formatted_text - Formatted Text Package

formatted_text_hooks - Formatted Text Hooks Package

Getting Started #

Add as a dependency #

dependencies:
  formatted_text: [latest-version]

If you are using flutter_hooks use formatted_text_hooks

dependencies:
  formatted_text_hooks: [latest-version]

Import package #

import 'package:formatted_text/formatted_text.dart';

If using formatted_text_hooks

import 'package:formatted_text_hooks/formatted_text_hooks.dart';

Usage examples #

Text View #

Bold

FormattedText('*This text is bold*');

Bold Text Image

Italic

FormattedText('_This text is Italic_');

Italic Text Image

Strikethrough (~) and Underline (#) are also available as default formatters

Multi styling substrings

FormattedText('_This is *Bold Italic* Italic_');

Multistyling substring Image

#

Text Editing Controller #

final textEditingController = FormattedTextEditingController();

or with hooks

final textEditingController = useFormattedTextController();

#

Custom Formatters #

  • Providing custom formatters will override the default formatters.
FormattedText(
  '==This text is orange==',
  formatters: [
    ... FormattedTextDefaults.formattedTextDefaultFormatters, // To add default formatters
    FormattedTextFormatter(
      patternChars: '==', // Pattern char(s)
      style: TextStyle(color: Colors.orange),
    )
  ],
)

#

Context Menu Builder #

To get adaptive text selection toolbar with default formatter menu items,

contextMenuBuilder: (BuildContext context,
    EditableTextState editableTextState) {
  return FormattedTextContextMenuBuilder
    .adaptiveTextSelectionToolbar(
      editableTextState: editableTextState);
}

Custom Context Menu Builder Items #

  • Providing custom menu items will override the default formatter items.
  • Don't escape patternChars.
contextMenuBuilder: (BuildContext context,
    EditableTextState editableTextState) {
  return FormattedTextContextMenuBuilder
      .adaptiveTextSelectionToolbar(
    editableTextState: editableTextState,
    items: [
      ...FormattedTextDefaults
          .formattedTextDefaultContextMenuItems, // Default formatters
      const FormattedTextContextMenuItem(
        label: 'Orange',
        patternChars: '==',
      ),
    ],
  );
},

Or

  • Use context menu button items
contextMenuBuilder: (BuildContext context,
    EditableTextState editableTextState) {
  return AdaptiveTextSelectionToolbar.buttonItems(
    anchors: editableTextState.contextMenuAnchors,
    buttonItems: [
      ...editableTextState.contextMenuButtonItems,
      ...FormattedTextDefaults
          .formattedTextDefaultContextMenuButtonItems(
              editableTextState),
      FormattedTextContextMenuBuilder
          .buildContextMenuButtonItem(
        editableTextState: editableTextState,
        item: const FormattedTextContextMenuItem(
          label: 'Orange',
          patternChars: '==',
        ),
      ),
    ],
  );
}

#

[DEPRECATED] #

Use Context Menu Builder

Selection controls #

To display custom selection controls,

selectionControls: FormattedTextSelectionControls(),

Modify cut / copy / paste / select all action availability using Toolbar Options

toolbarOptions: ToolbarOptions(
  cut: false,
  copy: false,
  paste: false,
  selectAll: true,
)

Custom Formatter Image - Orange Text

Custom Toolbar Actions #

  • Providing custom actions will override the default actions except cut / copy / paste / select all.
  • Don't escape patternChars.
selectionControls: FormattedTextSelectionControls(
  actions: [
    ... FormattedTextDefaults.formattedTextToolbarDefaultActions, // To add default actions
    FormattedTextToolbarAction(
      label: 'Orange',
      patternChars: '==',
    )
  ],
)

Note #

  • All formatter patterns must be distinctive
  • Child patterns which are already applied will be considered normal text
  • Child styles should be able to merge with parent styles

Issues #

Please file any issues, bugs or feature requests as an issue on our GitHub page.

Author #

This Formatted Text Hooks package is developed by NirmalCode.

2
likes
160
pub points
19%
popularity

Publisher

verified publishernirmalcode.com

A simple text formatting package. Use to format text in TextField and Text widgets. Hooks version of formatted_text.

Repository (GitHub)
View/report issues

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

equatable, flutter, flutter_hooks, formatted_text

More

Packages that depend on formatted_text_hooks