flet 快速编写登录界面

#具体代码实现

# coding=utf-8

import flet as ft
from flet import (Column, Container, MainAxisAlignment, Page, Row,
                  Text, ElevatedButton, TextField, TextThemeStyle,
                  ThemeMode, UserControl, TextStyle, WindowDragArea)


class LoginPage(UserControl):
    """
    登录界面
    """

    def __init__(self):
        super().__init__()
        self.username = ft.Ref[ft.TextField]()
        self.password = ft.Ref[ft.TextField]()
        self.check_text = ft.Ref[ft.Text]()

    def left_container(self):
        return ft.Container(
            padding=ft.padding.all(0),
            margin=ft.margin.all(0),
            content=ft.Image(
                src=f"imgs/img.png",# 在项目目录下新建assets，保存资源文件
                width=380,
                fit=ft.ImageFit.COVER,
            ),
            alignment=ft.alignment.center,
            width=380,
            height=500,
            border_radius=ft.border_radius.horizontal(0, 15),
        )

    def right_container(self):
        return ft.Container(
            padding=ft.padding.only(20, 0, 20, 0),
            margin=ft.margin.all(0),
            content=ft.Column(
                [
                    Row(alignment=MainAxisAlignment.CENTER, controls=[
                        Text(value="—— XXX小工具 ——", style=TextThemeStyle.TITLE_LARGE, color=ft.colors.BLACK,
                             )]),
                    Row(alignment=MainAxisAlignment.CENTER,
                        controls=[TextField(ref=self.username, label="用户名", content_padding=10,
                                            on_focus=self.clean_text)]),
                    Row(alignment=MainAxisAlignment.CENTER,
                        controls=[TextField(ref=self.password, label="密码", password=True, content_padding=10,
                                            can_reveal_password=True, on_focus=self.clean_text)]),
                    Row(alignment=MainAxisAlignment.CENTER,
                        controls=[ElevatedButton(text="登录", width=300, on_click=self.checkLogin)]),
                    Row(alignment=MainAxisAlignment.CENTER,
                        controls=[Text(ref=self.check_text, color=ft.colors.RED_900, value=None, size=16)]),
                ], alignment=ft.MainAxisAlignment.CENTER, spacing=20
            ),
            alignment=ft.alignment.center,
            width=380,
            height=500,
            bgcolor=ft.colors.WHITE,
        )

    def checkLogin(self, e):
        if self.username.current.value.strip() == "" or self.password.current.value.strip() == '':
            self.check_text.current.value = '用户名或密码不能为空'
            self.update()
        elif self.username.current.value.strip() != "admin" and self.password.current.value.strip() != 'admin123':
            self.check_text.current.value = '用户名或密码错误'
            self.update()
        else:
          print("登录成功")

    def clean_text(self, e):
        self.check_text.current.value = None
        self.update()

    def build(self):
        return WindowDragArea(
            content=Container(
                alignment=ft.alignment.center,
                padding=ft.padding.all(0),
                margin=ft.margin.all(0),
                content=Row([
                    self.left_container(),
                    Column(
                        alignment=ft.MainAxisAlignment.CENTER,
                        controls=[
                            self.right_container()
                        ]
                    ),

                ], spacing=0)

            ),
            maximizable=False
        )

    def did_mount(self):

        self.page.vertical_alignment = ft.MainAxisAlignment.CENTER
        self.page.horizontal_alignment = ft.CrossAxisAlignment.START
        self.page.window_title_bar_hidden = True
        self.page.title = "登录窗口"
        self.page.window_width = 760
        self.page.window_height = 510
        self.page.window_resizable = False
        self.page.padding = 0
        self.page.spacing = 0
        self.page.window_center()

        def window_minimized(e):
            e.page.window_minimized = True
            e.page.update()

        def window_exit(e):
            e.page.window_close()
            e.page.window_destroy()

        self.page.overlay.append(ft.Row([ft.IconButton(icon=ft.icons.REMOVE, on_click=window_minimized),
                                         ft.IconButton(icon=ft.icons.CLOSE, on_click=window_exit)],
                                        alignment=ft.MainAxisAlignment.END, spacing=0), )
        self.page.update()
        

def main(page: ft.Page):
     page.add(
        LoginPage()
    )


if __name__ == '__main__':
    ft.app(main)