iPhone focused / unfocused input states have different font size and padding

As per the video linked: on TextEdits on iOS devices, the FontSize and padding are unexcpectedly big when the input is not focused. When focussed, the input looks about the same as on non-iOS devices, but the padding is different. I am really not sure what to do to fix that.

file

edit: the upload didn’t work out, but here is a YT upload. Left is preview, right is iOS simulator: https://youtu.be/-xySfg96t_E

Here is the faulty code: putting a Rectangle inside the TextEdit causes the bad behaviour (but only in iOS).

    <TextEdit Value="Blablablabla"
                IsPassword="true">
        <Rectangle Margin="-10,40,-10,0" Height="2" Background="#2366B4"></Rectangle>
    </TextEdit>

Edit: actually no, even with the Rectangle outside I still have the same issue.

Two things:

  • The weird positioning of the text was likely due an interaction between the TextEdit and the Rectangle. I still don’t know which one, but placing each into different rows of a grid solved this problem
  • There is a bug when you give a TextFont to an IsPassword input. Sometimes the input color is wrong, sometimes the size between focused and unfocused is different. Apparently it depends on the font…

Hi!

Thanks for you report :slight_smile: I think these issues are caused by our textrendering and TextInput/TextEdit on iOS and Android. The trick we use is when you focus a TextInput we overlay a os native TextInput and when its unfocused we switch to a textrenderer and render the text with OpenGL. Which means we are susceptible for these kinds of bugs.

However, this will be fixed in the next major release. Then its native all the way :slight_smile: (instead of switching renderers we just render the native View via a GL texture)

Let me know if you have any further questions :slight_smile: