Flutter是一個由谷歌開發的開放原始碼跨平台應用程式軟件開發套件,用於為AndroidiOSWindowsmacOSLinux Desktop、Google Fuchsia開發應用程式[4]

Quick Facts 原作者, 開發者 ...
Flutter
Thumb
原作者Google
開發者Google與社區
首次發佈Alpha (v0.0.6) / 2017年5月,​7年前​(2017-05[1]
目前版本
  • 3.24.5(2024年11月13日;穩定版本)[2]
編輯維基數據連結
原始碼儲存庫 編輯維基數據連結
程式語言Dart[3]
平台AndroidiOSGoogle Fuchsia、Web平台、WindowsmacOSLinux
類型應用程式框架
許可協定 編輯維基數據連結
網站flutter.dev
Close

Flutter第一個版本支援Android作業系統,開發代號稱作「Sky」。 它於2015年4月的Flutter開發者會議上被公佈[5],宣稱其目標為實現120FPS彩現效能[6]。在上海Google Developer Days的主題演講中,Google宣佈了Flutter Release Preview 2,這是Flutter 1.0之前的最後一個重要版本。2018年12月4日,Flutter 1.0在Flutter Live活動中發佈,是該框架的第一個「穩定」版本。[7]2019年12月11日,在Flutter Interactive活動上發佈了Flutter 1.12,宣佈Flutter是第一個為環境計算設計的UI平台[8]。2022年5月12日,在 Google I/O 2022 發佈了 Flutter 3[9],正式支援了 Windows、macOS、Linux 等作業系統。

框架組織

Flutter的主要組成部分包括:

Dart平台

Flutter是使用Dart語言編寫,並利用該語言的許多進階功能。[11]

WindowsmacOSLinux上,Flutter在Dart虛擬機器中執行,該虛擬機器具有即時編譯執行引擎。在編寫和除錯應用程式時,Flutter使用即時編譯功能進行「熱重載」(Hot Reload),可以將對原始檔的修改注入正在執行的應用程式中。Flutter透過支援有狀態的熱多載來擴充此功能,在大多數情況下,對原始碼的更改可以立即在執行的應用程式中反映出來,而無需重新啟動或遺失任何狀態。[12]Flutter實現的此功能已廣受讚譽。

Flutter應用程式的發佈版本在Android和iOS上都進行了提前(AOT, Ahead Of Time)編譯[13],使Flutter在流動裝置上可以高效能地執行。

Flutter 引擎

Flutter的引擎主要使用C++開發,透過Google的Skia圖形函式庫提供底層彩現支援,亦提供平台相關的SDK,例如AndroidiOS[11]。Flutter引擎是用於寄存Flutter應用程式的可移植的執行環境。它實現了Flutter的核心程式庫,包括動畫和圖形、檔案和網絡I/O、可訪問性支援、外掛程式架構以及Dart執行環境和編譯工具鏈。大多數開發人員將透過Flutter框架與Flutter進行互動,該框架提供了一個現代、響應式的框架,以及一組豐富的平台、版面配置和基礎元件。

基礎程式庫

基礎程式庫由Dart編寫,提供了用Flutter組建應用程式所需的基本的類別和函數,例如與引擎通訊的API[14]

元件

Flutter是透過組織、建立不同的元件完成用戶介面設計的。在Flutter中,一個元件代表用戶介面中不可變的一部分;包括文字、多邊形以及動畫在內的所有圖形都是用元件建立的。複雜的元件由簡單的元件結合而成。

客製化設計風格的元件

Flutter框架包含了兩套符合特定設計語言元件。 稱作Material Design的元件實作的是同名的谷歌設計語言,稱作Cupertino的元件實作蘋果公司iOS的人機介面指南(Human interface guidelines)[11][15][16][17]

第三方擴充

Flutter 使用 pub頁面存檔備份,存於互聯網檔案館) 管理第三方依賴包。在專案的 pubspec.yaml 中,開發者可以指定每個相依項的版本範圍,或者固定版本號。

IDE

Flutter支援使用 Visual Studio CodeAndroid Studio ,需要安裝 Flutter 外掛程式和 Dart 外掛程式。

在中國大陸,由於防火長城的存在,需要切換軟件源才能正常安裝Flutter[18]

Hello World 範例

一個Flutter中的Hello World程式如下所示:

import 'package:flutter/material.dart';

void main() => runApp(HelloWorldApp());

class HelloWorldApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Hello World App',
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Hello World App'),
        ),
        body: const Center(
          child: Text('Hello World'),
        ),
      ),
    );
  }
}

參考文獻

外部連結

Wikiwand in your browser!

Seamless Wikipedia browsing. On steroids.

Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.

Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.