flet icon indicating copy to clipboard operation
flet copied to clipboard

Inconsistent height after adding child controls to the input box

Open lasifea opened this issue 4 months ago • 0 comments

Duplicate Check

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

Describe the bug

When I add a button control to the suffix of the TextField control, the height of the control is inconsistent with the height of the control without adding a suffix. I don't think this is a bug, but it has some impact on the appearance. (From machine translation, if the expression is not straightforward, please understand)

Code sample

Code
import flet as ft

def main(page: ft.Page):
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER
    # page.vertical_alignment = ft.MainAxisAlignment.CENTER
    page.window.width = 600
    page.window.height = 600
    page.padding = 50
    page.spacing = 20

    def btn_clicked(e: ft.ControlEvent):
        if btn.text == '错误信息提示':
            user_input.error_text = 'something wrong!'
            contact_input.error_text = 'something wrong!'
            verify_input.error_text = 'something wrong!'
            btn.text = '还原'
        else:
            user_input.error_text = ''
            contact_input.error_text = ''
            verify_input.error_text = ''
            btn.text = '错误信息提示'
        page.update()

    user_input = ft.TextField(label='请输入用户名', prefix_icon=ft.icons.PERSON, text_size=20)
    contact_input = ft.TextField(label='请输入用户绑定的邮箱或电话', prefix_icon=ft.icons.CONTACT_EMERGENCY, text_size=20,
                                 suffix=ft.Icon(ft.icons.QUESTION_MARK, color=ft.colors.SECONDARY, tooltip='对此有疑问'))
    verify_input = ft.TextField(label='请输入验证码', prefix_icon=ft.icons.KEY, text_size=20,
                                suffix=ft.FilledTonalButton('发送验证码'))
    btn = ft.ElevatedButton(text='错误信息提示', on_click=btn_clicked, height=45, width=180)

    page.add(user_input, contact_input, verify_input, btn)

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

To reproduce

The height of the first input box is inconsistent with that of the third input box.

Expected behavior

I hope the default input box can maintain consistent height without manually adjusting the size of the child controls.

Screenshots / Videos

Captures

[Upload media here] image

Operating System

Windows

Operating system details

Windows10

Flet version

0.24.1

Regression

I'm not sure / I don't know

Suggestions

No response

Logs

Logs
[Paste your logs here]

Additional details

No response

lasifea avatar Oct 22 '24 05:10 lasifea