大家好，欢迎来到IT知识分享网。

本头条核心宗旨

欢迎来到技术刚刚好头条，本头条是个人维护，每天至少更新一篇Flutter技术文章，实时为大家播报Flutter最新消息。如果你刚好也在关注Flutter这门技术，那就跟我一起学习进步吧，你的赞，收藏，转发是对我个人最大的支持，维护不易，欢迎关注。

技术刚刚好经历

近几年，移动端跨平台开发技术层出不穷，从Facebook家的ReactNative，到阿里家WEEX，前端技术在移动端跨平台开发中大展身手，技术刚刚好作为一名Android开发，经历了从Reactjs到Vuejs的不断学习。而在2018年，我们的主角变成了Flutter，这是Goolge开源的一个移动端跨平台解决方案，可以快速开发精美的移动App。希望跟大家一起学习，一起进步！

本篇文章中心思想

今天很高兴收到头条的图文原创功能，也感谢粉丝们的大力支持，接下来我会再接再厉，写更多关于Flutter的DEMO和学习笔记，

其实弹窗控件在Ios和Android客户端中都很常见，在Flutter中常用的AlertDialog、SimpleDialog和AboutDialog。而本文只介绍AlertDialog组件的用法 。在Flutter中你可以使用ShowDialog方法来显示这些Dialog。showDialog方法需要传入一个上下文对象和一个Widget对象。

惯例先看看gif的效果图吧

其实这么一个弹窗也是很容易实现的，但是对于新手来说还是的学习一下才知道，Flutter里面任何控件都是组件，这个弹窗也不例外是一个组件组成的。

大致结构如下

一个道理，程序的入口。一个无状态的组件框架StatelessWidget。运用到了MaterialApp是我们使用 Flutter开发中最常用的符合Material Design设计理念的入口Widget。

程序的入口

核心页面如下图

打开程序看到的一个按钮页面就是这个页面了，StatefulWidget，有一个有状态的组件，就是可以动态变化的组件。返回了一个showDialog组件，这个组件是怎么显示出来的了？请看核心页面2里面的红框。

核心页面1

是的就是这个页面的红框，有个FlatButton，的onPressed方法，当用户在屏幕点击之后就会执行这个方法，会创建createAlertDialog，也就是弹窗。

核心页面2

总结

今天就实现这些了，如果你有什么好的建议可以给我提，或则你希望我写什么样的教程也可以评论告诉我，学习是一件很累的事情，边学习边整理也是一种提升自己的方式，我的提升需要大家的监督，需要源码的可以评论我，因为很简单，所以暂时不放源码，需要的请call我。

谢谢观看技术刚刚好头条文章，本头条是个人维护，每天至少更新一篇Flutter技术文章，实时为大家播报Flutter最新消息。如果你刚好也在关注Flutter这门技术，那就跟我一起学习进步吧，你的赞，收藏，转发是对我个人最大的支持，维护不易，欢迎关注。