首页 > 解决方案 > 在 Flutter 中将图像超链接到 URL

问题描述

我有一张图片,点击后应该重定向到网页并在浏览器中打开。

这是我用于图像的代码,我有两张图像,一张是背景,第二张是我需要超链接 URL 的地方。

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("About the app"),
      ),
      body: new Container(
        decoration: new BoxDecoration(
          image: new DecorationImage(
            image: new AssetImage('images/upgradedbg.png'), // Background Image
            fit: BoxFit.cover,
          ),
        ),
        child: Padding(
          padding: const EdgeInsets.fromLTRB(8.0, 110.0, 8.0, 20.0),
          child: ListView(
            children: <Widget>[
              Image.asset(
                'images/madeby.png', // On click should redirect to an URL
                width: 400.0,
                height: 180.0,
                fit: BoxFit.cover,
              )
            ],
          ),
        ),
      ),
    );
  }

标签: flutter

解决方案


使用这个插件

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("About the app"),
      ),
      body: new Container(
        decoration: new BoxDecoration(
          image: new DecorationImage(
            image: new AssetImage('images/upgradedbg.png'), // Background Image
            fit: BoxFit.cover,
          ),
        ),
        child: Padding(
          padding: const EdgeInsets.fromLTRB(8.0, 110.0, 8.0, 20.0),
          child: ListView(
            children: <Widget>[
              GestureDetector(
                onTap: _launchURL,
                child: Image.asset(
                  'images/madeby.png', // On click should redirect to an URL
                  width: 400.0,
                  height: 180.0,
                  fit: BoxFit.cover,
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
  _launchURL() async {
    const url = 'https://flutter.io';
    if (await canLaunch(url)) {
      await launch(url);
    } else {
      throw 'Could not launch $url';
    }
  }

推荐阅读