我的 Flutter 课程中的语法错误和代码逻辑问题

Question

我正在学习 Flutter 课程并遇到了一些语法错误。我怀疑课程材料可能已经过时，因为我必须修改一些代码才能使其正常工作。我担心这些更改可能会带来意想不到的后果，影响代码的逻辑或流程。您能否澄清一下这是否是一个问题？

示例代码：

import 'package:flutter/material.dart';

class ReusableCard extends StatelessWidget {
  ReusableCard({@required this.colour, this.cardChild, this.onPress});

  final Color colour;
  final Widget cardChild;
  final Function onPress;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onPress,
      child: Container(
        child: cardChild,
        margin: EdgeInsets.all(15.0),
        decoration: BoxDecoration(
          color: colour,
          borderRadius: BorderRadius.circular(10.0),
        ),
      ),
    );
  }
}

我更改并修复的代码：

import 'package:flutter/material.dart';

class ChangeableCard extends StatelessWidget {
  ChangeableCard(
      {required this.color,
      this.cardChild,
      required this.onPressButton,
      super.key});
  final Color color;
  final Widget? cardChild;
  final Function() onPressButton;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onPressButton,
      child: Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(10),
          color: color,
        ),
        margin: const EdgeInsets.all(10.0),
        child: cardChild,
      ),
    );
  }
}

在代码中使用required而不是@required：

final Function() onPressButton; 

而不是

final Function onPress;

Answer 1

在

VoidCallback

中的

Function

处使用

onTap

代替

GestureDetector

，一切都会顺利进行。

import 'package:flutter/material.dart';

class ReusableCard extends StatelessWidget {
  ReusableCard({@required this.colour, this.cardChild, this.onPress});

  final Color colour;
  final Widget cardChild;
  final VoidCallback onPress;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onPress,
      child: Container(
        child: cardChild,
        margin: EdgeInsets.all(15.0),
        decoration: BoxDecoration(
          color: colour,
          borderRadius: BorderRadius.circular(10.0),
        ),
      ),
    );
  }
}