时间戳

首页 > 解决方案 > 不可点击的 FloatActionButton

android - 不可点击的 FloatActionButton

问题描述

我有一个包含 3 个 FloatActionButton-s 的自定义小部件，但我不明白为什么我的第 3 个 FAB 没有在整个区域上按下，只有当我单击此按钮的底部时才会触发 onPressed。

MyState 构建方法：

Widget build(BuildContext context) {
    return new Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: <Widget>[
        Transform(
          transform: Matrix4.translationValues(
            0.0,
            _translateButton.value * 2.0,
            0.0,
          ),
          child: edit(),
        ),
        Transform(
          transform: Matrix4.translationValues(
            0.0,
            _translateButton.value,
            0.0,
          ),
          child: delete(),
        ),
        add(),
      ],
    );
  }

编辑按钮 - 具有与其他 2 个按钮类似的代码，但仅在单击此按钮时才会出现问题：

Widget edit() {
    return Visibility(
      visible: _editButtonVisible,
      child: FloatingActionButton(
        backgroundColor: Colors.blueGrey,
        heroTag: 'edit',
        onPressed: () {
          print('edit');
        },
        tooltip: 'Image',
        child: Icon(Icons.edit),
      ),
    );
  }

这是我的动画，也是我感兴趣的一点——end例如，如果我将 更改为 -4，它将减少 FAB 之间的空间，并且我的按钮将在整个区域上可点击。

_translateButton = Tween<double>(
      begin: _fabHeight,
      end: -14.0,
    ).animate(CurvedAnimation(
      parent: _animationController,
      curve: Interval(
        0.0,
        0.75,
        curve: _curve,
      ),
    ));

所以我认为可能原因是列的大小？左图有坏的工作按钮，右图是稳定的。

标签： androiddartflutter

解决方案

他们是解决您问题的两种方法。1）如果您在屏幕截图中找到的列表中只有四个元素，那么您可以使用列属性 mainAxisSize = MainAxisSize.min

2）使用堆栈小部件

推荐阅读