Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Label and focused_border_color do not work when focusing on the TextField #4662

Closed
1 task done
iilter opened this issue Jan 7, 2025 · 5 comments
Closed
1 task done

Comments

@iilter
Copy link

iilter commented Jan 7, 2025

Duplicate Check

Describe the bug

When focused in TextFiled, the label does not write over the border and does not change focused_border_color.
flet version 0.25.2
macOS Sequoia 15.2

Code sample

Code
class Field(TextField):
    def __init__(self, label=None, autofocus=False):
        super().__init__()
        self.label = label
        self.autofocus = autofocus
        self.filled = True
        self.label_style = TextStyle(
            size=12
        )
        self.border = InputBorder.OUTLINE
        self.border_color = Colors.GREEN_500
        self.focused_border_color = Colors.ORANGE_800
        self.focused_color = Colors.ORANGE_700

To reproduce

Görüntü 7 01 2025 21 13

Expected behavior

No response

Screenshots / Videos

Captures

Görüntü 7 01 2025 21 13

Operating System

macOS

Operating system details

Sequoia 15.2

Flet version

Flet version 0.25.2

Regression

No, it isn't

Suggestions

No response

Logs

Logs
[Paste your logs here]

Additional details

No response

@iilter
Copy link
Author

iilter commented Jan 7, 2025

I Tried with previous version 0.25.1 and did not work.

@iilter
Copy link
Author

iilter commented Jan 8, 2025

I tried same code on windows and it worked.
I think the problem is in macOs.
How can I solve this problem.
Flet version 0.25.2
image

@iilter iilter changed the title Label and focused_border_color does not work Label and focused_border_color do not work when focusing on the TextField Jan 9, 2025
@ap4499
Copy link

ap4499 commented Jan 11, 2025

The below is what I am getting:

image image

which I think is the intended behaviour?

import flet as ft

class Field(ft.TextField):
    def __init__(self, label=None, autofocus=False):
        super().__init__()
        self.label = label
        self.autofocus = autofocus
        self.filled = True
        self.label_style = ft.TextStyle(
            size=12
        )
        self.border = ft.InputBorder.OUTLINE
        self.border_color = ft.colors.GREEN_500
        self.focused_border_color = ft.colors.ORANGE_800
        self.focused_color = ft.colors.ORANGE_700


def main(page: ft.Page):
    page.title = "Custom TextField Example"

    # Create an instance of the custom Field
    custom_field = Field(label="Custom Field", autofocus=True)

    # Add the custom field to the page
    page.add(custom_field)

ft.app(target=main)

Tested on MacOS 15.2 - Flet 0.25.2

Could you please share a minimal reproducible example (similarly as I did above with a section of code which runs) if you're still getting this issue?

@iilter
Copy link
Author

iilter commented Jan 12, 2025

I think, I found the cause of the problem.
Firstly, let me share the working code and screenshot.

`
import flet as ft

class Field(ft.TextField):
def init(self, label=None, autofocus=False):
super().init()
self.label = label
self.autofocus = autofocus
# self.adaptive = True
self.filled = True
self.label_style = ft.TextStyle(
size=12
)
self.icon = ft.Icons.PERSON
self.border = ft.InputBorder.OUTLINE
self.border_color = ft.colors.GREEN_500
self.focused_border_color = ft.colors.ORANGE_800
self.focused_color = ft.colors.ORANGE_700

class CustomPage(ft.Container):
def init(self):
super().init()

    custom_field = Field(label="Custom Field 1", autofocus=True)
    custom_field2 = Field(label='Custom Field 2')

    self.content = ft.Column(
        controls=[
            custom_field,
            custom_field2
        ]
    )

def main(page: ft.Page):
page.title = "Custom TextField Example"

# page.adaptive = True

page_custom = CustomPage()
page.add(ft.SafeArea(page_custom))

ft.app(target=main)
`

and screenshot

Ekran Resmi 2025-01-12 12 44 46

When I open one of the two lines I closed as a comment line, it does not work, so adaptive = True.
It also does not work when using CupertinoTextField instead of TextField.

Ekran Resmi 2025-01-12 12 54 08 Ekran Resmi 2025-01-12 12 55 20 Ekran Resmi 2025-01-12 13 01 38

Note: The same code (with adaptive = True) works in Windows.

@ap4499
Copy link

ap4499 commented Jan 12, 2025

@iilter - I think the behaviour that is being displayed is correct.

  • Correct me if I am wrong, I haven't had an iPhone in a while - but isn't this behaviour simply tailoring the experience to match the native environment? (by using a Cupertino control)

That is, that on Mac/iOS, this is how users expect text boxes to behave?

Secondly:

  • On Windows, we would expect for Adaptive = True to have a nil effect (ie. as you say, it works). See the documentation here: https://flet.dev/docs/controls/textfield/
  • Effectively, that Adaptive = True is controlling whether or not the Cupertino control is slotted in when the environment is Darwin.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants