[Question]I don´t understand the Navegation and Routing Tool #1889
-
QuestionHi, I am new to using Flet and I am having difficulty understanding Routing and Navgation and I need to make the TextButton 'Register' to go to another project which has a form to register. Code sample#This is the login form code
import flet
from flet import *
class InputField(UserControl):
def __init__(self, label, hint_text, marginTop, password=False):
super().__init__()
self.body = Container(
Row(
controls=[
TextField(
width=413,
height=70,
border_radius=10,
border_width=2,
border_color='#A44BFF',
bgcolor='#C4C4C4, 0.1',
text_style=TextStyle(color='white'),
password=password,
label=label,
hint_text=hint_text
)
]
),
margin=margin.only(top=marginTop),
alignment=alignment.center
)
def build(self):
return self.body
def main(page: Page):
page.title = 'EduConter - Iniciar Sesión'
page.theme_mode = 'DARK'
page.padding = 0
page.window_maximized = True
page.window_resizable = False
page.vertical_alignment = 'Center'
page.horizontal_alignment = 'Center'
login = Container(
Stack([
Image(
src='./imagenes/fondoLogin.jpg',
),
Container(
Container(
Column(
alignment=MainAxisAlignment.CENTER,
controls=[
Row(
alignment=MainAxisAlignment.CENTER,
controls=[
Image(
src='./imagenes/logoEduConter.png',
width=346,
height=243
)
]
),
Row(
controls=[
Text(
'Inicio de Sesión',
color='white',
weight='bold',
size=28,
)
]
),
InputField('Nombre de Usuario',
'Nombre de Usuario', 21),
InputField('Contraseña', 'Contraseña', 0, True),
Row(
controls=[
ElevatedButton(
content=Text(
'Inicia Sesión',
size=18,
weight='bold'),
width=413,
height=60,
color='white',
bgcolor='#AA16C8, 0.8',
style=ButtonStyle(
side={
'': BorderSide(2, '#A44BFF')
},
shape={
'': RoundedRectangleBorder(radius=10)
}
)
)
]
),
Container(
Row(
alignment=MainAxisAlignment.CENTER,
spacing=0,
controls=[
Text(
'¿No Tienes Cuenta?',
color='white',
size=14
),
TextButton(
content=Text(
'Registrate',
color='white',
size=14,
weight='bold',
),
style=ButtonStyle(
shape={
'':RoundedRectangleBorder(radius=0)
}
)
)
]
),
margin=margin.only(top=20)
)
],
),
alignment=alignment.center,
width=413,
height=page.window_height,
),
alignment=alignment.center,
),
]),
)
page.add(login)
page.update()
flet.app(target=main)
#And this is the register form code
import flet
from flet import *
class InputField(UserControl):
def __init__(self, label, hint_text, marginTop, password=False):
super().__init__()
self.body=Container(
Row(
controls=[
TextField(
width=413,
height=70,
border_radius=10,
border_width=2,
border_color='#3733FF',
bgcolor='#C4C4C4, 0.1',
text_style=TextStyle(color='white'),
label=label,
hint_text=hint_text,
password=password
)
]
),
alignment=alignment.center,
margin=margin.only(top=marginTop)
)
def build(self):
return self.body
def main(page: Page):
page.title = 'EduConter - Resgistro'
page.theme_mode = 'DARK'
page.padding = 0
page.window_maximized = True
page.resizable = False
page.vertical_alignment = 'Center'
page.horizontal_alignment = 'Center'
register = Container(
Stack([
Image(
src='./imagenes/fondoRegister.jpg'
),
Container(
Container(
Column(
alignment=MainAxisAlignment.CENTER,
controls=[
Row(
controls=[
Text(
'Registro',
color='white',
weight='bold',
size=28
)
]
),
InputField(
'Nombre Socio Mayoritario',
'Nombre Socio Mayoritario',
21,
False
),
InputField(
'Nombre de la Empresa',
'Nombre de la Empresa',
0,
False
),
Row(
controls=[
Dropdown(
label='Tipo de Sociedad',
hint_text='Tipo de Sociedad',
width=206.5,
height=70,
text_size=18,
bgcolor='#C4C4C4, 0.1',
border_radius=10,
border_width=2,
border_color='#3733FF',
color='white',
hint_style=TextStyle('white'),
options=[
dropdown.Option('Ltda.'),
dropdown.Option('E.U'),
dropdown.Option('S.A.S'),
dropdown.Option('S.A'),
dropdown.Option('S.C')
]
),
Dropdown(
label='Numero de Socios',
hint_text='Numero de Socios',
width=206.5,
height=70,
text_size=18,
bgcolor='#C4C4C4, 0.1',
border_radius=10,
border_width=2,
border_color='#3733FF',
color='white',
hint_style=TextStyle('white'),
options=[
dropdown.Option('1'),
dropdown.Option('2'),
dropdown.Option('3'),
dropdown.Option('4'),
dropdown.Option('5')
]
)
]
),
InputField(
'Contraseña',
'La Contraseña debe ser de mínimo 6 carácteres',
0,
True
),
InputField(
'Confirmar Contraseña',
'Confirmar Contrseña',
0,
True
),
Row(
controls=[
Container(
TextButton(
content=Text(
'Registrate',
color='white',
weight='bold',
size=18
),
width=413,
height=70,
style=ButtonStyle(
color='white',
shape={
'': RoundedRectangleBorder(radius=8)
}
),
on_click= lambda e: print('click :)')
),
width=413,
height=70,
border_radius=10,
border=border.all(2, '#3733FF'),
gradient=LinearGradient(
colors=['#3B7A7A', '#2A68E1, 0.39']
),
alignment=alignment.center
)
]
),
Row(
alignment=MainAxisAlignment.CENTER,
spacing=0,
controls=[
Text(
'¿Tienes Cuentas?,',
color='white',
weight='bold',
size=14
),
TextButton(
content=Text(
'Inicia Sesión',
color='white',
weight='bold',
size=14
),
style=ButtonStyle(
shape={
'':RoundedRectangleBorder(radius=0)
}
)
)
]
)
]
),
alignment=alignment.center,
width=413,
height=page.window_height,
),
alignment=alignment.center
),
]),
)
page.add(register)
page.update()
flet.app(target=main) Error messageNo response ------------------------------------------------------
|
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
I simply keep everything in one file divide it in frames no classes or anything and if project grows split in files but best is one file everything and proper comments divide the code using it properly keep backup always use some program that tracks your history you will be okay no need for routing or navigation for small websites just use navigation bar |
Beta Was this translation helpful? Give feedback.
-
Here is the flet guide on navigation and routing. |
Beta Was this translation helpful? Give feedback.
Here is the flet guide on navigation and routing.
Here is a community package to ease navigation and routing.