Categories: android, ios, flutter, dart, markdown

How to add hyperlink to text in a markdown in flutter

1 answer

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 ?

Received answer to this question:
The best answer according to the author of the question:

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

onTapLink(url){   launch(url); }