flet のタブによるページ切り替え

やりたいこと

下記の画像のような感じでタブを切り替えによって、アプリの画面を変更したい

main.py (アプリの実行ファイル)

import flet as ft
from Stock import Stock
    
if __name__ == "__main__":
    def main(page: ft.Page):
        page.title = "test"
        page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
        
        t = ft.Tabs(
            selected_index=0,#選択しているタブ 
            animation_duration=200, #移動速度 
            tabs=[
                ft.Tab(
                    text="タイトル1",
                    content=ft.Container(
                        content=Stock()
                    ),
                ),
                ft.Tab(
                    text="タイトル２",
                    icon=ft.icons.SEARCH,
                    content=ft.Text("This is Tab 2"),
                ),
                ft.Tab(
                    text="タイトル3",
                    icon=ft.icons.SETTINGS,
                    content=ft.Text("This is Tab 3"),
                    ),
                ],
                unselected_label_color=ft.colors.GREY_400, #非表示のタブ色 
                expand=1,
                overlay_color=ft.colors.AMBER_300, #洗濯中のタブ色 
            )
        
        page.add(t)
        page.update()


    ft.app(target=main)

stock.py (Tab 1 の表示内容)

import flet as ft

class Stock(ft.UserControl):
    def __init__(self):
        super().__init__()

    def build(self):
        container = ft.Container


        return ft.Text("テスト")

タブの表示内容はft.tab(content=)に記載するので、別の.pyファイルクラスを作ってimport する。
タブの表示内容がファイル毎に別れるのでコードを見直す時確認しやすい。