Flutter在Visual Studio Code上首次创建运行应用

一、创建Flutter应用

1、前提条件

安装Visual Studio Code并配置好运行环境

2、开始创建Flutter应用

1)、打开Visual Studio Code

2)、打开 View > Command Palette

3)、在搜索框中输入"flutter",弹出内容如下图所示,选择" Flutter: New Project",并点击Enter

4)、选择 Applocation,并点击Enter

5)、新建或选择新项目将存放的上层目录,。例如:"E:\zdmProject\FlutterHelloWord"

6)、输入项目名称,例如:my_flutter_helloword,并点击Enter

7)、等待项目创建完成,并且 main.dart 文件展现在编辑器中。

勾选后,开始创建应用。

这就是使用VS Code创建的Flutter项目。

提示:

1、每当创建一个新的 Flutter 应用时,一些 Flutter IDE 插件会请你输入一个类似 com.example 的包名,包名(在 iOS 里叫 Bundle ID)一般都是公司域名的反写。如果你的应用打算上架商店,建议一开始的时候把这个全网唯一的包名设置好,因为应用上架之后就不能再修改了。

2、应用程序的代码存放在"lib/main.dart "中。

二、运行应用APP

1、定位到Visual Studio Code的状态栏(窗口底部蓝色框)。

2、选择一个设备,如果没有连接真机,可以使用模拟器。


3、运行 Run > Start Debugging 或按下**F5。(在 VS Code terminal 中运行命令:** flutter run
4、等待应用启动------启动进度会在 Debug Console 中展示。

注意:

在windiws电脑上不能直接build iOS app,这种限制来自Apple,非 Flutter。只有 Mac 系统才能 build iOS app,但 Windows 可以 build Android app。

相关推荐
Endeavour_T4 分钟前
ECharts图表怎么做自适应?
前端·echarts
bo521004 分钟前
浏览器缓存优先级
前端·面试·浏览器
namehu4 分钟前
浏览器中的扫码枪:从需求到踩坑再到优雅解决
前端·react.js
opbr6 分钟前
🚫🔨 不用重构!教你用 Vue3 + TSX 🧹优雅收纳后台页面一堆操作按钮
前端·vue.js
Zender Han8 分钟前
Flutter 进阶:实现带圆角的 CircularProgressIndicator
flutter
G等你下课11 分钟前
使用 Cookie 实现登录登出功能案例
前端·后端
西瓜树枝16 分钟前
antd vue全局自定义样式前缀实践
前端·vue.js
前端进阶者17 分钟前
地图坐标系转换JS库
前端·javascript
蛙哇17 分钟前
Pinia 核心源码简易实现
前端
飞天牛牛17 分钟前
Shell 脚本里 nvm 不识别,node 却能用?原理与最佳实践
前端