Flutter環境配置 + 基礎知識瞭解

明帝發表於2019-06-24
Flutter

里程碑資訊

  • 2014.10 - 原名 sky 在github 上開源
  • 2015.10 - 更名為 Flutter, 使用 Dart語言開發，Dart 是Google於2011年推出的新的計算機程式語言
  • 2017.05 - Google I/O 正式釋出Flutter
  • 2018.02 - Flutter推出 第一個 Beta版本(測試版本)
  • 2018.6.21 - Google 釋出 Flutter 的release預覽版(最終測試版)
  • 2019.02 - Flutter1.2釋出增加對web的支援
  • 2019.5.7 - 增加Flutter for Web，將Flutter的Dart程式碼直接編譯為JavaScript, 就是用Dart 編譯了 一個 可以再web端 執行的 程式。Flutter 正式成為一個全平臺的框架。

Flutter支援的端

Flutter環境配置 + 基礎知識瞭解

  • Mobile端已經較為成熟，體驗較於React Native 要好一些，具體原因待探究。
  • Web 端演進中
  • Desktop(桌面端)： 雖然不適用於生產環境，但是底層引擎已經基本成型，有待進一步整合。
  • Embedded(嵌入智慧裝置)

學習Flutter需要哪些必備知識？

  • Dart 語言基礎
  • Flutter對熟悉物件導向概念(類、方法、變數)和 指令式程式設計概念(迴圈、條件)經驗者相對容易入門。

Flutter特點

  • 快速開發
  • 效能優越
  • 富有表現力的精美UI
  • Everything is Widget

Flutter架構

Flutter環境配置 + 基礎知識瞭解

Flutter原理

Flutter環境配置 + 基礎知識瞭解

Flutter for Web架構

對比Flutter,引擎層變了

Flutter環境配置 + 基礎知識瞭解

下載安裝Flutter + Android Studio + 執行demo

    終端視窗臨時更新環境變數
    export PATH=`pwd`/flutter/bin:$PATH
    
    永久更新環境變數
    export PUB_HOSTED_URL=https://pub.flutter-io.cn //國內使用者需要設定
    export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //國內使用者需要設定
    export PATH=PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH
    
    
    1. 將  source ~/.bash_profile
       注入  ~/.zshrc 檔案中
       
    2.將
        export PATH=PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH
        export PUB_HOSTED_URL=https://pub.flutter-io.cn
        export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
      注入  ~/.bash_profile 檔案中
      (PATH_TO_FLUTTER_GIT_DIRECTORY 替換成 本機的 flutter檔案路徑)
      
    3.最後執行 flutter doctor
複製程式碼
  • 第四步 --- 通過 Android Stadio 的 File => New => New Flutter Project 去新建專案demo
  • 第五步 --- 下載SDK 並 執行demo
    Flutter環境配置 + 基礎知識瞭解

相關文章