Pythonで簡単にアプリケーションを開発しょう！
🐍Pythonで開発した物を表現するには？
自分もそうですが、Pythonで学習したプログラムを見せる方法としては、WEBアプリケーションとして作成する、又はGUIアプリケーションとして作成する方法などがあります。
WEBアプリケーションとしては、DjangoやFlaskのフレームワークを使用するのが多いかと。
GUIアプリケーションに関しては、tkinterが情報が多いですね。
2023年1月にFletと呼ばれるGUIもWEBも作成できるフレームワークがでました。
少し前から気になっていたので、今回しっかり調べてみようと思います！
🔰Fletとは？
フロントエンドの経験がなくても、好きな開発言語 ※1 でWeb、モバイル、デスクトップのアプリケーションを作成できるフレームワークです。
※1：2023年03月時点ではPythonのみ（今後GoやC#も予定されているとの事）
The fastest way to build Flutter apps in Python | Flet
📄ドキュメントもサンプルパターンが多く掲載されており、非常にわかりやすいです。
🖥開発環境の準備
Python 3.7 以降が必要
モジュールをインストールします。
pip install flet
当方の開発環境
| 種類 | バージョン |
|---|---|
| OS | Windows 10 Home 22H2 64ビット メモリ16GB |
| Python | 3.11.1 |
| flet | 0..4.2 |
🐍最小のプログラム実行
公式ページに記載あるプログラムを動かしてみます。
Creating Flet apps in Python | Flet
import flet as ft
def main(page: ft.Page):
# add/update controls on Page
pass
ft.app(target=main)ローディングがぐるぐるまわっているWindowが表示されました。
📡WEBアプリケーションとして実行
ft.app に対してview を追加すればよいとの事。
さきほどのネイティブOS用アプリケーションをWEBブラウザで表示しています。
ft.app(target=main, view=ft.WEB_BROWSER)import flet as ft
def main(page: ft.Page):
# add/update controls on Page
pass
ft.app(target=main, view=ft.WEB_BROWSER)自動的にブラウザが起動して表示されました。
アドレスは 127.0.0.1:5439 でしたが、ポート番号はランダムなようです。
ポートを指定してWEBアプリケーションを実行
ft.app(target=main, port=25710, view=ft.WEB_BROWSER)import flet as ft
def main(page: ft.Page):
# add/update controls on Page
pass
ft.app(target=main, port=25710, view=ft.WEB_BROWSER)指定したポートで表示されました。
fletのWEBサーバーは
Fletd⚙コントロールを表示する
fletではユーザーインターフェイスの パーツの呼び方は コントロール。
コントロールを表示するにはPage又は他のコントロールに追加するか、他のコントロール内に追加する。
Pageは最上位のコントロール。
コントロール＝各パーツという認識で良いかと。
～表示までの流れ～
① ページのcontrolsにコントロール追加する。「page.controls.append(★コントロール★)」
② ページにコントロールをマウントする。「page.update()」
サンプルプログラム
import flet as ft
def main(page: ft.Page):
t = ft.Text(value="Hello, world!", color="green") # コントロール作成
page.controls.append(t) # controlsにコントロールを追加する
page.update() # ページにコントロールをマウントする
# ft.app(target=main, port=25710, view=ft.WEB_BROWSER)
ft.app(target=main, port=25710)①②の両方を実行してくれるショートカット
page.add(★コントロール★)page.controls.append(★コントロール★) → page.update()
コントロールを表示する別のやり方
空のコントロールを先に作成しておき、最終描画前に内容をセットする方法。
import time
import flet as ft
def main(page: ft.Page):
t = ft.Text() # 空のコントロールを作成
page.add(t) # ページのcontrolsにコントロール追加する → ページにコントロールをマウントする
# この時点で空のコントロールが描画されている
for i in range(10):
t.value = f"Step {i}" # コントロールのテキストを上書き
page.update() # ページにコントロールをマウントする
time.sleep(1) # 1秒待機
# ft.app(target=main, port=25710, view=ft.WEB_BROWSER)
ft.app(target=main, port=25710)
ここまででfletの基本となる部分は出来るようになったかと思います。
後は各コントロールの使い方、イベントの処理の仕方がわかれば、簡単に立派なアプリケーションが作成できます。
それぞれに関しては別記事で細かく書いていきたいと思います。
各コントロールの使い方
画面関連の設定方法
