学习Flutter：Hello Word篇

Hello Word篇

---

---

前言

随着互联网的不断发展，开发原生APP的成本越来越高，跨平台的框架也越来越多了，而且越来越多人都开启了学习跨平台开发了，由于Flutter的跨平台性、运行的流畅性和无限接近原生APP开发，本文就介绍了Flutter基础开发。

---

提示：接上一篇我们搭建Flutter环境，接下来的是我们就来开发Flutter第一步，伟大的Hello Word

一、选择开发工具

什么是开发工具：简称IDE，一般是指一些被软件工程师用于为特定的软件包、软件框架、硬件平台、操作系统等建立应用软件的特殊软件。我常用的前端有：Visual Studio Code（vs code），WebStorm，HBuilder X（这个是uniapp开发的工具，也是跨平台开发的），PyCharm（这是开发Python用的），Android studio（这是开发安卓用的）等，后端：IntelliJ IDEA （这个是用的最普遍的），好的开发工具能提高效率。不过有些大牛就是用记事本开发的

Flutter开发工具有：

• Visual Studio Code（vs code）：免费
• IntelliJ IDEA ：收费
• Android studio：免费
• WebStorm：收费

二、Visual Studio Code（vs code）开发工具Flutter配置

在这里选择Visual Studio Code（vs code)原因是：轻量级开发工具，打开速度快，占内存少，插件库比较全，最终要的免费

安装

1.下载链接：https://code.visualstudio.com/Download
2. 安装软件：这里就不多说了，下载后双击之后，下一步下一步就好了，安装好如图：

3. 安装插件：如图
   

下面就是查找插件和安装：只要在输入框输入flutter,就会出现的，然后点击对应插件安装就可以了

三、创建Flutter项目

在VScode上打开打开终端（菜单上有个终端，点击新建就可以了）或者快捷键：Ctrl+~（Tab上一个键），在终端上输入：flutter create 项目名字，即可创建完成！如图

四、运行Flutter项目

• 在终端中运行命令：flutter run，红框里显示的是安装的位置：模拟器，手机，谷歌浏览器，我的有多个，输入数字选择就可以了，有的只要一个就不需要选择 如图
  
• 这是显示在模拟器上的：
  
• 这是显示在浏览器上的：
  
• 这是显示在手机真机上的：

五、安装模拟器

• 打开Android studio
  
• 点击AVD Manager

• 点击红框按钮
  

• 选择红框里，然后点击next按钮
  

• 有出现Download的，要先下载，然后点击next按钮
  

• 然后点finish按钮就可以了
  

• 最后点击右边三角按钮，然后等待模拟器开机，不过时间有点久
  

• 这样就好了

六、最后显示Hello Word

该处使用的url网络请求的数据。

---

总结

今天的hello word显示就到这里，希望能帮助到你们，如果对你们有帮助的话，给个一键三连，再次感谢