使用onTap函数从卡片导航到新页面时出错

Question

总的来说，我对颤振和编码非常陌生。我想创建一个应用程序来帮助药理学课程。中心的问题是，我想点击一张卡片，这张卡将带我到一个新的页面。但是，当我编写函数时，它会被返回一个错误。我找不到错误在哪里。有谁可以帮我？

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Farmacologia Odontológica',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: const Splash(),
    );
  }
}

class Splash extends StatefulWidget {
  const Splash({Key? key}) : super(key: key);

  @override
  State<Splash> createState() => _SplashState();
}

class _SplashState extends State<Splash> {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    Future.delayed(const Duration(seconds: 2), () {
      Navigator.pushReplacement(
          context, MaterialPageRoute(builder: (context) => const HomePage()));
    });
  }
   @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.teal,
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Image.asset('icons/Pilulas.png', height: 230,width: 230,),
            const SizedBox(height: 30,),
            if (Platform.isIOS)
              const CupertinoActivityIndicator(
                radius: 15,
              )
            else
              const CircularProgressIndicator(
                color: Colors.white,
              )
          ],
        ),
      ),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(

        backgroundColor: Colors.teal,
        centerTitle: true,
        title: Text('Farmacologia Odontológica',style: TextStyle(
          fontFamily: 'fonts/Quicksand-Light.ttf',
          fontSize: 22,

        ),),
      ),
      body: Container(
        child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Padding(padding: const EdgeInsets.only(top:10,bottom: 10),),
              Text('Classes de Medicamentos', textAlign: TextAlign.center,
                  style: TextStyle(
                    fontFamily: 'fonts/Quicksand-Medium.ttf',
                    fontSize: 18,
                  )),
             (GestureDetector(onTap: () => Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => analgesicos()),
              )
             ),
                child: const Material(
                  child: (
                      Card(
                        child: ListTile(
                          title: const Text('Analgésicos'),),)
                  ),
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Anti-inflamatórios'),
                      ),
                    )
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Antibióticos'),
                      ),
                    )
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Antifúngicos'),
                      ),
                    )
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Antivirais'),
                      ),
                    )
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Anti-histamínicos'),
                      ),
                    )
                ),
              ),
              const Material(
                child: (
                    Card(
                      child: ListTile(
                        title: const Text('Ansiolíticos'),
                      ),
                    )
                ),
              )
            ]
        ),
      ),

    );
  }
}

Answer 1

GestureDetector关闭时有一个括号问题，

 GestureDetector(
            onTap: () => Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => analgesicos(),
              ),
            ), // issue was here
            child: const Material(
              child: Card(
                child: ListTile(
                  title: const Text('Analgésicos'),
                ),
              ),
            ),
          ),

使用下面的片段

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.teal,
        centerTitle: true,
        title: Text(
          'Farmacologia Odontológica',
          style: TextStyle(
            fontFamily: 'fonts/Quicksand-Light.ttf',
            fontSize: 22,
          ),
        ),
      ),
      body: Container(
        child:
            Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
          Padding(
            padding: const EdgeInsets.only(top: 10, bottom: 10),
          ),
          Text('Classes de Medicamentos',
              textAlign: TextAlign.center,
              style: TextStyle(
                fontFamily: 'fonts/Quicksand-Medium.ttf',
                fontSize: 18,
              )),
          GestureDetector(
            onTap: () => Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => analgesicos(),
              ),
            ), // issue was here
            child: const Material(
              child: Card(
                child: ListTile(
                  title: const Text('Analgésicos'),
                ),
              ),
            ),
          ),
          GestureDetector(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => analgesicos(),
                ),
              );
            },
            child: Card(
              child: ListTile(
                title: const Text('Anti-inflamatórios'),
              ),
            ),
          ),
          InkWell(
            onLongPress: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => analgesicos(),
                ),
              );
            },
            child: Card(
              child: ListTile(
                title: const Text('Antibióticos'),
              ),
            ),
          ),
          Card(
            child: ListTile(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => analgesicos(),
                  ),
                );
              },
              title: const Text('Antifúngicos'),
            ),
          ),
          const Material(
            child: (Card(
              child: ListTile(
                title: const Text('Antivirais'),
              ),
            )),
          ),
          const Material(
            child: (Card(
              child: ListTile(
                title: const Text('Anti-histamínicos'),
              ),
            )),
          ),
          const Material(
            child: (Card(
              child: ListTile(
                title: const Text('Ansiolíticos'),
              ),
            )),
          )
        ]),
      ),
    );
  }
}

我已经包含了三种使用tap事件的方法

• GestureDetector
• InkWell
• ListTile's onTap