Flutter Route 没有响应 onClick

问题描述

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

我是否想为pressn分配任何unClick或tab功能

下面是代码

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,],);
  }
}

下面是我想使用代码的地方,我通过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,MaterialPageRoute(
                        builder: (context) => HumSensorScreen(),

我做错了什么?

解决方法

您的代码中有几个问题:

  • 在当前场景中,当您调用 onTap 时,它将始终返回 null 值,并且您的 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
      ),);
}

,

您忘记使用 GestureDetector。

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