搜索插件、代码仓与 APP 分类

GitHub 代码仓santa112358/detectable_text_field

可检测文本字段

带有检测功能的 TextField 和 Text 小部件。您可以检测标签、@ 符号,或任何您想要的内容。

可检测文本字段 项目封面
星标
45
复刻
45
最近推送(UTC)
2024年6月27日
项目状态
未归档

原始 README

以下为英文项目原文快照,最新内容请访问 GitHub。

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

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

DetectableTextEditingController allows you to listen to the typingDetection. Ideal for features like live hashtag or mention detection.


    final controller = DetectableTextEditingController(
      regExp: detectionRegExp(),
    );
    
    @override
    void initState() {
      super.initState();
      controller.addListener(() {
        setState(() {});
      });
    }
    
    @override
    Widget build(BuildContext context) {
      return Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Text(
            'Typing detection: ${controller.typingDetection}',
          ),
          DetectableTextField(
            controller: controller,
          ),
        ],
      );
    }

DetectableTextEditingController extends TextEditingController, so you can use it with TextField, TextFormField or any other widgets that accept TextEditingController.

If you use flutter_hooks, useDetectableTextEditingController is also available.

DetectableText

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

    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.

detectionRegExp()

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

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

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 regExp hashtag atSign url
hashTagRegExp ○ × ×
atSignRegExp × ○ ×
urlRegExp × × ○
hashTagAtSignRegExp ○ ○ ×
hashTagUrlRegExp ○ × ○
AtSignUrlRegExp × ○ ○
hashTagAtSignUrlRegExp ○ ○ ○
  • The detection rules are almost same as X(formally 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

💻
Abdullahi A. Addow
Abdullahi A. Addow

💻
Social Jawn
Social Jawn

💻
xuxiaowei13
xuxiaowei13

💻
debuggerx01
debuggerx01

💻
furukaze-akane
furukaze-akane

💻
drown0315
drown0315

💻

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

Santa Takahashi GitHub avatar
GitHub 作者

Santa Takahashi ↗

cat enthusiast

FreelanceTokyo官方网站 ↗
语言DartC++CMakeHTMLSwiftCKotlinObjective-C

分类

此仓库发布的插件

使用的依赖

依赖清单 3 项

  • flutter{"sdk":"flutter"}
  • flutter_hooks^0.20.3
  • flutter_test开发依赖{"sdk":"flutter"}

如何选择适合项目的代码仓?

先按使用场景筛选,再比较项目活跃情况,最后到原始仓库核对使用要求。

  1. 通过仓库名、作者或描述搜索,再按技术分类缩小范围。
  2. 结合星标、复刻与最近推送比较项目;星标反映社区关注,不代表质量保证。
  3. 使用前在 GitHub 核对 README、许可证与 Issues。

来源与维护

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗