[Flutter] How to get the list/tree of all the controls added to the page and how to get access...

I developed a simple app with Flet Python. The app contains some controls such as text and buttons organized in rows and columns. Here is my code:

import flet as ft

def main(page: ft.Page):
def Next_Image(e):
print(page.controls)

# CONTROLS DESIGN
cont = ft.Container(bgcolor=ft.colors.AMBER,
border=ft.border.all(3, ft.colors.RED),
width=250,
height=600,
)

button_previous_img = ft.IconButton(icon=ft.icons.ARROW_CIRCLE_LEFT, tooltip='Previous Image')
button_next_img = ft.IconButton(icon=ft.icons.ARROW_CIRCLE_RIGHT, tooltip='Next Image', on_click=Next_Image)
text_num_img = ft.Text(value="DOC")

# ADD CONTROLS TO THE PAGE
page.add(
ft.Column(
[
cont,
ft.Row(
[
button_previous_img,
text_num_img,
button_next_img
],
alignment=ft.MainAxisAlignment.CENTER,
)
],
horizontal_alignment = ft.CrossAxisAlignment.CENTER,
)

)
page.update()


ft.app(target=main)


I would like to retrieve the whole tree of children controls added to the page pressing a button. I'm able to display only the outmost control, specifically the column. Moreover, I would like to access to a control, let's say the container 'cont' inside the button event 'Next_Image()'. Is there a way to access to him with the name variable or with its index within the controls collection? Such as:

cont = page.controls["cont"] # with the variable name
cont = page.controls["4"] # with the variable index (assuming it's 4)

Continue reading...