作者 | Valentine Enedah

譯者 | 王德朕

　　Flutter 在軟件研發領域是非常流行的，今天就讓我們深入了解一下，用 Python 構建 Flutter 應用程序的世界！

關于 FLET

　　在開始學習前，了解一下什么是 FLET？

　　FLET 可以使開發人員通過 Python，輕松地構建實時 Web、移動和桌面應用程序，更加瘋狂的是不需要你有前端經驗，也能讓你開發出穩定的 Web 應用程序，雖然移動版本還在開發中。

1、FLET 令人驚嘆的功能

　　1. 由 Flutter 驅動；2. 你可以在幾分鐘內實現一個 APP；3. 簡單的軟件架構；4. 除 Python 外，還將支持其他語言，如 Go、C# 等。

　　太棒了，對吧？？

2、如何安裝 FLET

　　請使用以下命令安裝 FLET。

pipinstall flet  

　　注意：該命令適用于 Python3.0 以下版本，如果是 Python3.0 以上版本，請使用下述命令。

pip3install flet  

　　記得將你的 pip 升級到最新版本。

pipinstall -- upgrade pip  

簡單介紹 Flutter

　　由 Google 創建的 UI 工具包 Flutter，可以讓程序員創建擁有一流界面的應用程序。與 Java 不同，Flutter 使用 Dart 編程，它是一種面向對象的語言，學起來要簡單得多。

　　新的 Flutter 版本(3.4.0-34.1.Pre) ，可以讓我們用一套代碼構建移動(Android/IOS)、 MacOS、 Web、 Linux 和桌面應用程序。

　　注意: 當使用多個操作系統時，需要做一些適配調整。

1、用 FLET 構建簡單的應用程序

　　讓我們用 FLET 構建一個簡單的應用程序，它具有：

　　一個文本輸入框；

　　增減兩個按鈕。

　　代碼片段

　　首先，我們需要導入 FLET 和計數器程序必不可少的其他功能（例如組件）。

import fletfrom flet import Row, icons, IconButton, TextField, Page; 

　　我們定義了 main 函數，并設置了標題，由于應用程序的基礎部分已經準備好，接下來設置一下組件。

　　要添加一個組件，我們使用 page.add (widget…)。

def main(page: Page):  
page.title= "Counter App"  
page.vertical_alignment= "center"  

　　接下來我們會考慮……

　　輸入框和按鈕

page.add(Row([
IconButton(icons.REMOVE),  
TextField(text_align="center",value="0", width=100)  
IconButton(icons.ADD)  
],  
alignment="center")  
)

　　下面我們定義了兩個處理事件的函數。

//Decrement
def minus(e) :  
tf.value= int(tf.value) -1  
page.update()//Increment
def plus(e) :  
tf.value= int(tf.value) + 1  
page.update()

　　tf 是指我們放入行中的文本輸入框對象，接下來，需要使用文本框中的值，并將其包裝在變量中，下面是完整代碼。

import flet  
from flet import Row, icons, IconButton, TextField, Page;  
def main(page: Page):  
page.title = "Counter App"  
page.vertical_alignment = "center"  
tf =TextField(text_align="center",value="0", width=100)  
#Functions  
def minus(e):  
tf.value = int(tf.value) -1  
page.update()  
def plus(e):  
tf.value = int(tf.value) + 1  
page.update()  
#Widgets  
page.add(  
Row([  
IconButton(icons.REMOVE, on_click=minus),  
tf,  
IconButton(icons.ADD, on_click=plus)  
 ],  
alignment="center")  
)
flet.app(target=main,view=flet.WEB_BROWSER)

　　最后一步是運行應用程序。

flet.app(target=main)

　　我們添加了針對 main 函數的命令，要運行應用，請執行下述命令。

pythonfilename.py  

　　請注意，上述命令必須在 Python 文件所在目錄執行。

2、用戶界面

　　正如我在簡單介紹 Flutter 部分中描述的一樣，該程序也可以 Web 瀏覽器上使用。

　　為此需要進行小幅調整，添加如下代碼即可。

flet.app(target=main,view=flet.WEB_BROWSER) 

　　你可以從下述地址了解更多關于 FLET 的信息：https://flet.dev/docs/roadmap

原文鏈接：

??https://hackernoon.com/a-brief-intro-to-flet-building-flutter-apps-with-python??

譯者簡介

王德朕，51CTO社區編輯，10年互聯網產研經驗，6年IT教培行業經驗。