Question

我只想在按下按钮时显示小部件，然后一秒钟后它消失

我正在尝试使用Opacity Widget这样的东西：

double _woofOp = 0.0;

  void hideImg(){
    Duration(seconds: 1);
    setState(() {
      _woofOp = 0.0;
    });
  }
  void playAudio() {
    setState(() {
      _woofOp = 1.0;
      playBark.play('DogWoof.mp3');
    });
    hideImg();
  }

和小部件：

Opacity(
        opacity: _woofOp,
        child: Image.asset('images/woof-png.png',
        width: 80.0,
        ),
)

但是通过使用它什么也没发生，（但是音频在同一功能中起作用）不知道为什么吗？

或任何想法我该如何使用其他方式？我只是一个学习者。谢谢

Answer 1

您可以使用OverlayEntry进行此操作。

您应该从小部件中调用此方法：

 static void showToast({
    @required BuildContext context,
  }) {

    OverlayEntry overlayEntry;

    overlayEntry = OverlayEntry(
        builder: (context) => ToastWidget(
        )
    );
    Overlay.of(context).insert(overlayEntry);
    Timer(Duration(seconds: 1), () =>  overlayEntry.remove());

  }

toast_widget.dart：

class ToastWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Positioned(
      top: 100.0,
      width: MediaQuery.of(context).size.width - 20,
      left: 10,

      child: Material(
        color: Colors.blue,
        elevation: 10.0,
        borderRadius: BorderRadius.circular(10),
        child: Text('Hello from toast'),
      ),
    );
  }
}

这是非常简单的实现，没有样式或动画之类的美化，但是您可以根据需要自定义它。

此外，您可以查看此有用的指南：https://medium.com/@Mak95/how-to-make-custom-toast-messages-in-flutter-9799ef3239b7

我如何只显示小部件一秒钟，然后在Flutter中再次将其隐藏

1 个答案: