文章目录

  • 一、Android Studio 中创建 Flutter 项目
  • 二、命令行创建 Flutter 项目
  • 三、通过命令行方式运行 Flutter 项目
  • 四、通过 Android Studio 可视化方式运行 Flutter 项目
  • 五、通过 Android Studio 可视化方式运行 Flutter 项目种的 Android 项目
  • 六、通过 Xcode 可视化方式运行 Flutter 项目种的 iOS 项目
  • 七、 相关资源

一、Android Studio 中创建 Flutter 项目

先安装 Flutter 和 Dart 插件 , 参考 【Flutter】Flutter 开发环境搭建 ( Android Studio 下 Flutter / Dart 插件安装 | Flutter SDK 安装 | 环境变量配置 | 开发环境检查 ) 博客 ;

1 . 选择创建 Flutter 应用 : 在 Android Studio 中 , 菜单栏 -> File -> New Flutter Project , 弹出 Create New Flutter Project 对话框 ; 四个选项分别是创建 Flutter 应用 , Flutter 插件 , Flutter 包 , Flutter Module , 这里需要创建 Flutter 应用 ( Flutter Application ) ;

2 . 配置 Project 信息 : 在 Project name 中输入项目名称 , Flutter SDK path 中选择 Flutter SDK 根目录 , Project location 中选择项目创建地址 ; ( 注意项目名称只能是小写字母和下划线组成 )

3 . 设置包名 : 输入一个包名 , 选择 Finish 完成 Flutter 项目创建 ;

等待 Flutter 应用创建完成 : 第一次生成 Flutter 应用 , 建议翻墙完成 , 几分钟完成 ;

( 第一次没有翻墙 , 20 分钟没有创建成功 )

二、命令行创建 Flutter 项目

使用 flutter 命令进行创建 , 使用 flutter 命令前 , 需要先将 flutter SDK 中的 flutter\bin 目录添加到环境变量中 ;

环境变量设置参考 【Flutter】Flutter 开发环境搭建 ( Android Studio 下 Flutter / Dart 插件安装 | Flutter SDK 安装 | 环境变量配置 | 开发环境检查 ) 六、设置 Flutter 环境变量 ( 在系统变量中配置 ) 博客 ;

命令格式 :

flutter create 项目名称

这里注意 , 一定要配置正确的源 : 环境变量中配置下面的源 , 否则出错 ;

PUB_HOSTED_URL : https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL : https://storage.flutter-io.cn

配置镜像源环境变量如果出错 , 此处创建 Flutter 应用肯定出错 ;

环境变量配置错误问题处理 : 【错误记录】命令行创建 Flutter 应用报错 pub get failed (server unavailable) – attempting retry 1 in 1 second…

完整过程 :

执行如下命令 :

flutter create flutter_cmd

命令行输出 :

D:\002_Project\002_Android_Learn\Flutter_Cmd>flutter create flutter_cmd
Creating project flutter_cmd... androidx: trueflutter_cmd\.gitignore (created)flutter_cmd\.idea\libraries\Dart_SDK.xml (created)flutter_cmd\.idea\libraries\Flutter_for_Android.xml (created)flutter_cmd\.idea\libraries\KotlinJavaRuntime.xml (created)flutter_cmd\.idea\modules.xml (created)flutter_cmd\.idea\runConfigurations\main_dart.xml (created)flutter_cmd\.idea\workspace.xml (created)flutter_cmd\.metadata (created)flutter_cmd\android\app\build.gradle (created)flutter_cmd\android\app\src\main\kotlin\com\example\flutter_cmd\MainActivity.kt (created)flutter_cmd\android\build.gradle (created)flutter_cmd\android\flutter_cmd_android.iml (created)flutter_cmd\android\.gitignore (created)flutter_cmd\android\app\src\debug\AndroidManifest.xml (created)flutter_cmd\android\app\src\main\AndroidManifest.xml (created)flutter_cmd\android\app\src\main\res\drawable\launch_background.xml (created)flutter_cmd\android\app\src\main\res\mipmap-hdpi\ic_launcher.png (created)flutter_cmd\android\app\src\main\res\mipmap-mdpi\ic_launcher.png (created)flutter_cmd\android\app\src\main\res\mipmap-xhdpi\ic_launcher.png (created)flutter_cmd\android\app\src\main\res\mipmap-xxhdpi\ic_launcher.png (created)flutter_cmd\android\app\src\main\res\mipmap-xxxhdpi\ic_launcher.png (created)flutter_cmd\android\app\src\main\res\values\styles.xml (created)flutter_cmd\android\app\src\profile\AndroidManifest.xml (created)flutter_cmd\android\gradle\wrapper\gradle-wrapper.properties (created)flutter_cmd\android\gradle.properties (created)flutter_cmd\android\settings.gradle (created)flutter_cmd\ios\Runner\AppDelegate.swift (created)flutter_cmd\ios\Runner\Runner-Bridging-Header.h (created)flutter_cmd\ios\Runner.xcodeproj\project.pbxproj (created)flutter_cmd\ios\Runner.xcodeproj\xcshareddata\xcschemes\Runner.xcscheme (created)flutter_cmd\ios\.gitignore (created)flutter_cmd\ios\Flutter\AppFrameworkInfo.plist (created)flutter_cmd\ios\Flutter\Debug.xcconfig (created)flutter_cmd\ios\Flutter\Release.xcconfig (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Contents.json (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-1024x1024@1x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-20x20@1x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-20x20@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-20x20@3x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-29x29@1x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-29x29@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-29x29@3x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-40x40@1x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-40x40@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-40x40@3x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-60x60@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-60x60@3x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-76x76@1x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-76x76@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\AppIcon.appiconset\Icon-App-83.5x83.5@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\LaunchImage.imageset\Contents.json (created)flutter_cmd\ios\Runner\Assets.xcassets\LaunchImage.imageset\LaunchImage.png (created)flutter_cmd\ios\Runner\Assets.xcassets\LaunchImage.imageset\LaunchImage@2x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\LaunchImage.imageset\LaunchImage@3x.png (created)flutter_cmd\ios\Runner\Assets.xcassets\LaunchImage.imageset\README.md (created)flutter_cmd\ios\Runner\Base.lproj\LaunchScreen.storyboard (created)flutter_cmd\ios\Runner\Base.lproj\Main.storyboard (created)flutter_cmd\ios\Runner\Info.plist (created)flutter_cmd\ios\Runner.xcodeproj\project.xcworkspace\contents.xcworkspacedata (created)flutter_cmd\ios\Runner.xcworkspace\contents.xcworkspacedata (created)flutter_cmd\lib\main.dart (created)flutter_cmd\flutter_cmd.iml (created)flutter_cmd\pubspec.yaml (created)flutter_cmd\README.md (created)flutter_cmd\test\widget_test.dart (created)
Running "flutter pub get" in flutter_cmd...                         4.0s
Wrote 68 files.All done!
[√] Flutter: is fully installed. (Channel stable, v1.12.13+hotfix.8, on Microsoft Windows [Version 10.0.18363.1139],locale zh-CN)
[√] Android toolchain - develop for Android devices: is fully installed. (Android SDK version 29.0.3)
[√] Android Studio: is fully installed. (version 4.0)
[!] IntelliJ IDEA Community Edition: is partially installed; more components are available. (version 2019.3)
[√] Connected device: is fully installed. (1 available)Run "flutter doctor" for information about installing additional components.In order to run your application, type:$ cd flutter_cmd$ flutter runYour application code is in flutter_cmd\lib\main.dart.D:\002_Project\002_Android_Learn\Flutter_Cmd>

三、通过命令行方式运行 Flutter 项目

通过命令行方式运行 Flutter 项目 : 进入 Flutter 项目根目录 , 然后调用 flutter run 命令 , 运行 Flutter 应用 ; 会自动在当前已经连接的设备或模拟器上运行该 Flutter 应用 ;

在上一小节执行 flutter create flutter_cmd 命令创建 Flutter 应用基础上执行下面的操作 ;

进入 flutter_cmd 应用根目录 :

cd flutter_cmd

运行 Flutter 应用 :

flutter run

执行 flutter run 命令后 , 就会开始构建 Flutter 应用 , 然后运行到当前已连接的设备中 ;

D:\002_Project\002_Android_Learn\Flutter_Cmd>cd flutter_cmdD:\002_Project\002_Android_Learn\Flutter_Cmd\flutter_cmd>flutter run
Launching lib\main.dart on Pixel 2 in debug mode...
Running Gradle task 'assembleDebug'...
Running Gradle task 'assembleDebug'... Done                        59.1s
√ Built build\app\outputs\apk\debug\app-debug.apk.
Installing build\app\outputs\apk\app.apk...                        14.0s
D/FlutterActivity(13511): Using the launch theme as normal theme.
D/FlutterActivityAndFragmentDelegate(13511): Setting up FlutterEngine.
D/FlutterActivityAndFragmentDelegate(13511): No preferred FlutterEngine was provided. Creating a new FlutterEngine for this FlutterFragment.
D/FlutterActivityAndFragmentDelegate(13511): Attaching FlutterEngine to the Activity that owns this Fragment.
D/FlutterView(13511): Attaching to a FlutterEngine: io.flutter.embedding.engine.FlutterEngine@a04e361
D/FlutterActivityAndFragmentDelegate(13511): Executing Dart entrypoint: main, and sending initial route: /
Syncing files to device Pixel 2...5,251ms (!)												


											

【Flutter】创建 Flutter 项目 ( Android Studio 创建并运行 Flutter 应用 | 命令行创建并运行 Flutter 应用 | 运行 Flutter 应用三种方式 )相关推荐
	

    
						
  1. [APP] Android 开发笔记 001-环境搭建与命令行创建项目
		
    1. 安装JDK,SDK JDK http://www.oracle.com/technetwork/java/javase/downloads/index.html Android SDK http ...
    
		
    2. 
						
  2. Spring创建Bean的三种方式的使用和区别
		
    在学习Spring的时候,发现Spring的IOC(控制反转)为我们提供的三种创建Bean的方式. 1.Spring创建Bean的三种方式 这里采用XML配置,分别演示三种创建Bean的方式和代码.  ...
    
		
    3. 
								
  3. 【Flutter】Flutter 应用创建运行 ( Android Studio 创建 / 运行 Flutter 应用 | 命令行创建 / 运行 Flutter 应用 )
		
    文章目录 一.Android Studio 中创建 Flutter 应用 二. Android Studio 中运行 Flutter 应用 三. 命令行 中创建 Flutter 应用 四.命令行 中运 ...
    
		
    4. 
						
  4. 【错误记录】Android Studio 创建 Flutter 应用被卡住 ( 更新 Flutter 插件 | 命令行创建 | 断网 )
		
    文章目录 一.报错信息 二.解决方案 一.报错信息 在 Android Studio 中 , 选择 " 菜单栏 / File / New / New Flutter Project &quo ...
    
		
    5. 
						
  5. flutter图标按钮_Flutter开发第一个项目android studio 开发工具的使用说明
		
    Flutter开发第一个项目android studio 开发工具的使用说明 做个自我介绍 自我介绍还是有必要介绍一下的,毕竟这是网络里,你看不到我,我看不到你,只能通过文字来传递信息,本人做技术8年 ...
    
		
    6. 
						
  6. 【Flutter】Flutter 开发环境搭建 ( Android Studio 下 Flutter / Dart 插件安装 | Flutter SDK 安装 | 环境变量配置 | 开发环境检查 )
		
    文章目录 一.Flutter 学习资料 二.Flutter 开发环境搭建 三.Android Studio 环境安装 Flutter / Dart 插件 四.下载 Flutter SDK 五.设置 F ...
    
		
    7. 
						
  7. 《Android应用开发攻略》——1.3 从命令行创建 “Hello, World”应用程序
		
    1.3 从命令行创建 "Hello, World"应用程序 Ian Darwin 1.3.1 问题 你想在不使用Eclipse ADT插件的情况下创建新的Android项目. 1. ...
    
		
    8. 
						
  8. vue使用命令行构建完项目后_通过命令行创建vue项目的方法
		
    通过命令行创建vue项目的方法 最近想要学习vue,正好看到资料,如何通过命令创建vue项目的方法,就留个笔记 环境要求: 安装有 Node.js. vue.vue-cli . 创建项目: vue i ...
    
		
    9. 
						
  9. react项目_如何从零开始创建React项目（三种方式）
		
    在开发React项目前最关键的当然是项目的创建,现在的前端工程化使得前端项目的创建也变得越来越复杂,在这里介绍三种从零开始创建React项目的方式,分别是在浏览器中直接引入.使用官方脚手架create ...
    
		
    10. 
		


					

最新文章
	

    
						
  1. 西湖龙井也上链？是的，以后你喝什么茶我都知道！
		
    2. 
						
  2. 成功解决ValueError: not enough values to unpack (expected 2, got 1)
		
    3. 
						
  3. leetcode470 Java_Java实现 LeetCode 794 有效的井字游戏 （暴力分析）
		
    4. 
						
  4. MYECLIPSE中快速解决项目的错误的方法
		
    5. 
						
  5. html egg mac os 10.7,HTML Egg
		
    6. 
						
  6. bzoj1207: [HNOI2004]打鼹鼠
		
    7. 
						
  7. Python制作AI贪吃蛇，很多很多细节、思路都写下来了！
		
    8. 
						
  8. 静态定义的receiver接收broadcast intent
		
    9. 
						
  9. PHP FTP操作类( 上传、拷贝、移动、删除文件/创建目录 )
		
    10. 
						
  10. 计算机网络自顶向下-运输层
		
    11. 
						
  11. 传感器的爆炸式增长下，隐私问题将重新定义？
		
    12. 
						
  12. mesos 学习笔记-- mesos安装和配置
		
    13. 
						
  13. maven spring-mvc mybatis整合
		
    14. 
						
  14. Python中图像标题生成的注意机制实战教程
		
    15. 
						
  15. 20191219每日一句
		
    16. 
						
  16. Introduction to Computer Networking学习笔记（十）：Finite State Mechines（有限状态机）以TCP连接断开为例
		
    17. 
						
  17. html 文件 转换成mp4视频,[swf转视频]一个带有Play播放按钮的swf文件怎么转换成mp4视频...
		
    18. 
						
  18. 学籍管理html,河南学籍管理系统
		
    19. 
						
  19. 生产力高于一切？我们为什么会对技术上瘾？
		
    20. 
						
  20. 数据分析出的 2000年以来高分华语电影前50名
		
    21. 
		

	


热门文章
	

    
									
  1. 老板，请给我多点培养【写给老板的一封信】
			
    2. 
						
  2. javascript笔记：推荐使用“百度统计”并且拷贝百度统计的前端框架
			
    3. 
						
  3. Ollydbg 常用快捷键
			
    4. 
						
  4. Shell脚本笔记（三）shell中的数学计算
			
    5. 
						
  5. 2017滴滴出行笔试题：异或和为0的最大区间个数
			
    6. 
						
  6. Android得到控件在屏幕中的坐标
			
    7. 
						
  7. Android nDrawer
			
    8. 
						
  8. JSF框架在NetBeans下的编码
			
    9. 
						
  9. Reg Infomation
			
    10. 
						
  10. 算法学习：最小圆覆盖
			
    11.