How to add hyperlink to text in a markdown in flutter

Question

I would like to add a hyperlink at the bottom of the screen where the Markdown widget is read. I tried to include the hyperlink in the markdown file but flutter is not launching it.

Then I tried this:

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Protective measures'),
      ),
      body: Column(
        children: <Widget>[
          Flexible(
            child: FutureBuilder(
              future: DefaultAssetBundle.of(context)
                  .loadString("assets/docs/protective_measures.md"),
              builder:
                  (BuildContext context, AsyncSnapshot<String> snapshot) {
                if (snapshot.hasData) {
                  return Markdown(
                    data: snapshot.data,
                    styleSheet: MarkdownStyleSheet(
                      textAlign: WrapAlignment.start,
                      p: TextStyle(
                        fontSize: 16,
                        color: isDark ? Colors.white : Colors.black,
                      ),
                      h2: TextStyle(
                        fontSize: 20,
                        fontWeight: FontWeight.bold,
                        color: isDark ? Colors.white : Colors.black,
                      ),
                      h1: TextStyle(
                        fontWeight: FontWeight.bold,
                        fontSize: 25,
                        color: isDark ? Colors.white : Colors.black,
                      ),
                    ),
                  );
                }

                return Center(
                  child: CircularProgressIndicator(),
                );
              },
            ),
          ),
          InkWell(
            child: Text(
              'My Hyperlink',
              style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 20,
                color: Colors.blue,
                decoration: TextDecoration.underline
              ),
            ),
            onTap: () => launch('https://stackoverflow.com'),
          ),
        ],
      ),
    );
  }

The result is not really what I wanted. I want a hypertext at the bottom of the screen, just after the Markdown. I also tried with ListView instead of Column but it's not working.

Any hint ?

Solution 1

For plugin flutter_markdown you can do like this

import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:url_launcher/url_launcher.dart';

final String _markdownData = "-This is [Google link](https://www.google.com)";

// view
MarkdownBody(
    data: _markdownData,
    onTapLink: (text, url, title){
        launch(url);
    },
)

Update for flutter_markdown version 0.5.1 or lower:

MarkdownBody(
    data: _markdownData,
    onTapLink: (url) {
        launch(url);
    },
)

Solution 2

I got it. The Markdown() widget has a onTapLink method and I just need to do:

onTapLink(url){
  launch(url);
}