flutter - Flutter Flat Button在其可见边框之外可以单击

Question

问题:如果用户在其可见边框之外单击，我希望用户无法点击该按钮。
我创建了两个FlatButton，里面没有任何填充，问题是即使我在两个按钮之间点击，我的按钮仍然可以单击。
请向我解释为什么会这样？
如果需要，这是我的登录屏幕的代码:

class SignInPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final _googleSignIn = CustomFlatButton(text: 'Sign in with Google',);
    final _facebookSignIn = CustomFlatButton(text: 'Sign in with Facebook', color: Colors.blue[900], textColor: Colors.white, onTapColor: Colors.white30,);
    return Scaffold(
        backgroundColor: Colors.grey[100],
        appBar: AppBar(
          title: Text('Time Tracker'),
          centerTitle: true,
          elevation: 0.0,
        ),
        body: Container(
          padding: EdgeInsets.symmetric(vertical: 0.0, horizontal: 20),
          color: Colors.grey[200],
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                'Sign In',
                textAlign: TextAlign.center,
                style: TextStyle(
                  fontWeight: FontWeight.w500,
                  fontSize: 30,
                ),
              ),
              _googleSignIn,
              _facebookSignIn,
            ],
          ),
        ));
  }
}

这是我的自定义 FlatButton的代码:

class CustomFlatButton extends StatelessWidget {
  final String text;
  final Color color;
  final Color textColor;
  final Color onTapColor;
  CustomFlatButton(
      {this.text = 'Default sign in text', color, textColor, onTapColor})
      : textColor = textColor ?? Colors.grey[900],
        color = color ?? Colors.white70,
        onTapColor = onTapColor ?? ThemeData.light().splashColor;

  @override
  Widget build(BuildContext context) {
    return FlatButton(
      splashColor: onTapColor,
      onPressed: () {},
      child: Text(
        text,
        style: TextStyle(
          fontSize: 15,
          fontWeight: FontWeight.w400,
          color: textColor,
        ),
      ),
      color: color, //Colors.white70
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(Radius.circular(7)),
      ),
    );
  }
}

Answer 1

你需要做两件事

了解有关并将materialTapTargetSize: MaterialTapTargetSize.shrinkWrap添加到FlatButton

的信息

在按钮之间添加填充(例如，添加SizedBox(height:10))