How to navigate to respective page by tapping RichText in flutter

Issue

I am implementing RichText, in which while tapping the text i need to navigate to the respective page , i have did it using recognizer, but unable to navigate, any suggestion which could really helpful, pls suggest

 RichText(
                        text: TextSpan(children: [
                      TextSpan(
                          text: ' ALREADY HAVE AN ACCOUNT ? ',
                          style: TextStyle(color: Colors.grey)),
                      TextSpan(
                          text: 'LOG IN',
                          recognizer: new TapGestureRecognizer()..onTap = () => {
                            Navigator.push(context, MaterialPageRoute(
                                builder: (context) => LoginPage()),
                            )
                          },
                          style: TextStyle(color: Colors.deepPurpleAccent)),
                    ]))

Solution

How about wrapping RichText in an InkWell:

import 'package:flutter/material.dart';

class TextInkwellpage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Text InkWell'),
      ),
      body: Center(
        child: InkWell( // child tapped will fire onTap
          child: RichText(
            text: TextSpan(text: 'Inside RichText....', style: DefaultTextStyle.of(context).style),
          ),
          onTap: () => Navigator.of(context).push(MaterialPageRoute(builder: (context) => SomePage())),
          // ↑ Navigate to new page here
        ),
      )
    );
  }
}

Answered By – Baker

Answer Checked By – Robin (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.