首页 > 解决方案 > 为什么 onTap 和其中的函数在 InkWell 中不起作用?

问题描述

点击 ListWheelScrollView 时,我试图打开链接,但它不起作用。它甚至没有进入 OnTap

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

class News extends StatefulWidget {
  final Map news;

  @override
  _NewsState createState() => _NewsState();

  const News({Key key, this.news}) : super(key: key);
}

class _NewsState extends State<News> {
  Map test;
  double textPadding = 290;

  // ignore: non_constant_identifier_names
  @override
  void initState() {
    super.initState();
  }

  launchURL(String url) async {
    if (await canLaunch(url)) {
      await launch(url, forceWebView: true);
    } else {
      throw 'Could not launch $url';
    }
  }

  @override
  Widget build(BuildContext context) {
    test = (ModalRoute.of(context).settings.arguments);
    var fixedTest = test['data'].news4today;

    checkUrls() {
      for (int i = 0; i < fixedTest.length; i++) {
        if (fixedTest[i]['urlToImage'] == null ||
            !isURL(fixedTest[i]['urlToImage'])) {
          fixedTest[i]['urlToImage'] =
              'https://i.pinimg.com/originals/8a/eb/d8/8aebd875fbddd22bf3971c3a7159bdc7.png';
        }
        if (fixedTest[i]['url'] == null || !isURL(fixedTest[i]['url'])) {
          fixedTest[i]['url'] = 'https://google.com';
        }
      }
    }

    checkUrls();

    return Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          title: Center(child: Text('News')),
          backgroundColor: Colors.deepPurpleAccent,
        ),
        body: ListWheelScrollView.useDelegate(
            itemExtent: 400,
            diameterRatio: 9,
            squeeze: 1.2,
            physics: BouncingScrollPhysics(),
            onSelectedItemChanged: (index) {
              // debugPrint(index.toString());
            },
            childDelegate: ListWheelChildBuilderDelegate(
                childCount: 100,
                builder: (context, index) => Container(
                      child: Stack(
                        alignment: Alignment.topCenter,
                        children: <Widget>[
                          Material(
                            child: InkWell(
                              onDoubleTap: () {
                                launchURL(fixedTest[index]['urlToImage']);
                              },
                              child: Container(
                                height: 353.0,
                                decoration: BoxDecoration(
                                  image: DecorationImage(
                                      fit: BoxFit.scaleDown,
                                      alignment: FractionalOffset.center,
                                      image: NetworkImage(
                                          fixedTest[index]['urlToImage'])),
                                ),
                              ),
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(top: 285),
                            child: Padding(
                              padding: const EdgeInsets.all(10),
                              child: SizedBox(
                                  child: Text(
                                fixedTest[index]['title'],
                                style: TextStyle(fontSize: 16),
                                maxLines: 4,
                                textAlign: TextAlign.center,
                              )),
                            ),
                            decoration: BoxDecoration(
                              color: Colors.purple[100],
                              boxShadow: [
                                BoxShadow(
                                  color: Colors.grey.withOpacity(0.8),
                                  spreadRadius: 1,
                                  blurRadius: 3,
                                  offset: Offset(1, 1),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                    ))));
  }
}

我试图用 Ink 删除容器,但如果我这样做,它会因为文本边距而破坏应用程序。也试过onDoubleTap。

标签: flutterflutter-layoutflutter-web

解决方案


InkWell必须有Material父母。包裹你InkWellMaterial小部件。请参阅InkWell 文档。此外,如果launchURL(fixedTest[index]['url'])是一个异步函数,您必须使用await此函数暂停您的应用程序直到完成。


推荐阅读