Dart & Flutter系列教程【5】——Flutter

808 阅读2分钟

关键词:命令、热加载、VSCode、第一个程序、简单了解初始化生成的程序

学习的命令:

  1. flutter -- version 查看版本
  2. flutter doctor 确定是否安装配置成功
  3. flutter devices 查看可连接的所有设备,它的运行可以在任意目录
  4. flutter run 默认运行在手机上
  5. flutter run -d all 运行在所有终端设备

ps:flutter devices的运行可以在任意目录,但flutter run智能在对应的项目文件下

Flutter应用安装运行的前提

  1. 打开AndroidStudio的Setting,(可以直接在搜索框搜索SDK)在Appearance & Behavior,选择其中的Android SDK,在常见的SDK Platforms下面勾选适合的Revision。

  2. 选择真机调试还是虚拟机调试。

    • 真机需要点击10次开启开发者模式 并且 开启调试模式
    • 虚拟机需要在as应用上打开SDK Manager
    • 选择一个版本下载
    • 完成后进入运行即可

VSCode

1.搜索插件flutter、Dart,进行安装

image.png

  1. 安装flutter代码提示工具

image.png

  1. 导入项目

image.png 注意点: as软件打开是.android目录,而vscode打开的是flutter目录

  1. 主要关注的是lib目录下的文件

image.png

  1. 运行时即使在终端下输入命令行代码进行热加载

热加载

当我们第一次加载时运行项目会非常耗时。但当第一次运行项目后之后的加载运行可以使用热加载,加快运行速度。

常用快捷键

r键:热加载,即重新加载 R键:热重启项目 p:显示网格,掌握布局情况 o:切换android和ios的预览模式 q:退出调试预览模式

Flutter的第一个APP

对初始程序的初认识

  1. 标题

image.png

2,文字内容

image.png

前后对比:

a590a5a7a3ff37baac2e7cb618a85c3.jpg 98e4c37c2f96b478d9646dab81f1a38.jpg

ps:MAC电脑的搭建自行再去观看视频P18

查看电脑版本的指令

% uname -a

对应下载mac版本