首页 > 解决方案 > 好奇为什么我的 onPressed 函数在调试模式下无法正常工作

问题描述

我正在尝试在 onPressed 方法中实现简单的底部工作表

这是我的代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class LoginScreen extends StatelessWidget {
  void _onButtonPressed(BuildContext context) {
    showModalBottomSheet(
        context: context,
        builder: (context) => new Column(
              children: [
                new Container(
                  child: Text('Hello'),
                )
              ],
            ));
  }

  @override
  Widget build(BuildContext context) => new Scaffold(
        body: new RaisedButton(
          onPressed: () => _onButtonPressed(context),
          child: Text('Hello'),
        ),
      );
}

因此,每当我将 flutterMode 设置为启动文件调试模式时,它都会在我单击按钮时向我显示异常

'package:flutter/src/widgets/navigator.dart': Failed assertion: line 3524 pos 12: '!_debugLocked': is not true.

但是当我在配置文件或发布模式下构建我的应用程序时,底部工作表就像一个魅力。这是有什么具体原因吗?

因为我有另一个页面也实现了底部工作表,但它适用于任何模式。

刚刚在android studio上构建了这个应用程序

════════ Exception caught by gesture ═══════════════════════════════════════════════════════════════
The following assertion was thrown while handling a gesture:
'package:flutter/src/widgets/navigator.dart': Failed assertion: line 3524 pos 12: '!_debugLocked': is not true.


Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
  https://github.com/flutter/flutter/issues/new?template=BUG.md

When the exception was thrown, this was the stack: 
#2      NavigatorState.push (package:flutter/src/widgets/navigator.dart:3524:12)
#3      showModalBottomSheet (package:flutter/src/material/bottom_sheet.dart:667:65)
#4      _LoginScreen._onButtonPressed (package:mahayoga_admin/loginScreen.dart:10:5)
#5      _LoginScreen.build.<anonymous closure> (package:mahayoga_admin/loginScreen.dart:29:53)
#6      _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:993:19)
...
Handler: "onTap"
Recognizer: TapGestureRecognizer#095ab
  debugOwner: GestureDetector
  state: possible
  won arena
  finalPosition: Offset(18.8, 44.1)
  finalLocalPosition: Offset(44.0, 18.0)
  button: 1
  sent tap down
════════════════════════════════════════════════════════════════════════════════════════════════════

所以我改变了我的代码是这样的

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mahayoga_admin/bottomSheetDrawer.dart';

class LoginScreen extends StatefulWidget {
  State<StatefulWidget> createState() => _LoginScreen();
}

class _LoginScreen extends State<LoginScreen> {
  void _onButtonPressed(BuildContext context) {
    showModalBottomSheet(
        context: context,
        builder: (context) => SingleChildScrollView(
          child: Container(
            padding: EdgeInsets.only(
              bottom: MediaQuery.of(context).viewInsets.bottom,
            ),
            child: new Container(
              child: Text("Hello world"),
            ),
          ),
        ));
  }

  @override
  Widget build(BuildContext context) => new Scaffold(
      body: new Container(
          height: MediaQuery.of(context).size.height,
          child: SingleChildScrollView(
            child: new Container(
              child: Column(
                children: [
                  new RaisedButton(onPressed: () => _onButtonPressed(context))
                ],
              ),
            ),
          )));
}

标签: flutterflutter-layout

解决方案


要解决这个问题,只需将其包装在 Container 中并将高度设置为屏幕最大高度,如下所示:

@override
  Widget build(BuildContext context) {
    return Container(
      height: MediaQuery.of(context).size.height,
      child: SingleChildScrollView(
        child: ... //You can then have a column warped within a container(height specified)....after that under column use the raised button
      ),
    ),
  }

推荐阅读