detectable_text_field 2.0.4 icon indicating copy to clipboard operation
detectable_text_field: ^2.0.4 copied to clipboard

TextField with detection features. You can detect hashtags, at sign, url or anything you want. Helps you develop Twitter like app. Refinement of hashtagable

detectable_text_field #

All Contributors

pub package License: MIT

Text widgets with detection features. You can detect hashtags, at sign, url, or anything you want. Helps you develop Twitter like app.

Refinement of hashtagable.

final

Usage #

As TextField #

    DetectableTextField(
      detectionRegExp: detectionRegExp(),
      detectedStyle: TextStyle(
        fontSize: 20,
        color: Colors.blue,
      ),
      basicStyle: TextStyle(
        fontSize: 20,
      ),
    )
  • detectionRegExp decides the text to detect. detectedStyle is the textStyle for detected text. basicStyle is the textStyle for not detected text.

  • Other arguments are basically same as material TextField.

As ReadOnlyText #

If you want to use detection feature in the text only to display, DetectableText will help you.

    DetectableText(
      text: "#HashTag and @AtSign and https://pub.dev/packages/detectable_text_field",
      detectionRegExp: detectionRegExp(),
      detectedStyle: TextStyle(
        fontSize: 20,
        color: Colors.blue,
      ),
      basicStyle: TextStyle(
        fontSize: 20,
      ),
      onTap: (tappedText){
        print(tappedText);
      },
    )

Usage of the arguments like detectionRegExp are same as the ones in DetectableTextField.

The argument onTap(String) is called when user tapped a detected text.

You can add some actions in this callback with the tapped text.

detectionRegExp() #

The widgets and methods in this package is expected to be used with RegExp.

The function detectionRegExp() returns sample regExp depending om the boolean arguments: hashtag, atSign, and url.They are all true by default.

If you do NOT want to detect atSign, you need to set the argument like this: detectionRegExp(atSign:false). It is same for other arguments.

If you see the API reference, you will see the function just returns the sample regular expressions below. You can use them directly if you want.

sample regExphashtagatSignurl
hashTagRegExp××
atSignRegExp××
urlRegExp××
hashTagAtSignRegExp×
hashTagUrlRegExp×
AtSignUrlRegExp×
hashTagAtSignUrlRegExp
  • The detection rules are almost same as twitter.
    1. It needs space before # or @.
    2. It stops # and @ detection if there's emoji or symbol.
  • The examples currently support six languages: English, Japanese, Korean, Spanish, Arabic, and Thai.

Customize with useful functions #

  • Check if there are detections
   print(isDetected("Hello #World", hashTagRegExp));
   // true

   print(isDetected("Hello World", hashTagRegExp));
   // false

  • Extract detections from text
   final List<String> detections = extractDetections("#Hello World #Flutter Dart #Thank you", hashTagRegExp);
   // ["#Hello", "#Flutter", "#Thank"]

If you have any requests or questions, please feel free to ask on github.

Contributors ✨ #

Thanks goes to these wonderful people (emoji key):

Santa Takahashi
Santa Takahashi

💻
Paresh Patil
Paresh Patil

💻
Joseph Muller
Joseph Muller

💻
Esteve Aguilera
Esteve Aguilera

💻
MATTYGILO
MATTYGILO

💻

This project follows the all-contributors specification. Contributions of any kind welcome!

89
likes
130
pub points
92%
popularity

Publisher

verified publisher icon3tadev.work

TextField with detection features. You can detect hashtags, at sign, url or anything you want. Helps you develop Twitter like app. Refinement of hashtagable

Homepage

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on detectable_text_field