flutter 上的模態底頁，具有交互式背景

Question

我想在底部表打開時使背景變暗（灰色），就像模態底部表一樣，但在底部表打開時仍然能夠與 UI 的 rest 交互 - 就像普通的底部表一樣。 有任何想法嗎？

Answer 1

盡管如此，我不建議創建這樣的效果，因為從用戶的角度來看它不是很容易理解。

您可以通過使用IgnorePointer 、 Stack和setState((){})來實現這一點

1-添加一個字段bool showOverlay = false ;

2- Align一些Container與Alignment.bottom對齊以表示您的底頁

3- 放置一些具有一些背景顏色和不透明度的覆蓋Container ，並用IgnorePointer(ignoring: true, ...)將其包裹起來，這樣它就不會干擾下面的小部件。

我想你是從這里得到的。

Answer 2

我想接受這個想法，因為我面臨着同樣的“問題”或願望。 我想最小化 ModalBottomSheet 以便用戶可以在后台查找內容。 就像在 iOS 的郵件中一樣，在創建新的 email 時。 到目前為止，我創建了一個按鈕，它從 DraggableScrollableSheet 設置 initialChildsize 的 state：

InkWell(
    onTap: () {
      setState(() {
        double value = 1 - ((MediaQuery.of(context).size.height - 50) / MediaQuery.of(context).size.height);
        if (initialChildSize == 0.9) {
          minChildSize = 0.01;
          initialChildSize = value;
        } else {
          minChildSize = 0.4;
          initialChildSize = 0.9;
        }
      });
    },

從這里開始，我被困住了。 只有當工作表處於其最小 position 時，我才想設置指針和屏障顏色。

如何從 DraggableScrollableSheet 中訪問 showModalBottomSheet 和 Pointer？