你知道可以用 Python 來(lái)構(gòu)建 flutter 應(yīng)用嗎？

Flutter 在軟件研發(fā)領(lǐng)域是非常流行的，今天就讓我們深入了解一下，用 Python 構(gòu)建 flutter 應(yīng)用程序的世界！

關(guān)于FLET

在開(kāi)始學(xué)習(xí)前，了解一下什么是 FLET？

FLET 可以使開(kāi)發(fā)人員通過(guò) Python，輕松地構(gòu)建實(shí)時(shí) Web、移動(dòng)和桌面應(yīng)用程序，更加瘋狂的是不需要你有前端經(jīng)驗(yàn)，也能讓你開(kāi)發(fā)出穩(wěn)定的 Web 應(yīng)用程序，雖然移動(dòng)版本還在開(kāi)發(fā)中。

FLET 令人驚嘆的功能

• 由 Flutter 驅(qū)動(dòng)；
• 你可以在幾分鐘內(nèi)實(shí)現(xiàn)一個(gè) APP；
• 簡(jiǎn)單的軟件架構(gòu)；
• 除 Python 外，還將支持其他語(yǔ)言，如 Go、C# 等。

太棒了，對(duì)吧？？

如何安裝 FLET

請(qǐng)使用以下命令安裝 FLET。

pip install flet

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

pip3 install flet

記得將你的 pip 升級(jí)到最新版本。

pip install -- upgrade pip

簡(jiǎn)單介紹 Flutter

由 Google 創(chuàng)建的 UI 工具包 Flutter，可以讓程序員創(chuàng)建擁有一流界面的應(yīng)用程序。與 Java 不同，F(xiàn)lutter 使用 Dart 編程，它是一種面向?qū)ο蟮恼Z(yǔ)言，學(xué)起來(lái)要簡(jiǎn)單得多。

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

注意: 當(dāng)使用多個(gè)操作系統(tǒng)時(shí)，需要做一些適配調(diào)整。

用 FLET 構(gòu)建簡(jiǎn)單的應(yīng)用程序

讓我們用 FLET 構(gòu)建一個(gè)簡(jiǎn)單的應(yīng)用程序，它具有：

• 一個(gè)文本輸入框；
• 增減兩個(gè)按鈕。

代碼片段

首先，我們需要導(dǎo)入 FLET 和計(jì)數(shù)器程序必不可少的其他功能（例如組件）。

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

我們定義了 main 函數(shù)，并設(shè)置了標(biāo)題，由于應(yīng)用程序的基礎(chǔ)部分已經(jīng)準(zhǔn)備好，接下來(lái)設(shè)置一下組件。

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

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

接下來(lái)我們會(huì)考慮……

輸入框和按鈕

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

下面我們定義了兩個(gè)處理事件的函數(shù)。

//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 是指我們放入行中的文本輸入框?qū)ο?，接下?lái)，需要使用文本框中的值，并將其包裝在變量中，下面是完整代碼。

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)

最后一步是運(yùn)行應(yīng)用程序。

flet.app(target=main)

我們添加了針對(duì) main 函數(shù)的命令，要運(yùn)行應(yīng)用，請(qǐng)執(zhí)行下述命令。

python filename.py

請(qǐng)注意，上述命令必須在 Python 文件所在目錄執(zhí)行。

用戶界面

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

為此需要進(jìn)行小幅調(diào)整，添加如下代碼即可。

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

你可以從下述地址了解更多關(guān)于 FLET 的信息：

https://flet.dev/docs/roadmap

以上就是利用Python構(gòu)建Flutter應(yīng)用的教程詳解的詳細(xì)內(nèi)容，更多關(guān)于Python構(gòu)建Flutter應(yīng)用的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

最新評(píng)論