Flutter（入门）

声明式布局

传统iOS and Android 是命令式

布局《由外向内》

多画界面，从中找感觉

性能

flutter 控制屏幕上的每个像素，避免了需要javaScript桥接导致的性能损失

RN是将布局转换为IiOS/Android 原生布局

环境配置

配置环境变量 bash_profile

• 捷径 open ~
• open .bash_profile
• 创建 vim bash_profile
• 更新：source bash_profile

由于墙的原因需要配置镜像。具体查看using flutter in china

• export PUB_HOSTED_URL=https://pub.flutter-io.cn
  $ export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

• export PATH=“ P W D / f l u t t e r / b i n : PWD/flutter/bin: PWD/flutter/bin:PATH”

  SDK 路径

flutter doctor 检查环境变量安装的情况

命令行创建项目

• flutter create my_app

  • 目录结构

    • iOS 宿主工程
    • android 宿主工程
    • lib 主要是dart语言
    • pubspec.yaml：依赖包配置

• flutter tun

• r：热加载

• R：热重启

• q： 退出

• t： 停止

iOS 真机运行项目

• open runner.xcodeproj

心得

可能会遇到一些网络环境的问题导致无法运行

下载好工具的同时，最好能创建一个demo运行用来确定工具是不是可以正常运行的。

Flutter开发工具推荐Android studio

需要熟悉Android studio 工具用户指南

XMind - Trial Version