textfield for log view

[yincheng8]

Duplicate Check

• I have searched the opened issues and there are no duplicates

Describe the requested feature

I want to use textfield to create a log window for recording logs, but after recording a lot of logs, I cannot control the scrollbar of textfield. I want to know how to control it. I think there should be methods such as scoll_to-end

import time

import flet as ft
from datetime import datetime


def get_now_time():
    current_time = datetime.now()
    formatted_time = current_time.strftime('%Y-%m-%d %H:%M:%S')
    return formatted_time


def main(page: ft.Page):
    page.window.center()
    page.window.width = 480
    page.window.height = 320
    page.window.resizable = False

    def btn_click(e):
        print(e)
        for i in range(20):
            log_field.value += f"{get_now_time()}......{i + 1}\n"
            time.sleep(0.3)
            log_field.focus()
            page.update()

    log_field = ft.TextField(label='write log example', min_lines=8, max_lines=8, read_only=False,
                             value='-------------------Log-------------------\n')
    page.add(log_field)
    button = ft.ElevatedButton(text='start', color='#499c54', on_click=btn_click)
    row = ft.Row(
        controls=[
            ft.Text(),
            button],
        alignment=ft.MainAxisAlignment.END
    )
    page.add(row)
    page.update()


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

Suggest a solution

maybe add a func scoll_to_end

Screenshots

No response

Additional details

No response

[OwenMcDonnell]

What do you mean you "cannot control the scrollbar". I ran your code and was not able to detect any problem with scrolling.
If you want programmatic control of scrolling you might try putting the log items as ft.Text elements into a column and then use the scroll_to method there. Following is an example modification of your code to do that.

import time

import flet as ft
from datetime import datetime


def get_now_time():
    current_time = datetime.now()
    formatted_time = current_time.strftime('%Y-%m-%d %H:%M:%S')
    return formatted_time


def main(page: ft.Page):
    page.window.center()
    page.window.width = 480
    page.window.height = 360
    page.window.resizable = False

    def btn_click(e):
        print(e)
        for i in range(200):
            column_field.content.controls.append(ft.Text(f"{get_now_time()}......{i + 1}"))
            time.sleep(0.1)
            page.update()
    
    def jump_click(e):
        print(e)
        for i in range(200):
            column_field.content.scroll_to(delta=50)

    column_label = ft.Row(
        controls=[ft.Text("write log example")]

    )
    
    column_field = ft.Container(
            border=ft.border.all(5, ft.colors.GREY),
            border_radius=10,
            content=ft.Column(
                [ft.Text('--------------------------Log-------------------------')],
                scroll=ft.ScrollMode.ALWAYS,
                expand=True,
                spacing=10,
                height=200,
                width=float("inf"),
            )
        )

    page.add(column_label, column_field)
    start_button = ft.ElevatedButton(text='start', color='#499c54', on_click=btn_click)
    to_end_button = ft.ElevatedButton(text='jump scroll', color='#499c54', on_click=jump_click)
    row = ft.Row(
        controls=[
            ft.Text(),
            to_end_button,
            start_button],
        alignment=ft.MainAxisAlignment.END
    )
    page.add(row)
    page.update()


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

[yincheng-a]

Thank you for your reply，I use textfield to record logs, and during the process of recording logs, I want the scrollbar of textfield to always be at the bottom, that is, after clicking the button and waiting for all logs to be added, as the logs increase, my scrollbar should also move together instead of being in its original position。
The current effect:
The effect I want:

[ndonkoHenri]

Set Column.auto_scroll to True.

[yincheng8]

aha， How can I modify my code based on it？I think textField should also need a similar attribute，such as auto_scroll or scroll_to_end

[ndonkoHenri]

Seems like this issue doesn't have a proper fix in flutter yet. I found some SO threads, but nothing concrete honestly.

Let us know if you find a solution which could be implemented.

(You could alternatively make use of Columns combined with Text as suggested by Owen above.)

[yincheng-a]

Look forward to your good news