Python self.page.snack_bar doesn't work in Flet

Question

I'm a beginner student and trying to validate my login code showing a snackbar mensage. There are no erros to run, but snackbar doesn't appear. At first a tried if a firebase authentication, and i think that could be wrong and tried with a simple condition, but doesn't work either, condition being right or not.

flet --version 0.27.1

what could be the problem? could someone help me? Thank You.

import flet as ft
from utilis.colors import *
from database.firebase_config import auth_pyrebase


class Login(ft.Container):
    def __init__(self, page: ft.Page):
        super().__init__()

        
        self.expand = True
        self.page = page

        self.user = ft.TextField(
                label= 'E-mail',
                border_color= BorderColor,
                width= 400,
            )

        self.password = ft.TextField(
                label= 'Password',
                password=True,
                can_reveal_password=True,
                border_color= BorderColor,
                width= 400,
            )
        
        self.btn_login = ft.ElevatedButton(
            text='Login',
            color= TxtColor,
            bgcolor=ButtonLoginColor,
            width=100,
            height= 40,
            on_click= self.login,
        )

        self.btn_singup = ft.ElevatedButton(
            text='Sign Up',
            color= TxtColor,
            bgcolor=ButtonSingupColor,
            width=100,
            height= 40,
            on_click= lambda e: page.go('/singup')
        )

        self.content = ft.Row(
            controls=[
                ft.Container(
                    expand= 1,
                    padding = ft.padding.all(20),
                    content = ft.Column(
                        alignment=ft.MainAxisAlignment.CENTER,
                        horizontal_alignment=ft.CrossAxisAlignment.CENTER,
                        controls=[
                        ft.Text('Login',
                                color=TxtColor,
                                size=40,
                                weight=ft.FontWeight.BOLD),
                        self.user,
                        self.password,
                        self.btn_login,
                        self.btn_singup,
                        ]
                    )                
                )            
            ]
        )

    def login(self, e):
        
        # try:
            # auth_pyrebase.sign_in_with_email_and_password(
            #     self.usuario.value, self.senha.value)
        if self.user.value == 'test' and self.password.value == 'test':
            self.page.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Login OK',
                    color='white',
                ),
                bgcolor='green',
                action='OK',
                duration=3000,
            )
            self.page.snack_bar.open = True
            self.page.update()
            self.user.value = ""
            self.password.value = ""

        else:
            self.page.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Erro',
                    color='white',
                ),
                bgcolor='red',
                action='OK',
                duration=3000,
            )
            self.page.snack_bar.open = True
            self.page.update()

            self.user.value = ""
            self.password.value = ""

I already try to copy a example in Flet Docs, but also doesn't work.

self.page.open(ft.SnackBar(
                ft.Text(
                    value='Login OK!',
                    bgcolor='green',
                    action='OK',
                    duration=3000,
                )))

Minimal Reproducible Example

import flet as ft

class Login(ft.Container):
    def __init__(self, page: ft.Page):
        super().__init__()

        self.page = page

        self.user = ft.TextField(
                label= 'E-mail'                
            )

        self.password = ft.TextField(
                label= 'Password',
             )
        
        self.btn_login = ft.ElevatedButton(
            text='Login',
            on_click= self.login,
        )
        
        self.content = ft.Row(
            controls=[
                ft.Container(
                    content = ft.Column(
                        controls=[
                        ft.Text('Login'),
                        self.user,
                        self.password,
                        self.btn_login,
                        ]
                    )                
                )            
            ]
        )

    def login(self, e):
     
        if self.user.value == 'test' and self.password.value == 'test':
            self.page.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Login OK',
                    color='white',
                ),
                bgcolor='green',
                action='OK',
            )
            self.page.snack_bar.open = True
            self.page.update()
        else:
            self.page.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Erro',
                    color='white',
                ),
                bgcolor='red',
                action='OK',
            )
            self.page.snack_bar.open = True
            self.page.update()

r-beginners · Accepted Answer · 2025-02-24 07:17:44Z

I am still new to Flet as well. First of all, I'm lumping all the login-related controls together into a class, but I don't need to set up a page for that. And if you look at the reference for the snack bar, after setting the snack bar, it opens it and refreshes the page, so rewriting it as follows will achieve the desired behavior.

import flet as ft

class Login(ft.Container):
    def __init__(self): #, page: ft.Page
        super().__init__()

        #self.page = page

        self.user = ft.TextField(
                label= 'E-mail'                
            )

        self.password = ft.TextField(
                label= 'Password',
             )
        
        self.btn_login = ft.ElevatedButton(
            text='Login',
            on_click= self.login,
        )
        
        self.content = ft.Row(
            controls=[
                ft.Container(
                    content = ft.Column(
                        controls=[
                        ft.Text('Login'),
                        self.user,
                        self.password,
                        self.btn_login,
                        ]
                    )                
                )            
            ]
        )

    def login(self, e):
     
        if self.user.value == 'test' and self.password.value == 'test':
            self.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Login OK',
                    color='white',
                ),
                bgcolor='green',
                action='OK',
            )
            self.page.open(self.snack_bar)
            self.page.update()
        else:
            self.snack_bar = ft.SnackBar(
                ft.Text(
                    value='Erro',
                    color='white',
                ),
                bgcolor='red',
                action='OK',
            )
            self.page.open(self.snack_bar)
            self.page.update()

def main(page: ft.Page):
    page.title = "Flet login test"

    page.add(
        ft.Column(
            [
                Login()
            ]
        )
    )

ft.app(target=main)

To further class the snack bar and update the error messages and background color, it is possible to

import flet as ft

class Login(ft.Container):
    def __init__(self): 
        super().__init__()

        self.user = ft.TextField(
                label= 'E-mail'                
            )

        self.password = ft.TextField(
                label= 'Password',
             )
        
        self.btn_login = ft.ElevatedButton(
            text='Login',
            on_click= self.login,
        )

        self.snack_bar = ft.SnackBar(
            content=ft.Text(
                value='',
                color='white'
            ),
            bgcolor='green',
            action='OK'
        )
        self.snack_bar.open = False

        self.content = ft.Row(
            controls=[
                ft.Container(
                    content = ft.Column(
                        controls=[
                        ft.Text('Login'),
                        self.user,
                        self.password,
                        self.btn_login,
                        self.snack_bar
                        ]
                    )                
                )            
            ]
        )

    def login(self, e):
     
        if self.user.value == 'test' and self.password.value == 'test':
            self.snack_bar.content.value='Login OK'
            self.snack_bar.open=True
            self.snack_bar.update()
        else:
            self.snack_bar.content.value='Erro'
            self.snack_bar.bgcolor='red'
            self.snack_bar.open=True
            self.snack_bar.update()

def main(page: ft.Page):
    page.title = "Flet login test"

    page.add(
        ft.Column(
            [
                Login()
            ]
        )
    )

ft.app(target=main)

JP_INC · Accepted Answer · 2025-02-25 16:18:25Z

0

Hello friend I also had that problem , but since I use it so it works try with the code below. if you do not have instantiated page use only page.update().

snackbar=ft.SnackBar(
    content=ft.Text(
        value="Login Ok",
        bgcolor="white",
    ),
    bgcolor="green",
    action="ok",
    duration=3000
)
self.page.overlay(snackbar)
snackbar.open=True
self.page.update()

answered Feb 25 at 16:18

JP_INC

1

1 Comment

Community Feb 26 at 9:27

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Joapin · Accepted Answer · 2025-11-15 21:18:09Z

0

I get the same proplem and try fix like this but for text only:

def login(e):
            if not email_field.value or not password_field.value:
                snackbar=ft.SnackBar(
                    content=ft.Text(
                        value="Enter email and password!",
                    ),
                    bgcolor="red",
                    action="ok",
                    duration=3000
                )
                self.page.overlay.append(snackbar)
                snackbar.open=True
                self.page.update()
                return

answered Nov 15 at 21:18

Joapin

11 bronze badge

Collectives™ on Stack Overflow

Python self.page.snack_bar doesn't work in Flet

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related