我有一个ListView,我想让列表项可点击.我的 idea 是,当用户点击一个项目时,它将被定向到另一个页面.每个底部应该通向不同的屏幕.我在实施它时遇到了困难,我不知道使用ONTAP是什么.我该怎么办?我应该使用ListTile而不是ListView吗?

import 'package:flutter/material.dart';
import 'package:untitled1/PerformancePulses.dart';

void main() {
  runApp(MyApp());
}
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
          visualDensity: VisualDensity.adaptivePlatformDensity,
        ),
        home: ListViewHome()
    );

  }
}
class ListViewHome extends StatelessWidget {
  final titles = ["Performance Pulses",
     "Admin Indicator",];
  final icons = [Icons.arrow_forward_ios_outlined, Icons.arrow_forward_ios_outlined];
  @override
  Widget build(BuildContext context) {
    return ListView.builder(
        itemCount: titles.length,
        itemBuilder: (context, index) {
          return Card(
              child: ListTile(
                  title: Text(titles[index]),
                  leading: const CircleAvatar(
                      backgroundImage: NetworkImage(
                          "https://wcs.smartdraw.com/chart/img/basic-bar-graph.png?bn=15100111840")),
                  trailing: Icon(icons[index])));
        });

  }
}

推荐答案

您需要在卡上添加点击监听程序,然后导航到您想要的屏幕

样本

   import 'package:flutter/material.dart';
   import 'package:untitled1/PerformancePulses.dart';

   void main() {
     runApp(MyApp());
   }
 class MyApp extends StatelessWidget {
  // This widget is the root of your application.
 @override
 Widget build(BuildContext context) {
   return MaterialApp(
    title: 'Flutter Demo',
    theme: ThemeData(
      primarySwatch: Colors.blue,
      visualDensity: VisualDensity.adaptivePlatformDensity,
    ),
    home: ListViewHome()
  );

    }
  }
class ListViewHome extends StatelessWidget {
  final titles = ["Performance Pulses",
 "Admin Indicator",];
 final icons = [Icons.arrow_forward_ios_outlined, 
 Icons.arrow_forward_ios_outlined];
 @override
 Widget build(BuildContext context) {
   return ListView.builder(
     itemCount: titles.length,
     itemBuilder: (context, index) {

      return InkWell(
        onTap: (){
          //this is where you navigate to new screen
          // SecondScreen() should be name of the second screen you created
          Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => const SecondScreen(
              
            )),
          );
        },
        child: Card(
            child: ListTile(
                title: Text(titles[index]),
                leading: const CircleAvatar(
                    backgroundImage: NetworkImage(
                        "https://wcs.smartdraw.com/chart/img/basic-bar-graph.png?bn=15100111840")),
                trailing: Icon(icons[index]))),
      );
    });

   }
 }

Flutter相关问答推荐

Cupertino Buttino SheetAction on按下可触发加载指示器,然后勾选并延迟

如果文档确实存在,则FiRestore将";False";返回到";if-Document-Existes";...还是我说错了?

在创建肘部并使用冻结时,无法使用中的Copy With方法

CMakeLists.txt处的CMake错误:3(项目)找不到指定的Visual Studio实例

如何在应用程序中使用Fflight显示表情包

分页控制器在到达页面末尾之前或在初始化页面时对每个索引调用API

Flutter /dart 列表.第一个子类列表中的Where()错误

使用持久的侧边菜单和顶部栏在Ffltter Web应用程序中的页面之间导航

Flutter Web Dio XMLHttpRequest 上传大文件时出错

Flutter - Riverpod 2.0 - 如何访问 onDispose 回调?

运行任何 flutter 命令都会显示无法安装 <版本>

Flutter:使用 GlobalKey 访问 BlocProvider

Flutter:如何在现有布局之上显示圆角布局?

将状态维护到 asyncNotifier

从子类调用超类的超方法

在 Dart 中使用隔离时访问外部范围内的变量

无法将参数类型Future Function(String?)分配给参数类型void Function(NotificationResponse)?

避免长单词中断

使用 onPressed 切换到另一个屏幕无法正常工作

构建失败 - 无法解析 io.grpc:grpc-core:[1.28.0]. (是的,我已经升级到 mavenCentral())