Flutter学习day1–环境搭建与Dart基础想入门 Flutter第一关不是 Widget而是两件事把环境跑起来、把 Dart 的基础语法理顺。本文从环境搭建讲到 Dart 变量声明的三个关键字再用官方计数器 demo 拆解 Flutter 应用的最小骨架最后说说 Flutter 的招牌能力——热重载。如果你是从 ArkTS/鸿蒙或前端转过来的开发者文中附了对应的类比可以对照着学。一、环境搭建先跑通 flutter doctor安装 Flutter SDK 后第一件事不是写代码而是运行flutter doctor它会逐项体检Flutter SDK 本体、Android 工具链、ChromeWeb 调试用、已连接设备等有问题的项会直接给出修复建议照着处理即可。几个常见的坑运行调试优先用 IDE 的官方 Flutter 扩展Android Studio / VS Code或终端flutter run不要依赖第三方插件去直接调dart命令容易遇到dart: command not found——本质是 SDK 没进 PATH把flutter/bin加入 PATH 即可。环境是否健康的验收标准官方计数器 demo 能跑起来改一行文字保存后界面能热更新。二、Dart 变量声明var / final / const 三兄弟关键字可变性值确定时机var可重新赋值运行时final只能赋值一次运行时const不可变深度不可变编译期vara1;a2;// OKfinalbDateTime.now();// OK运行时确定constcDateTime.now();// 编译错误编译期无法确定constlist1[1,2,3];finallist2[1,2,3];list1.add(4);// 编译错误const 集合不可变list2.add(4);// OKfinal 只锁引用本身要点final允许值在运行时确定比如从接口取回的数据const必须在写代码时就能确定。const是深度不可变const修饰的集合连元素都不能改而且相同的 const 值在内存中共享同一实例。类比其他语言TypeScript 的const≈ Dart 的final锁引用内容可能可变Dart 的const更像as const断言加深冻结。实战提示Flutter 中把不变的配置、颜色、样式声明为const框架可以跳过不必要的重建是最简单的性能优化手段。三、最小应用骨架计数器 demo 解剖官方计数器 demo 是 Flutter 应用的最小可运行骨架结构值得逐行看清voidmain(){runApp(constMyApp());// 挂载根 Widget}classMyAppextendsStatelessWidget{constMyApp({super.key});overrideWidgetbuild(BuildContextcontext){returnMaterialApp(// 应用级配置主题、首页、路由home:constMyHomePage(),);}}class_MyHomePageStateextendsStateMyHomePage{int _counter0;void_incrementCounter(){setState((){// 修改状态 触发重建_counter;});}overrideWidgetbuild(BuildContextcontext){returnScaffold(// 页面骨架appBar / body / floatingActionButtonappBar:AppBar(title:constText(Flutter Demo)),body:Center(child:Text($_counter)),floatingActionButton:FloatingActionButton(onPressed:_incrementCounter,child:constIcon(Icons.add),),);}}runApp → MaterialApp → Scaffold是入口三件套MaterialApp负责应用级配置Scaffold提供页面骨架标题栏、内容区、浮动按钮。状态管理靠StatefulWidgetStatesetState(() {...})修改状态并通知框架重新执行build()是「数据驱动刷新」的标准写法。类比 ArkUIMaterialApp≈ 应用入口配置Scaffold≈ 页面布局容器setState≈State变量变更触发的刷新——声明式 UI、数据驱动的思路是相通的。四、热重载秒级见效的开发循环Flutter 的招牌能力是热重载Hot Reload原理保存代码后框架增量编译改动的 Dart 代码注入到正在运行的 Dart VMJIT 模式然后保留当前 State、重新执行build()刷新界面。改 UI 秒级见效页面上已有的状态比如输入框内容不会丢。限制main()、initState()这类只执行一次的代码改动需要热重启Hot Restart状态会清空。与 ArkTS Previewer 的区别Previewer 是独立的预览渲染器渲染的是简化环境热重载直接作用于运行中的 App 本体状态保留是核心卖点。调布局、颜色、动效时热重载就是开发效率的核心保存即所见。小结flutter doctor是环境排障第一入口验收标准是计数器 demo 能跑、能热更新。Dart 三兄弟一句话var可变final运行时定值const编译期常量且深度不可变。最小骨架记住链条runApp → MaterialApp → Scaffold → setState。热重载 增量注入 保留 State 重跑build()是 Flutter 迭代速度的来源。