DataTable Scroll Down Automatically While Populating Rows

[AaronCatolico]

Question

Is there a way to get the table to scroll down automatically to the very bottom while populating in a loop?

Say that I click a start button and will have the DataTable populate with 10,000 rows in a for loop, how do I get the table to keep scrolling to the bottom automatically?

I see that the ListView control is able to do so with 'auto_scroll' set to 'True', but is the DataTable able to do so as well?

Code sample

import flet as ft
import time
import os

os.environ["FLET_WS_MAX_MESSAGE_SIZE"] = "8000000"

class Table(ft.UserControl):
    def __init__(self):
        super().__init__()

        self.dt_container = ft.Container(width=800, height=550, bgcolor='white', clip_behavior=ft.ClipBehavior.HARD_EDGE)

        self.rows = []

        self.dt = ft.DataTable(
            columns=[
                ft.DataColumn(
                ft.Text("#", font_family='poppins', size=14, weight='bold', color='#5d5d5d', width=60)),
                ft.DataColumn(ft.Text("First name", font_family='poppins', size=14, weight='bold', color='#5d5d5d', width=250)),
                ft.DataColumn(ft.Text("Last name", font_family='poppins', size=14, weight='bold', color='#5d5d5d')),
                ft.DataColumn(ft.Text("Google SERP", font_family='poppins', size=14, weight='bold', color='#5d5d5d')),
            ],
            rows = self.rows
        )

        self.add_rows_btn = ft.ElevatedButton('START', style=ft.ButtonStyle(bgcolor='green', color='white'), on_click=self.add_rows)

        self.dt_container.content = ft.Column([self.dt], scroll='AUTO', expand=1)


    def build(self):
        return ft.Column([self.dt_container, ft.Row([self.add_rows_btn], alignment=ft.MainAxisAlignment.CENTER)], alignment=ft.MainAxisAlignment.CENTER)


    def add_rows(self, e):
        for i in range(1, 15001):
            self.rows.append(ft.DataRow(cells=[
                ft.DataCell(ft.Text(f'# {i}', font_family='poppins', size=14, weight='bold', color='#5d5d5d')),
                ft.DataCell(ft.Text('John', font_family='poppins', size=14, weight='bold', color='#5d5d5d')),
                ft.DataCell(ft.Text('Smith', font_family='poppins', size=14, weight='bold', color='#5d5d5d')),
                ft.DataCell(ft.Image(src='./assets/imgs/google-search/google-btn.svg', width=30, height=30)),
            ]))

            if i % 500 == 0:
                self.dt.update()
                time.sleep(0.3)
        self.dt.update()


def MainApp(page:ft.Page):
    page.window_width = 800
    page.window_height = 700
    page.window_center()
    page.bgcolor='#424242'
    page.padding=20
    page.theme_mode='light'
    page.update()

    page.add(Table())

ft.app(target=MainApp, assets_dir='assets')

Error message

No response

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.