Flutter 路由不响应 onClick

Question

我创建了一个卡片组件，其中包含图标、文本和 pressn 作为卡片组件内的参数。 pressn代表路线。除了代表路线小部件的 pressn 小部件外，所有其他小部件都在工作。

我是否应该将任何取消单击或标签功能分配给 pressn？

下面是代码

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:api_example_app/constants.dart';
import 'package:flutter/widgets.dart';

class CardsParent extends StatefulWidget {
  const CardsParent({
    Key key,
    @required this.size,
    this.icon,
    this.title,
    this.subtitle,
    this.pressn,
  }) : super(key: key);

  final Size size;
  final IconData icon;
  final String title;
  final String subtitle;
  final GestureTapCallback pressn;

  @override
  _CardsParentState createState() => _CardsParentState();
}

class _CardsParentState extends State<CardsParent> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 140,
      height: 100,
      child: Card(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(15.0),
        ),
        color: Colors.white,
        elevation: 10,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            ListTile(
              leading: Icon(
                widget.icon,
                size: 50,
                color: kOrangeColor,
              ),
              title: Text(widget.title,
                  style: TextStyle(fontSize: 14.0, color: kOrangeColor)),
              subtitle: Text(widget.subtitle,
                  style: TextStyle(fontSize: 11.0, color: kOrangeColor)),
            ),
          ],
        ),
      ),
    );
  }
}

下面是我想使用代码的地方，我通过 pressn 来表示导航器。

 Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                CardsParent(
                  size: size,
                  icon: FontAwesomeIcons.temperatureHigh,
                  title: 'Tem',
                  subtitle: '33C',
                  pressn: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                        builder: (context) => TemSensorScreen(),
                      ),
                    );
                  },
                ),
                CardsParent(
                  size: size,
                  title: 'Hum ',
                  subtitle: '75%',
                  icon: FontAwesomeIcons.cloudShowersHeavy,
                 pressn: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                        builder: (context) => HumSensorScreen(),
                      ),
                    );
                  },
                ),
              ],
            ),

我做错了什么？

Answer 1

您忘记使用 GestureDetector。

return GestureDetector(
  onTap: pressn,
  child: Container(
    width: 140,
    height: 100,
    child: Card(),
  ),
)

Answer 2

您的代码中存在几个问题：

在当前情况下，当您调用 onTap 时，它将始终 return 空值并且您的 GestureDetector 不会响应触摸。所以去掉下面的代码：

get onTap => null; // Remove this

您需要将 widget.onTap 传递给您的手势检测器（不是 onTap）：

@override
Widget build(BuildContext context) {
   return GestureDetector(
      onTap: widget.onTap, // Change is here
      child: Container(
          // Remaining Code
      ),
   );
}

Flutter 路由不响应 onClick

Flutter Route Not Responding onClick

routes

flutter

flutter-routes