Skip to content

Some display issues in Flet 0.25.1 version #4517

Closed
@lasifea

Description

@lasifea

Duplicate Check

Describe the bug

  • The tooltips in the SegmentedButton and BarChartGroup components are escaped every time the page.update method is used.
  • The default border of the SegmentedButton component is missing.
  • When the hint_text property in the TextField component is not focused, it will not be displayed. Setting the max_length property does not have a default display value, and counter_text must be specified at the same time.
  • The FilledButton, Filled-DonalButton, and ElevatedButton components lack left and right padding, resulting in inconsistent button styles.

    Additionally, I hope the markdown component can support parsing brtags. (From machine translation, please understand if the expression is inaccurate.)

Code sample

Code
import flet as ft


def main(page: ft.Page):
    def open_dialog(e):
        dialog = ft.AlertDialog(content=ft.Text('This is a test.'), open=True)
        # page.overlay.append(dialog)
        # page.update()
        page.open(dialog)

    def change_theme(e):
        page.theme_mode = ft.ThemeMode.DARK if page.theme_mode == ft.ThemeMode.LIGHT else ft.ThemeMode.LIGHT
        page.update()

    page.vertical_alignment = ft.MainAxisAlignment.CENTER
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
    page.spacing = 15
    page.theme_mode = ft.ThemeMode.LIGHT

    segments = [
        ft.Segment('1', ft.Icon(ft.icons.LOOKS_ONE), ft.Text('cat', size=16), tooltip='喵喵喵'),
        ft.Segment('2', ft.Icon(ft.icons.LOOKS_TWO), ft.Text('dog', size=16), tooltip='wow wow wow')]
    segment_btn = ft.SegmentedButton(segments, selected={'1'},
                                     # style=ft.ButtonStyle(side=ft.BorderSide(width=1, color='secondary')),
                                     )

    name_input = ft.TextField(width=400, hint_text="What's your name?", max_length=20,
                              # counter_text='{value_length}/{max_length}',
                              )

    bar_group = ft.BarChartGroup(x=0, bar_rods=[ft.BarChartRod(to_y=40, color=ft.colors.AMBER, tooltip="苹果", width=20)])
    bar_group2 = ft.BarChartGroup(x=1, bar_rods=[ft.BarChartRod(to_y=80, color=ft.colors.BLUE, tooltip='banana', width=20)])
    labels = [ft.ChartAxisLabel(value=0, label=ft.Text("apple")),
              ft.ChartAxisLabel(value=1, label=ft.Text('banana'))]
    chart = ft.BarChart(bar_groups=[bar_group, bar_group2], border=ft.border.all(1, ft.colors.GREY_400),
                        left_axis=ft.ChartAxis(labels_size=40, title=ft.Text("fruits"), title_size=40),
                        bottom_axis=ft.ChartAxis(labels=labels, labels_size=32),
                        tooltip_bgcolor=ft.colors.with_opacity(0.5, ft.colors.GREY_300),
                        max_y=100, width=600)

    btn = ft.FilledButton('open dialog', on_click=open_dialog)
    btn2 = ft.FilledTonalButton('change theme', on_click=change_theme)
    btn3 = ft.ElevatedButton('没有事情发生')
    btn4 = ft.OutlinedButton("I'm still the same.")

    page.add(segment_btn, name_input, chart, btn, btn2, btn3, btn4)


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

To reproduce

  1. Click the switch theme button.
  2. Place the mouse on SegmentedButton and BarChartGroup components.

Expected behavior

  • I hope the default style of the component can maintain its previous appearance, but the default style of version 0.25 is strange.
  • And I hope the markdown component can support parsing brtags.

Screenshots / Videos

Captures

[Upload media here]
76e3b91fffb5f93cdd6d94c55eaa68f
0161904cedc2a51278251f7fd718de1
image

Operating System

Windows

Operating system details

Windows10

Flet version

0.25.1

Regression

Yes, it used to work in a previous Flet version (please specify the version in additional details)

Suggestions

No response

Logs

Logs
[Paste your logs here]

Additional details

No response

Metadata

Metadata

Assignees

Labels

bugSomething isn't workingcontrols

Type

No type

Projects

Status

✅ Done

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions