substring_highlight 0.1.2

  • Readme
  • Changelog
  • Example
  • Installing
  • 89

substring_highlight #

Highlight Flutter text at the character-level.

Designed for case-insensitive search-term highlighting, a single search term sub-string is highlighted (perhaps multiple times) within a longer string.

Inspired by the existing Flutter package "highlight_text," but supports sub-word character matches (e.g., 't' in 'Peter').

Limitations:

  1. Only supports a single search term
  2. Only case-insensitive matches
  3. Highlighted text is not clickable

The substrings being searched for highlighting don't have to match at the beginning of the longer strings (can be anywhere inside).

Even space characters will match, but not be highlighted, obviously.

Ancestor MUST have textDirection set (required by internal RichText widget), either through MaterialApp widget or explicitly wrapped by a Directionality widget:

Directionality(
    child: SubstringHighlight(text: 'Peter', term: 't'),
    textDirection: TextDirection.ltr)

Pull Requests #

Pull requests are welcome!

Usage #

Add a new dependency line to your project/pubspec.yaml file:

dependencies:
  ...
  substring_highlight: 0.1.0      # use latest version

Don't forget to flutter pub get.

Examples #

Default Styling Example #

Code: #

As an example, the following code snippet uses this package to highlight matching characters in each search result:

import 'package:substring_highlight/substring_highlight.dart';

...

  @override
  Widget build(BuildContext context) (
    return Container(
      padding: const EdgeInsets.all(12),
      child: SubstringHighlight(
        text: dropDownItem,     // search result string from database or something
        term: searchTerm,       // user typed "et"
      ),
    );
  )

Output: #

Screenshot

Customized Styling Example #

Code: #

This example adds 'textStyle' and 'textStyleHighlight' to change the colors of the text:

import 'package:substring_highlight/substring_highlight.dart';

...

  @override
  Widget build(BuildContext context) (
    return Container(
      padding: const EdgeInsets.all(12),
      child: SubstringHighlight(
        text: dropDownItem,                         // each string needing highlighting
        term: searchTerm,                           // user typed "m4a"        
        textStyle: TextStyle(                       // non-highlight style                       
          color: Colors.grey,
        ),
        textStyleHighlight: TextStyle(              // highlight style
          color: Colors.black,
          decoration: TextDecoration.underline,
        ),        
      ),
    );
  )

Output: #

Screenshot

Changelog #

Version 0.1.2 (2020-01-05) #

  • example has been upgraded to AndroidX

Version 0.1.0 (2019-12-15) #

  • added full example

Version 0.0.1 (2019-12-15) #

  • basic text highlighting functionality

example/README.md

Example #

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

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   return new MaterialApp(
     home: Scaffold(
         body: Center(
             child: SubstringHighlight(
                 text: 'search me for search terms', term: 'search'))),
   );
 }
}

Output: #

Screenshot

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  substring_highlight: ^0.1.2

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:substring_highlight/substring_highlight.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
78
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
89
Learn more about scoring.

We analyzed this package on Feb 27, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.5
  • Flutter: 1.12.13+hotfix.8

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
meta ^1.1.8 1.1.8
Transitive dependencies
collection 1.14.11 1.14.12
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test