CODEWITHSUNDEEP
flutter
Deepak Sharma
Deepak Sharma

Reputation: 5063

Convert part of text clickable in flutter

I have a text like 'On clicking search, I agree to the Terms and Conditions as per the defined policy'. When the user tap 'Terms and Conditions' substring, I need to detect the tap.

How can we achieve this? I have tried with TextSpan(), below is the code.

Text.rich(TextSpan(
                  text: 'On clicking search, I agree to the ',
                  style: TextStyle(
                      fontWeight: FontWeight.normal, color: Colors.white),
                  children: <TextSpan>[
                    TextSpan(

                      text: 'Terms and Conditions',
                      style: TextStyle(
                          fontWeight: FontWeight.bold,
                          fontSize: 15,
                          color: Colors.white),
                    ),
                    TextSpan(
                        text: ' as per the defined policy',
                        style: TextStyle(
                            fontWeight: FontWeight.normal,
                            color: Colors.white)),
                  ]))

Upvotes: 0

Views: 119

Answers (2)

Khadga shrestha
Khadga shrestha

Reputation: 1180

You can user TapGestureRecognizer and handle on Tap function as

Text.rich(TextSpan(
                  text: 'On clicking search, I agree to the ',
                  style: TextStyle(
                      fontWeight: FontWeight.normal, color: Colors.white),
                  children: <TextSpan>[
                    TextSpan(    
                      text: 'Terms and Conditions',
                      recognizer:TapGestureRecognizer()
                     ..onTap = () {
                         //navigate to the privacy page
                      },
                      style: TextStyle(
                          fontWeight: FontWeight.bold,
                          fontSize: 15,
                          color: Colors.white),
                    ),
                    TextSpan(
                        text: ' as per the defined policy',
                        style: TextStyle(
                            fontWeight: FontWeight.normal,
                            color: Colors.white)),
                  ]))

Upvotes: 1

Darish
Darish

Reputation: 11481

You can use TapGestureRecognizer for this.

  TextSpan(
     text: 'Terms and Conditions',    
        recognizer: TapGestureRecognizer()
            ..onTap = () {

        //do your action here
         })

Upvotes: 0

Related Questions