flutter - 如何在 Flutter 中点击卡片打开另一个页面

Question

嘿，伙计，我正在开发一个主页上有 3 张卡片的应用程序，我希望每张卡片根据每张卡片的 ID 转到不同的页面，例如数学卡片，我想让它去转到 MathHomePage 和科学卡 我希望它转到 ScienceHomePage 这是我的代码:

import 'package:appname/model/Topic.dart';

class TopicDao {

  static final List<Topic> topics = [
    const Topic(
      id: "1",
      name: "Math",
      image: "assets/img/math.png",
    ),
    const Topic(
      id: "2",
      name: "Science",
      image: "assets/img/science.png",
    ),
    const Topic(
      id: "3",
      name: "English",
      image: "assets/img/english.png",
    ),

  ];





   //I think I can use this code somehow to make it go to the pages.
  static Topic getTopicById(id) {
    return topics
        .where((p) => p.id == id)
        .first;




  }






}

这是主题类:

class Topic {
  final String id;
  final String name;
  final String image;


  const Topic({this.id, this.name, this.image});


}

我对 Flutter 还是很陌生，所以任何帮助都会很棒!!!!

提前致谢:)

Answer 1

您可以使用导航器类 转到不同的页面
onTap: () {
导航器.push(
语境，
MaterialPageRoute(
构建器:(上下文)=> SecondScreen(id)，
));
}

如果您使用列表来呈现三张卡片，那么您可以使用它的 onTap() 方法并调用 nevigator 中的另一个类，并将基于的 ID 传递给它您可以显示不同的页面。
更多信息: https://flutter.dev/docs/cookbook/navigation/navigation-basics