Question

我正在使用WebviewScaffold。它运作良好，但现在我想在向上滚动时隐藏BottomNavigationBar和AppBar。向下滚动时应显示AppBar和BottomNavigationBar。就像它在iOS上的Chrome中一样。

我知道我不能使用Sliver，因为 “警告：Web视图未集成在小部件树中，它是在Flutter视图之上的本机视图。您将无法使用小吃店，对话框...”

如果有人可以帮助我，那将是很好。预先感谢！

Answer 1

我找到了如何获取ScrollParams。...但是现在我必须隐藏/显示AppBar和BottomNavigationBar。

@override
void initState() {
// TODO: implement initState
  super.initState();
   _onScrollYChanged =
    flutterWebViewPlugin.onScrollYChanged.listen((double x) {
  if (mounted) {
    print(_onScrollYChanged.toString());

    setState(() {
      if (_posY < x) {
        _showBar = false;
        print("DOWN");
      } else {
        _showBar = true;
        print("UP");
      }
      _posY = x;
      print("Scroll in Y Direction: $x");
    });
  }
});

}

我在APP中的构建看起来像这样：

@override
Widget build(BuildContext context) {
  return WebviewScaffold(
    url: "https://www.domain.de",
    appBar: AppBar(
      toolbarOpacity: _showBar ? 1.0 : 0.0,
      title: const Text('Widget WebView'),
      leading: IconButton(
        icon: Icon(Icons.apps),
        onPressed: () {
          flutterWebViewPlugin.goBack();
        },
      ),

    ),
    bottomNavigationBar: BottomAppBar(
      color: Colors.blue,
      child: Row(
        children: <Widget>[
          IconButton(
            icon: const Icon(Icons.arrow_back_ios),
            onPressed: () {
              flutterWebViewPlugin.goBack();
            },
          ),
        ],
      ),
    ),
    withZoom: true,
    withLocalStorage: true,
    hidden: true,
    headers: _HTMLheaders,
  );
}
}

Flutter / flutter_webview_plugin =>在上/下滚动时隐藏/显示AppBar + BottomNavigationBar

1 个答案: