TextButton onpressed() 不适用于颤振答案

【问题标题】：TextButton onpress() not working om flutterTextButton onpressed() 不适用于颤振
【发布时间】：2021-08-07 10:05:26
【问题描述】：

所以我尝试通过一个 Textbutton 将颤动的 2 个屏幕链接在一起，但它不起作用。

这是我的文本按钮代码：

TextButton(
                child: Text(
                  "New Page",
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                style: TextButton.styleFrom(
                  backgroundColor: Colors.purple,
                ),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => SecondPage()),
                  );
                },
              ),

按钮本身正确显示和显示，但是当我按下按钮时，我会在调试控制台上看到它并且屏幕保持不变。

调试控制台：

#3      MyApp.build.<anonymous closure>
package:layoutesting/main.dart:48
#4      _InkResponseState._handleTap
package:flutter/…/material/ink_well.dart:991
...
Handler: "onTap"
Recognizer: TapGestureRecognizer#f8109
    debugOwner: GestureDetector
    state: possible
    won arena
    finalPosition: Offset(218.4, 512.8)
    finalLocalPosition: Offset(42.4, 10.8)
    button: 1
    sent tap down

这也是我的第二个屏幕的代码。（直接来自颤振网站）：

class SecondPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Route"),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go back!'),
        ),
      ),
    );
  }
}

感谢您的帮助，（顺便说一句，我的两个页面都是无状态小部件）。

谢谢！

（完整的第一个小部件代码）：

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.teal,
        body: SafeArea(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 100,
                color: Colors.red,
                height: 792,
              ),
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.yellow,
                  ),
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.green,
                  ),
                  TextButton(
                    child: Text(
                      "New Page",
                      style: TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    style: TextButton.styleFrom(
                      backgroundColor: Colors.purple,
                    ),
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => SecondPage()),
                      );
                    },
                  ),
                ],
              ),
              Container(
                width: 100,
                color: Colors.blue,
                height: 792,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

【问题讨论】：

您好。问题可能在您的第一个小部件中。发布它的完整代码。由于我使用了您在此处发布的部件并且它工作得很好。

标签： flutter dart flutter-layout

【解决方案1】：

这是因为您用于Navigator.push(context,...) 的context 在您的MaterialApp 小部件上方，并且不包含对Navigator 的引用，因为导航器是由MaterialApp 设置的。

您需要一个位于MaterialApp 下的新context 才能找到您的Navigator。

要么将您的 Scaffold 包装在 Builder 小部件中以获得新的上下文，要么创建一个新的单独的 FirstWidget。

方法一：生成器

home: Builder(
  builder: (ctx) => Scaffold(
    ...,
    TextButton(
      ...,
      onPressed: (){
        Navigator.push(ctx,...); //<-- Use the new ctx from Builder
      }
    ),
  ),  
),

方法二：新建小部件（首选）

class FirstWidget extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return Scaffold(...);
}

然后在home 参数中使用这个：

MaterialApp(
  home: FirstWidget(),
)

【讨论】：