flutter_text_highlight 0.8.2

Flutter Android iOS web

Render text with highlighted words. You can add specific styles and actions to each highlighted word. This is based on flutter_text_highlight by Fernando Éricles.

pub

Highlight Text Plugin #

A flutter package to highlight words from a text.

Usage #

To use this package, add flutter_text_highlight as a dependency in your pubspec.yaml file.

Getting Started #

With this package you can highlight words and create specific actions for each highlighted word, you can customize the style of each word separately or create a unique style for all of them, you can also customize the style of the rest of the text.

Example #

Import the highlight library

import 'package:flutter_text_highlight/flutter_text_highlight.dart';

You should use the HighlightedWord class to specify the dictionary words in a Map object

Map<String, HighlightedWord> words = {
    "Flutter": HighlightedWord(
        onTap: () {
            print("Flutter");
        },
        textStyle: textStyle,
    ),
    "open-source": HighlightedWord(
        onTap: () {
            print("open-source");
        },
        textStyle: textStyle,
    ),
    "Android": HighlightedWord(
        onTap: () {
            print("Android");
        },
        textStyle: textStyle,
    ),
};

Now you can call the TextHighlight widget

TextHighlight(
    text: text, // You need to pass the string you want the highlights
    words: words, // Your dictionary words
    textStyle: TextStyle( // You can set the general style, like a Text()
        fontSize: 20.0,
        color: Colors.black,
    ),
    textAlign: TextAlign.justify, // You can use any attribute of the RichText widget
),

0.7.0 Update #

Now you can choose to differentiate words with upper and lower case. To differentiate words by uppercase or lowercase letters just use as in the previous examples. To not differentiate words (text == TeXt) use the new HighlightMap class by passing its word library as a parameter.

HighlightMap highlightMap = HighlightMap(words);

And then you pass the highlightMap.getMap as the words parameter in the TextHighlight widget

TextHighlight(
    text: text,
    words: highlightMap.getMap,
),
1
likes
100
pub points
81%
popularity

Render text with highlighted words. You can add specific styles and actions to each highlighted word. This is based on flutter_text_highlight by Fernando Éricles.

Repository (GitHub)
View/report issues

Documentation

API reference

Uploader

andrea.maglie@gmail.com

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on flutter_text_highlight