CODEWITHSUNDEEP
flutterdartflutter-layout
Michael Amir
Michael Amir

Reputation: 255

More GestureRecognisers For The TextSpan In Flutter

I building an application in Flutter and I am in a situation where I got RichText widget with many TextSpan widgets and I need to have two gesture recognizers, one is on double tap and the other is on long press, so how do I do this if it is possible?

Upvotes: 1

Views: 1557

Answers (2)

Darshan
Darshan

Reputation: 11659

Each textSpan comes with its own text and children property for which you can use the recognizer property and implement different taps as needed. Consider below example:

Container(
                      color: Colors.black,
                      padding: EdgeInsets.all(10),
                      child: Center(
                          child: RichText(
                            text: TextSpan( //  <-- 1
                                text: 'This is a text from first textspan. ',
                                style: TextStyle(
                                    color: Colors.grey,
                                    fontSize: 20,
                                    fontWeight: FontWeight.bold),
                                children: <TextSpan>[ //   <-- 2
                                  TextSpan(
                                      text: ' This is a text from second textspan ',
                                      style: TextStyle(
                                          fontSize: 20,
                                          fontWeight: FontWeight.bold),
                                      recognizer: LongPressGestureRecognizer()
                                        ..onLongPress = () {
                                          print('Long pressed');
                                        },
                                      children: <
                                          TextSpan>[ //  <-- 3 (children of 2 textspan
                                        TextSpan(
                                            text: ' This is a another text from second textspan',
                                            recognizer: DoubleTapGestureRecognizer()
                                              ..onDoubleTap = () {
                                                print('double tapped');
                                              }
                                        )
                                      ]
                                  ),
                                ]
                            ),
                          )
                      )
                  )

The children: <TextSpan>[] commented as 2 has a text property and corresponding recognizer in which I used LongPressGestureRecognizer(). The same textSpan (2), has children property which again can have a sub text span with a text and corresponding recognizer in which I used DoubleTapGestureRecognizer().

So the output will be : You can long press on This is a text from second textspan and you can double tap on This is another text from second textspan.

Hope this answers your question.

Upvotes: 2

Eric Duffett
Eric Duffett

Reputation: 1684

Can't you just wrap the entire Text Span in the gesture detector widget? https://api.flutter.dev/flutter/widgets/GestureDetector-class.html

Upvotes: 1

Related Questions