[Mobile] : Allow mention

[burhanrashid52]

The use case is that I want to mention a user using @ keyword in quill editor as we do with other social media apps and show up the overlay for possible users, similar to tagging.

The first challenge is to trigger an event when a keyword is hit. I found that this can be done by listening to the quillController.changes stream. Not sure if there is any better way of doing it.

The second challenge is to show an overlay just below the cursor where the keyword was detected. I used LayerLink over QuillEditor but it does not seem to be working.

The third challenge is to get the text after the keyword. For example, If I type @burhanrashid52 I need a way to get text burhanrashid52.

If this is something not possible in the current lib then let me know how can I achieve it and if this is something the library is looking for then maybe I can contribute back with a PR.

[burhanrashid52]

Something similar to https://github.com/quill-mention/quill-mention

[burhanrashid52]

@singerdmx Can you guide me on how can this be achieved?

[mark8044]

This would be incredible and will become necessary as more people use this package.

I need it myself, but for now I'm going to build an overlay to populate mentions and then populate them into quill using various controllers.

But having this built in would be ideal

[kairan77]

I also need this feature, but would prefer NOT to have this feature provided by quill. This is fairly simple to implement on top of quill, I hope they maintain a lean and simple code base with quill and clean up existing bugs and issues.

[burhanrashid52]

hmm. I am interested to know how that can be achived.

[xinyuezhang0402]

Refer to this PR memspace/zefyr#594

[mark8044]

I have successfully achieved a working mention system using @(username). But I did it by listening to each character change in the controller and when it sees @ then present my own popup which connects to a username data base to present username, which update as the user types. When a user then selects one of the options I just insert the username text into the controller.

It works very well, but its done outside the context of the quill editor. It was not to difficult to do. I would love to integrate it into quill itself somehow but I don't understand where to start to have it work inside of flutter quill and I believe my code is quite messy and might not conform to the clean design that is here. If you like I could try to put my code into here if others want it, but as I said, its quite messy but works :)

[burhanrashid52]

That's exactly the same workaround I used.

[ketan10592]

Hey, Check out my example here : https://github.com/ketan10592/flutter_quill_example
you can find how to add (@)mention and (#)HashTag in flutter_quill.

[mark8044]

Not bad at all! but it looks like you are using links to hold your mention data, probably better to separate that for consistency