Добавьте эффект тумана за FAB во Flutter

Как я могу добавить эффект тумана за FAB? Я попытался добиться этого с помощью BottomAppBar, но BottomAppBar не принимает прозрачный цвет в LinearGradient. Я также пытался уменьшить непрозрачность фона BottomAppBar, но он тоже не работает

ожидается

Widget build(BuildContext context) {
    return Scaffold(
      body: _myListView(context),
      bottomNavigationBar: BottomAppBar(
        child: Container(
          height: MediaQuery.of(context).size.height/10,
          decoration: BoxDecoration(
            gradient: LinearGradient(colors: [Colors.transparent,Colors.white],
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter
            )
          ),
          child: MyFloatingActionButton(),
      ),
    ),
  );
}

выход

1 ответ

Мне удалось решить проблему с помощью Stack

Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          _myListView(context),
          Positioned(child:
            Container(
              padding: EdgeInsets.all(5.0),
              alignment: Alignment.bottomCenter,
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: <Color>[
                    Colors.white.withAlpha(0),
                    Colors.white12,
                    Colors.white70
                  ],
                ),
              ),
              child: MyFloatingActionButton(),
            ),
            bottom: 0,
            top: MediaQuery.of(context).size.height/1.5,
            width: MediaQuery.of(context).size.width,
          ),

        ],
      ),
    );
  }
Другие вопросы по тегам