App Bar title displays incorrectly when text has gradient applied

[vanantwerp]

Can we access your project?

• [X] I give permission for members of the FlutterFlow team to access and test my project for the sole purpose of investigating this issue.

Current Behavior

The beginning and end of the title text are cut off. It seems to vary (sometimes cut off more than others), but it always displays incorrectly.

Expected Behavior

The full width of the text is displayed/the text is displayed correctly.

Steps to Reproduce

1. Create a new page with an app bar
2. Add some title text, issue seems to be more prominent with 11+ characters
3. Style the text with a gradient
4. Observe either in the test view or publishing to web. It might "get better" switching between devices, but a portion of the title text always remains cut off/incorrectly displayed

Bug Report Code (Required)

IT4OlcmAuItOxLlE0LrUbflR/SQ5KVM7apZNmOphTgAaF5fNGu4AeM7TTEpvZryrYHNYImeGgnEdxvfqkYXXCPZeA0+VbJt8zs8MWzrMIWelVcyaEs2vfW1SAtFUC0i43JjYnRBCJuliSV4H2U6TNt6tcCzUHZjBIkdEJsqbJdeK2SrDX1iXc2URm05KZDPz

Visual documentation

screenshots with gradient applied and text incorrectly displayed, and NO gradient and correct display

Environment

- FlutterFlow version: 4.1.61+
- Platform: mobile, web
- Browser name and version: Chrome 122.0.6261.112, Chrome (android) 126.0.6478.71, Firefox (android) 127.0
- Operating system and version affected: NA

[msusviela]

I was able to reproduce the issue, I will send it to the ENG team so they can work on this!

[msusviela]

After further debugging we found that it's an issue from Flutter's side.

I opened an issue there so they can look into it:
https://github.com/flutter/flutter/issues/150632

I'll be following this and will let you know as soon as I have an update

[vanantwerp]

@msusviela the flutter team added a response to that ticket that has gone unanswered. Also, I'm seeing now that this appears to be an issue with gradients applied to text generally. I have another example of text that is not in the App Bar, where I applied a gradient via the FlutterFlow UI, and it exhibits this issue.

[msusviela]

Hi @vanantwerp. Can you provide more details on the other place where it's reproducible so we can take a look at it?