{"id":28937256,"url":"https://github.com/fasilwdr/flet-model","last_synced_at":"2026-02-07T02:05:37.466Z","repository":{"id":264430510,"uuid":"811324117","full_name":"fasilwdr/Flet-Model","owner":"fasilwdr","description":"A Model-based router for Flet applications that simplifies the creation of multi-page applications.","archived":false,"fork":false,"pushed_at":"2025-05-27T09:14:26.000Z","size":53,"stargazers_count":12,"open_issues_count":1,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-02T12:05:57.407Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://pypi.org/project/flet-model/","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fasilwdr.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-06-06T11:29:43.000Z","updated_at":"2025-05-27T09:14:30.000Z","dependencies_parsed_at":"2024-11-24T09:18:28.817Z","dependency_job_id":"30d84306-a177-4d0e-9115-12f815fd74ef","html_url":"https://github.com/fasilwdr/Flet-Model","commit_stats":null,"previous_names":["fasilwdr/flet-model"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/fasilwdr/Flet-Model","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fasilwdr%2FFlet-Model","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fasilwdr%2FFlet-Model/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fasilwdr%2FFlet-Model/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fasilwdr%2FFlet-Model/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fasilwdr","download_url":"https://codeload.github.com/fasilwdr/Flet-Model/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fasilwdr%2FFlet-Model/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261367503,"owners_count":23147851,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-22T21:04:30.576Z","updated_at":"2026-02-07T02:05:37.459Z","avatar_url":"https://github.com/fasilwdr.png","language":"Python","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"# Flet Model\n\nA Model-based router for Flet applications that simplifies the creation of multi-page applications with built-in state management and navigation.\n\n[![PyPI Downloads](https://static.pepy.tech/personalized-badge/flet-model?period=total\u0026units=INTERNATIONAL_SYSTEM\u0026left_color=GREY\u0026right_color=BLUE\u0026left_text=downloads)](https://pepy.tech/projects/flet-model)\n\n\n## Installation\n\n```bash\npip install flet-model\n```\n\n## Core Features\n\n- Model-based view architecture\n- Automatic route handling and nested routes\n- Event binding with caching for improved performance\n- Built-in view state management\n- Navigation handling (drawers, bottom bar, FAB)\n- Thread-safe initialization hooks\n- Support for keyboard and scroll events\n- View caching system\n\n## Basic Usage\n\n```python\nimport flet as ft\nfrom flet_model import Model, route\n\n\n@route('home')\nclass HomeModel(Model):\n    # Layout configuration\n    vertical_alignment = ft.MainAxisAlignment.CENTER\n    horizontal_alignment = ft.CrossAxisAlignment.CENTER\n    padding = 20\n    spacing = 10\n\n    # UI Components\n    appbar = ft.AppBar(\n        title=ft.Text(\"Home\"),\n        center_title=True,\n        bgcolor=ft.Colors.SURFACE_CONTAINER_HIGHEST\n    )\n\n    controls = [\n        ft.Text(\"Welcome to Home Page\", size=24),\n        ft.ElevatedButton(\"Go to Profile\", on_click=\"navigate_to_profile\")\n    ]\n\n    def navigate_to_profile(self, e):\n        self.page.go('/home/profile')\n\n\n@route('profile')\nclass ProfileModel(Model):\n    # Layout configuration\n    vertical_alignment = ft.MainAxisAlignment.CENTER\n    horizontal_alignment = ft.CrossAxisAlignment.CENTER\n    padding = 20\n    spacing = 10\n\n    # UI Components\n    appbar = ft.AppBar(\n        title=ft.Text(\"Profile\"),\n        center_title=True,\n        bgcolor=ft.Colors.SURFACE_CONTAINER_HIGHEST\n    )\n\n    controls = [\n        ft.Text(\"Welcome to Profile Page\", size=24),\n    ]\n\n\ndef main(page: ft.Page):\n    page.title = \"Flet Model Demo\"\n    # Router is automatically initialized\n    page.go('/home')\n\n\nft.app(target=main)\n```\n\n## Advanced Features\n\n### 1. Route Data Passing\n\n```python\n# Navigate with data\nself.page.go('/products#id=123\u0026category=electronics')\n\n@route('products')\nclass ProductModel(Model):\n    def init(self):\n        # Access route data\n        product_id = self.route_data.get('id')\n        category = self.route_data.get('category')\n```\n\n### 2. Navigation Drawers\n\n```python\n@route('drawer-demo')\nclass DrawerModel(Model):\n    drawer = ft.NavigationDrawer(\n        controls=[\n            ft.NavigationDrawerDestination(\n                icon=ft.Icons.HOME,\n                label=\"Home\",\n                selected_icon=ft.Icons.HOME_OUTLINED\n            )\n        ]\n    )\n\n    end_drawer = ft.NavigationDrawer(\n        controls=[\n            ft.NavigationDrawerDestination(\n                icon=ft.Icons.SETTINGS,\n                label=\"Settings\"\n            )\n        ]\n    )\n\n    controls = [\n        ft.ElevatedButton('Open Drawer', on_click=lambda e: e.control.page.open(e.control.data), data=drawer),\n        ft.ElevatedButton('Open End Drawer', on_click=lambda e: e.control.page.open(e.control.data), data=end_drawer)\n    ]\n```\n\n### 3. Event Handlers and Lifecycle Hooks\n\n```python\n@route('events')\nclass EventModel(Model):\n    def init(self):\n        # Called before view creation\n        self.load_data()\n    \n    def post_init(self):\n        # Called after view creation\n        self.setup_listeners()\n    \n    def on_keyboard_event(self, e: ft.KeyboardEvent):\n        if e.key == \"Enter\":\n            self.handle_enter()\n    \n    def on_scroll(self, e: ft.OnScrollEvent):\n        if e.pixels \u003e= e.max_scroll_extent - 100:\n            self.load_more_data()\n```\n\n### 4. Floating Action Button\n\n```python\n@route('fab-demo')\nclass FABModel(Model):\n    floating_action_button = ft.FloatingActionButton(\n        icon=ft.Icons.ADD,\n        on_click=\"add_item\"\n    )\n    floating_action_button_location = ft.FloatingActionButtonLocation.END_DOCKED\n```\n\n### 5. Bottom Navigation\n\n```python\n@route('navigation')\nclass NavigationModel(Model):\n    navigation_bar = ft.NavigationBar(\n        destinations=[\n            ft.NavigationDestination(icon=ft.Icons.HOME, label=\"Home\"),\n            ft.NavigationDestination(icon=ft.Icons.PERSON, label=\"Profile\")\n        ],\n        on_change=\"handle_navigation\"\n    )\n```\n\n### 6. Overlay Controls\n\n```python\n@route('overlay')\nclass OverlayModel(Model):\n    overlay_controls = [\n        ft.Banner(\n            open=True,\n            content=ft.Text(\"Important message!\"),\n            actions=[\n                ft.TextButton(\"Dismiss\", on_click=\"dismiss_banner\")\n            ]\n        )\n    ]\n\n    def dismiss_banner(self, e):\n        self.page.close(e.control.parent)\n```\n\n### 7. Fullscreen Dialogs\n\n```python\n@route('dialog')\nclass DialogModel(Model):\n    fullscreen_dialog = True\n\n    controls = [\n        ft.Text(\"Dialog Content\"),\n        ft.ElevatedButton(\"Close\", on_click=\"close_dialog\")\n    ]\n\n    def close_dialog(self, e):\n        self.page.views.pop()\n        self.page.go(self.page.views[-1].route)\n```\n\n## Real-world Example\n\nHere's a complete example of a todo application using Flet Model:\n\n```python\nimport flet as ft\nfrom flet_model import Model, route\nfrom typing import List\n\n\nclass TodoItem:\n    def __init__(self, title: str, completed: bool = False):\n        self.title = title\n        self.completed = completed\n\n\n@route('todo')\nclass TodoModel(Model):\n    todos: List[TodoItem] = []\n\n    appbar = ft.AppBar(\n        title=ft.Text(\"Todo List\"),\n        center_title=True\n    )\n\n    def get_controls(self):\n        return [\n            ft.TextField(\n                hint_text=\"Add new todo\",\n                on_submit=\"add_todo\",\n                autofocus=True\n            ),\n            ft.Column(controls=self.get_todo_control())\n        ]\n\n    def get_todo_control(self):\n        return [\n            ft.Checkbox(\n                label=todo.title,\n                value=todo.completed,\n                on_change=lambda e, t=todo: self.toggle_todo(e, t)\n            ) for todo in self.todos\n        ]\n\n    controls = [\n            ft.TextField(\n                hint_text=\"Add new todo\",\n                on_submit=\"add_todo\",\n                autofocus=True\n            ),\n            ft.Column()\n        ]\n\n    def add_todo(self, e):\n        if e.control.value:\n            self.todos.append(TodoItem(e.control.value))\n            e.control.value = \"\"\n            self.controls[-1].controls = self.get_todo_control()\n            self.update()\n            e.control.focus()\n\n    def toggle_todo(self, e, todo):\n        todo.completed = e.control.value\n        self.update()\n\n\ndef main(page: ft.Page):\n    # No manual router initialization needed\n    page.go('todo')\n\n\nft.app(target=main)\n```\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n## License\n\nThis project is licensed under the MIT License.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffasilwdr%2Fflet-model","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffasilwdr%2Fflet-model","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffasilwdr%2Fflet-model/lists"}