在你的应用中添加可点击链接的另一种(或不是)方式(对我来说就是这样):

1 -在你的pubspec中添加url_launcher包。yaml文件

(包版本5.0对我来说不太好，所以我使用4.2.0+3)。

dependencies:
  flutter:
    sdk: flutter
  url_launcher: ^4.2.0+3

2 -导入并使用如下。

import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';

void main() {
  runApp(MaterialApp(
    title: 'Navigation Basics',
    home: MyUrl(),
  ));
}

class MyUrl extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Url Launcher'),
      ),
      body: Center(
        child: FlatButton(
          onPressed: _launchURL,
          child: Text('Launch Google!',
              style: TextStyle(fontSize: 17.0)),
        ),
      ),
    );
  }

  _launchURL() async {
    const url = 'https://google.com.br';
    if (await canLaunch(url)) {
      await launch(url);
    } else {
      throw 'Could not launch $url';
    }
  }
}

Flutter没有内置的超链接支持，但您可以自己伪造它。画廊的抽屉里有个例子，飞镖。他们使用一个RichText小部件包含一个彩色的TextSpan，它有一个识别器属性来处理点击:

        RichText(
          text: TextSpan(
            children: [
              TextSpan(
                style: bodyTextStyle,
                text: seeSourceFirst,
              ),
              TextSpan(
                style: bodyTextStyle.copyWith(
                  color: colorScheme.primary,
                ),
                text: repoText,
                recognizer: TapGestureRecognizer()
                  ..onTap = () async {
                    final url = 'https://github.com/flutter/gallery/';
                    if (await canLaunch(url)) {
                      await launch(
                        url,
                        forceSafariVC: false,
                      );
                    }
                  },
              ),
              TextSpan(
                style: bodyTextStyle,
                text: seeSourceSecond,
              ),
            ],
          ),

只需将InkWell包装在Text小部件周围，并将UrlLauncher(来自服务库)提供给onTap属性。在下面使用UrlLauncher之前，将其安装为Flutter包。

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:url_launcher/url_launcher.dart';


void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('UrlLauncher'),
        ),
        body: new Center(
          child: new InkWell(
              child: new Text('Open Browser'),
              onTap: () => launch('https://docs.flutter.io/flutter/services/UrlLauncher-class.html')
          ),
        ),
      ),
    );
  }
}

您可以为Text小部件提供一个样式，使其看起来像一个链接。

更新

在研究了这个问题之后，我发现了一个不同的解决方案来实现你所要求的“在线”超链接。您可以使用RichText小部件与附带的textspan。

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:url_launcher/url_launcher.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: new Text('UrlLauchner'),
        ),
        body: new Center(
          child: new RichText(
            text: new TextSpan(
              children: [
                new TextSpan(
                  text: 'This is no Link, ',
                  style: new TextStyle(color: Colors.black),
                ),
                new TextSpan(
                  text: 'but this is',
                  style: new TextStyle(color: Colors.blue),
                  recognizer: new TapGestureRecognizer()
                    ..onTap = () { launch('https://docs.flutter.io/flutter/services/UrlLauncher-class.html');
                  },
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

这样你就可以突出显示一个单词，并从中创建一个超链接;)

这是一整套的钥匙 https://pub.dev/packages/link_text

child: LinkText(
  'Hello check http://google.com',
  textStyle: ...,
),

对于这种复杂性，使用库更安全

优点:

作为单个参数接受整个字符串 解析链接并将其呈现为可点击的UI，与不可点击的文本内联 不需要复杂的RichText结构

如果你想让它看起来更像一个链接，你可以添加下划线:

new Text("Hello Flutter!", style: new TextStyle(color: Colors.blue, decoration: TextDecoration.underline),)

结果是:

更新(Android >= 11):

iOS configuration: Open info.plist file and add: <key>LSApplicationQueriesSchemes</key> <array> <string>https</string> </array> Android configuration: Open AndroidManifest.xml file located in app/src/main and add the following at the root: <manifest xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Add this query --> <queries> <intent> <action android:name="android.intent.action.VIEW" /> <data android:scheme="https" /> </intent> </queries> <application ... /> </manifest>

颤振代码:

简单地包装你的文本在一个手势探测器或InkWell和处理点击在onTap()使用url_launcher包。

InkWell(
  onTap: () => launchUrl(Uri.parse('https://www.google.com')),
  child: Text(
    'Click here',
    style: TextStyle(decoration: TextDecoration.underline, color: Colors.blue),
  ),
)

截图: