Flutter无脑入门-从零到第一个APP
liuian 2025-05-21 14:57 23 浏览
Flutter自发布正式版之后,不少大厂已开始使用这项技术构建新的终端页面或重构部分功能,虽然其自身依然存在不少待解决的问题,但作为当前跨平台门派最后一个入场的小伙子,其潜力不容小觑,为了适应风起云涌变幻莫测的技术潮流,掌握新技术的能力是技术宅必备的基础技能,于是本篇开始从0扫盲Flutter,废话不多,开搞。
安装Flutter
安装Flutter最快捷的有2个方法,大家可视情况安装:
- 使用Git命令此方法适用于墙外或有翻墙网络环境的小伙伴,使用下面的命令即可
C:\src>git clone https://github.com/flutter/flutter.git -b stable
- 直接下载SDK包,建议使用某雷,快的一匹:
下载地址:
https://storage.googleapis.com/flutter_infra/releases/stable/windows/flutter_windows_v1.12.13+hotfix.9-stable.zip
SDK包下载完毕,被墙的小伙伴,添加两个避开被墙的环境变量参数和参数值:
PUB_HOSTED_URL https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL https://storage.flutter-io.cn
无论是Windows还是Mac还是Linux,向环境变量Path中添加参数:
[你的Flutter文件夹路径]\flutter\bin
测试安装
打开命令行,输入以下命令:
C:\src\flutter>flutter doctor
如果SDK包和前面配置的路径没有问题,你会大概率看到如下信息:
如果看到类似上面的信息说明你已经安装成功了。
值得注意的是,如果你是第一次安装,可能会需要等待一段时间,因为Flutter首次安装会自动检查开发环境,并下载一系列的依赖和基础控件,因此不必惊慌,耐心等待即可。
若你的电脑上没有安装IDE、虚拟机或连接任何安卓设备,你会看到上图中后三项检查都是X,没关系,我们一步一步来。
安装安卓SDK和虚拟机
如果使用Mac的IOS虚拟机,或者已安装安卓虚拟机的小伙伴,可略过此步
首先打开AS下载链接:
https://developer.android.com/studio/index.html#features
按提示下载Android Studio安装包,无脑下一步,注意其中有一步需要勾选组件Android SDK, Android SDK Command-line Tools和Android SDK Build-Tools,完毕后即完成安卓SDK的安装。
打开Android Studio,进入SDK管理器:
这里面就是安卓各个版本的虚拟机列表了,勾选2-3个当前比较广泛的版本,点击OK即可;
待AS下载完虚拟机后,打开虚拟机管理器:
全新安装的小伙伴点击右下角按钮创建新虚拟机即可,过程不赘述,根据自己的情况配置虚拟机的屏幕尺寸和硬件即可,给新手一点DIY的探索空间。
安装代码编辑器Visual Studio Code
如果有自己喜欢的IDE,可以自行百度解决Flutter相关插件的安装,我比较喜欢VS,因此快速过一遍VS code的安装和配置。
打开VS下载链接,下载安装包
https://code.visualstudio.com/
无脑安装后进入VS Code,打开扩展列表,输入dart code,搜索dart插件,点击安装>重启:
VS Code重启很快,重新打开后使用快捷键Ctrl+Shift+p,打开命令面板,输入Flutter:
如果能看到上图中模糊匹配Flutter的命令,说明安装完毕,如果没有,果断重启电脑,就酱。
创建第一个APP
好了,铺垫已经做好,接下来做些比较cool的事情。
在VS Code中,快捷键Ctrl+Shift+p,打开命令面板,输入flutter,选择第一行New Project:
然后输入一个比较Niubility的名字:
这时会弹出文件夹选择器,选择一个存放项目的路径即可,此时VS Code开始运行了,右下角会看到初始化项目的提示:
如果是全新开发环境,初始化项目所需的依赖需要下载,耐心等一会儿就行,如果没配置开头讲的两个环境变量大概率会被墙卡住。
项目创建完毕,全新APP的原始代码已经帮你写好了,可以直接启动使用的,这时候先启动虚拟机。
可以看到VS Code右下角有个启动虚拟机的快捷入口,点一下上面就会弹出启动虚拟机的选项,选好镜像便启动虚拟机了:
启动好虚拟机,在命令行中输入flutter run,即可启动你的第一个APP:
初次启动会比较慢,耐心等等即可,让我们看看效果:
好了,本篇结束,祝好运~!
相关推荐
- 教你把多个视频合并成一个视频的方法
-
一.情况介绍当你有一个m3u8文件和一个目录,目录中有连续的视频片段,这些片段可以连成一段完整的视频。m3u8文件打开后像这样:m3u8文件,可以理解为播放列表,里面是播放视频片段的顺序。视频片段像这...
- 零代码编程:用kimichat合并一个文件夹下的多个文件
-
一个文件夹里面有很多个srt字幕文件,如何借助kimichat来自动批量合并呢?在kimichat对话框中输入提示词:你是一个Python编程专家,完成如下的编程任务:这个文件夹:D:\downloa...
- Java APT_java APT 生成代码
-
JavaAPT(AnnotationProcessingTool)是一种在Java编译阶段处理注解的工具。APT会在编译阶段扫描源代码中的注解,并根据这些注解生成代码、资源文件或其他输出,...
- Unit Runtime:一键运行 AI 生成的代码,或许将成为你的复制 + 粘贴神器
-
在我们构建了UnitMesh架构之后,以及对应的demo之后,便着手于实现UnitMesh架构。于是,我们就继续开始UnitRuntime,以用于直接运行AI生成的代码。PS:...
- 挣脱臃肿的枷锁:为什么说Vert.x是Java开发者手中的一柄利剑?
-
如果你是一名Java开发者,那么你的职业生涯几乎无法避开Spring。它如同一位德高望重的老国王,统治着企业级应用开发的大片疆土。SpringBoot的约定大于配置、SpringCloud的微服务...
- 五年后,谷歌还在全力以赴发展 Kotlin
-
作者|FredericLardinois译者|Sambodhi策划|Tina自2017年谷歌I/O全球开发者大会上,谷歌首次宣布将Kotlin(JetBrains开发的Ja...
- kotlin和java开发哪个好,优缺点对比
-
Kotlin和Java都是常见的编程语言,它们有各自的优缺点。Kotlin的优点:简洁:Kotlin程序相对于Java程序更简洁,可以减少代码量。安全:Kotlin在类型系统和空值安全...
- 移动端架构模式全景解析:从MVC到MVVM,如何选择最佳设计方案?
-
掌握不同架构模式的精髓,是构建可维护、可测试且高效移动应用的关键。在移动应用开发中,选择合适的软件架构模式对项目的可维护性、可测试性和团队协作效率至关重要。随着应用复杂度的增加,一个良好的架构能够帮助...
- 颜值非常高的XShell替代工具Termora,不一样的使用体验!
-
Termora是一款面向开发者和运维人员的跨平台SSH终端与文件管理工具,支持Windows、macOS及Linux系统,通过一体化界面简化远程服务器管理流程。其核心定位是解决多平台环境下远程连接、文...
- 预处理的底层原理和预处理编译运行异常的解决方案
-
若文章对您有帮助,欢迎关注程序员小迷。助您在编程路上越走越好![Mac-10.7.1LionIntel-based]Q:预处理到底干了什么事情?A:预处理,顾名思义,预先做的处理。源代码中...
- 为“架构”再建个模:如何用代码描述软件架构?
-
在架构治理平台ArchGuard中,为了实现对架构的治理,我们需要代码+模型描述所要处理的内容和数据。所以,在ArchGuard中,我们有了代码的模型、依赖的模型、变更的模型等,剩下的两个...
- 深度解析:Google Gemma 3n —— 移动优先的轻量多模态大模型
-
2025年6月,Google正式发布了Gemma3n,这是一款能够在2GB内存环境下运行的轻量级多模态大模型。它延续了Gemma家族的开源基因,同时在架构设计上大幅优化,目标是让...
- 比分网开发技术栈与功能详解_比分网有哪些
-
一、核心功能模块一个基本的比分网通常包含以下模块:首页/总览实时比分看板:滚动展示所有正在进行的比赛,包含比分、比赛时间、红黄牌等关键信息。热门赛事/焦点战:突出显示重要的、关注度高的比赛。赛事导航...
- 设计模式之-生成器_一键生成设计
-
一、【概念定义】——“分步构建复杂对象,隐藏创建细节”生成器模式(BuilderPattern):一种“分步构建型”创建型设计模式,它将一个复杂对象的构建与其表示分离,使得同样的构建过程可以创建...
- 构建第一个 Kotlin Android 应用_kotlin简介
-
第一步:安装AndroidStudio(推荐IDE)AndroidStudio是官方推荐的Android开发集成开发环境(IDE),内置对Kotlin的完整支持。1.下载And...
- 一周热门
-
-
【验证码逆向专栏】vaptcha 手势验证码逆向分析
-
Psutil + Flask + Pyecharts + Bootstrap 开发动态可视化系统监控
-
一个解决支持HTML/CSS/JS网页转PDF(高质量)的终极解决方案
-
再见Swagger UI 国人开源了一款超好用的 API 文档生成框架,真香
-
网页转成pdf文件的经验分享 网页转成pdf文件的经验分享怎么弄
-
C++ std::vector 简介
-
飞牛OS入门安装遇到问题,如何解决?
-
系统C盘清理:微信PC端文件清理,扩大C盘可用空间步骤
-
10款高性能NAS丨双十一必看,轻松搞定虚拟机、Docker、软路由
-
python使用fitz模块提取pdf中的图片
-
- 最近发表
- 标签列表
-
- python判断字典是否为空 (50)
- crontab每周一执行 (48)
- aes和des区别 (43)
- bash脚本和shell脚本的区别 (35)
- canvas库 (33)
- dataframe筛选满足条件的行 (35)
- gitlab日志 (33)
- lua xpcall (36)
- blob转json (33)
- python判断是否在列表中 (34)
- python html转pdf (36)
- 安装指定版本npm (37)
- idea搜索jar包内容 (33)
- css鼠标悬停出现隐藏的文字 (34)
- linux nacos启动命令 (33)
- gitlab 日志 (36)
- adb pull (37)
- python判断元素在不在列表里 (34)
- python 字典删除元素 (34)
- vscode切换git分支 (35)
- python bytes转16进制 (35)
- grep前后几行 (34)
- hashmap转list (35)
- c++ 字符串查找 (35)
- mysql刷新权限 (34)