web-dev-qa-db-ja.com

パーマネントパーシステントボトムシートフラッター

コードから閉じるまで、一番下のシートを画面に表示したままにします。通常、一番下のシートは、戻るボタン（デバイスまたはアプリバー）を押すか、下向きのジェスチャーで閉じることができます。どうすればそれを無効にできますか？

_scaffoldKey.currentState
        .showBottomSheet<Null>((BuildContext context) {
      final ThemeData themeData = Theme.of(context);
      return new ControlBottom(
        songName: songName,
        url: url,
        play: play,
        pause: pause,
        state: test,
        themeData: themeData,
      );
    }).closed.whenComplete((){

    });

コントロールボタンは別のウィジェットです。

flutterbottom-sheetflutter-layout
4
Ayush Singh

Scaffoldにボトムシートの引数が追加され、画面を下にスワイプしてこのボトムシートを閉じることはできません。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(....),
        bottomSheet: Container(
            body: Text('Hello World'),
        ),
    );
  }
2
Ayush Singh

また、WillPopScopeウィジェットを使用して、戻るボタンを押すことを制御することもできます。

Widget _buildBottomSheet() {
    return WillPopScope(
        onWillPop: () {
            **here you can handle back button pressing. Just leave it empty to disable back button**
        },
        child: **your bottom sheet**
        )),
    );
}
1
Artem Getman

containerプロパティに空のleadingを指定すると、appbarの戻るボタンを削除できます。

AppBar(
  leading: Container(),
);

ただし、デバイスの戻るボタンを制御することはできず、戻るとボトムシートが消えます。
多くの代替アプローチの1つは、stackとpositionedおよびopacityウィジェットを使用することです。

例：

Stack(
  children: <Widget>[
  // your code here
    Positioned(
      left: 0.0,
      right: 0.0,
      bottom: 0.0,
      child: Opacity(
        opacity: _opacityLevel,
        child: Card(
          child: //Your Code Here,
        ),
      ),
    ),
  // your code here
  ],
);

あなたになら変えられる _opacityLevel曲を選択した場合は0.0から1.0まで。

私があなたのコードから理解できることから、あなたは上部にlistViewを、下部に音楽コントロールを持っているということです。 listViewの最後にPaddingを追加して、最後までスクロールしたときに最後のリストアイテムがミュージックコントローラーカードの後ろに隠れないようにしてください。

音楽コントローラーのルックアンドフィールをさらにカスタマイズしたい場合。 animationControllerまたはsizeAnimationを使用して、bottomSheetのように下からスライドさせることができます。

これがお役に立てば幸いです。

1
Ashutosh