Python でフラッター アプリを作成できることをご存知ですか?😮

Flutter は、ソフトウェア開発の世界で非常に人気があります。

Python でフラッター アプリを作成する世界に飛び込みましょう! 🙂

フレッツについて

その前にフレッツとは？

FLET を使用すると、開発者はリアルタイムのWeb、モバイル、およびデスクトップアプリを Python で簡単に構築できます。

クレイジーなことに、フロントエンドの経験は必要ありません。モバイル バージョンはまだ開発中ですが、Progressive Web App は引き続き信頼できます。

フレッツの驚きの機能

1. フラッターによって駆動されます。
2. 数分でアプリに命を吹き込むことができます。
3. シンプルなアーキテクチャです。
4. Python とは別に、Go、C# などの他の言語もサポートされます。

すごいですよね??🙂🔥

フレッツの導入方法

FLET をインストールするには、次のコマンドを使用します。

pip install flet

注意: これは、バージョン 3 未満の Python バージョンを使用しているユーザー向けです。

さもないと、

pip3 install flet

pip を最新バージョンにアップグレードするには。

pip install -- upgrade pip

Flutter について簡単に説明します 🏊‍♀️

Googleによって作成された UI ツールキットFlutterを使用すると、プログラマーは一流のユーザー インターフェイスを備えたアプリを作成できます。 Java 自体とは対照的に、Flutter は、習得がはるかに簡単なオブジェクト指向言語である Dart プログラミングを採用しています。

新しい Flutter バージョン (3.4.0-34.1.pre) では、モバイル (Android/IOS)、MacOS、Web、Linux、デスクトップ向けのアプリを単一のコードベースで構築できます。

注: 複数のオペレーティング システムを使用している場合、明らかに特定の調整を行う必要があります。

FLET を使用した非常に単純なアプリケーションの構築

FLETで簡単なアプリケーションを作ってみましょう。

たとえば、カウンターアプリケーションには

1. 1 つのテキスト フィールド
2. インクリメントとデクリメントの 2 つのボタン

コード スニペット

まず、カウンターアプリに必要なフレッツやその他の機能（ウィジェットなど）をインポートする必要があります。

 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") )

ここで、プレス イベントを処理する 2 つの関数を定義します。

 //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)

「メイン」を直接ターゲットとするこのコマンドを追加します

アプリを実行するには、次のコマンドを入力します

python filename.py

ファイルと同じディレクトリにいる必要があることに注意してください。

UI:

Flutter の概要セクションで述べたように、Flutter は Web ブラウザーでも使用できます。

そのためには少し調整が必要です。単純に追加

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

これが最終結果です

フレッツの詳細はこちら：

https://flet.dev/docs/roadmap