Skip to content

Fix pill-shaped focus ring on macOS 26#35393

Merged
kubaflo merged 6 commits into
dotnet:inflight/currentfrom
Dhivya-SF4094:fix-34899
May 25, 2026
Merged

Fix pill-shaped focus ring on macOS 26#35393
kubaflo merged 6 commits into
dotnet:inflight/currentfrom
Dhivya-SF4094:fix-34899

Conversation

@Dhivya-SF4094

@Dhivya-SF4094 Dhivya-SF4094 commented May 12, 2026

Copy link
Copy Markdown
Contributor

Note

Are you waiting for the changes in this PR to be merged?
It would be very helpful if you could test the resulting artifacts from this PR and let us know in a comment if this change resolves your issue. Thank you!

Issue Details:

Entry/Picker focus outline is misaligned with the control border, border radius of focus outline is too large

Root Cause:

On macOS (Liquid Glass), Apple changed UIKit so that a UITextField with BorderStyle = RoundedRect renders its keyboard focus ring as a fully rounded pill/capsule shape — instead of following the field's actual corner radius. This is the new
UIFocusHaloEffect behavior introduced in the Liquid Glass design language (WWDC 2025).

Description of change:

Overrode LayoutSubviews() in MauiTextField and NoCaretField to set a custom UIFocusHaloEffect whose path is a UIBezierPath.FromRoundedRect(Bounds, 5f). This matches UIKit's own RoundedRect corner radius so the halo aligns with the grey border.

Validated the behaviour in the following platforms

  • Android
  • Windows
  • iOS
  • Mac

Fixes

Fixes #34899

Screenshots

Before  After 
 
34899_BeforeFix.mov
  
34899_AfterFix.mov

@github-actions

github-actions Bot commented May 12, 2026

Copy link
Copy Markdown
Contributor

🚀 Dogfood this PR with:

⚠️ WARNING: Do not do this without first carefully reviewing the code of this PR to satisfy yourself it is safe.

curl -fsSL https://raw.githubusercontent.com/dotnet/maui/main/eng/scripts/get-maui-pr.sh | bash -s -- 35393

Or

  • Run remotely in PowerShell:
iex "& { $(irm https://raw.githubusercontent.com/dotnet/maui/main/eng/scripts/get-maui-pr.ps1) } 35393"

@kubaflo

kubaflo commented May 19, 2026

Copy link
Copy Markdown
Contributor

/review -b feature/regression-check -p ios

@kubaflo kubaflo left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you pleas review the failing tests?

@kubaflo

kubaflo commented May 19, 2026

Copy link
Copy Markdown
Contributor

/azp run maui-pr-uitests

@azure-pipelines

Copy link
Copy Markdown
Azure Pipelines successfully started running 1 pipeline(s).

@kubaflo

kubaflo commented May 19, 2026

Copy link
Copy Markdown
Contributor

/review -b feature/regression-check -p ios

@kubaflo

kubaflo commented May 20, 2026

Copy link
Copy Markdown
Contributor

/review -b feature/regression-check -p ios

@sheiksyedm

Copy link
Copy Markdown
Contributor

/azp run maui-pr-uitests , maui-pr-devicetests

@azure-pipelines

Copy link
Copy Markdown
Azure Pipelines successfully started running 2 pipeline(s).

@kubaflo

kubaflo commented May 24, 2026

Copy link
Copy Markdown
Contributor

/review -b feature/refactor-copilot-yml

@MauiBot MauiBot left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Expert Review — 1 findings

See inline comments for details.

@sheiksyedm

Copy link
Copy Markdown
Contributor

/azp run maui-pr-uitests , maui-pr-devicetests

@azure-pipelines

Copy link
Copy Markdown
Azure Pipelines successfully started running 2 pipeline(s).

@kubaflo kubaflo merged commit 041d947 into dotnet:inflight/current May 25, 2026
35 of 50 checks passed
@github-actions github-actions Bot added this to the .NET 10.0 SR8 milestone May 25, 2026
PureWeen pushed a commit that referenced this pull request Jun 2, 2026
<!-- Please let the below note in for people that find this PR -->
> [!NOTE]
> Are you waiting for the changes in this PR to be merged?
> It would be very helpful if you could [test the resulting
artifacts](https://github.com/dotnet/maui/wiki/Testing-PR-Builds) from
this PR and let us know in a comment if this change resolves your issue.
Thank you!

### Issue Details:

Entry/Picker focus outline is misaligned with the control border, border
radius of focus outline is too large

### Root Cause:
On macOS (Liquid Glass), Apple changed UIKit so that a UITextField with
BorderStyle = RoundedRect renders its keyboard focus ring as a fully
rounded pill/capsule shape — instead of following the field's actual
corner radius. This is the new
UIFocusHaloEffect behavior introduced in the Liquid Glass design
language (WWDC 2025).
 
### Description of change: 
Overrode LayoutSubviews() in MauiTextField and NoCaretField to set a
custom UIFocusHaloEffect whose path is a
UIBezierPath.FromRoundedRect(Bounds, 5f). This matches UIKit's own
RoundedRect corner radius so the halo aligns with the grey border.

### Validated the behaviour in the following platforms
- [ ] Android
- [ ] Windows
- [ ] iOS
- [x] Mac

### Fixes 
Fixes #34899 

### Screenshots
| Before  | After |
|---------|--------|
|  <video
src="https://github.com/user-attachments/assets/5b76f345-0af2-4d35-84d6-855bac2d1a70">
|   <video
src="https://github.com/user-attachments/assets/4d485a92-3bf0-48be-99c5-c351040ce373"> 
|

---------

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
PureWeen pushed a commit that referenced this pull request Jun 11, 2026
<!-- Please let the below note in for people that find this PR -->
> [!NOTE]
> Are you waiting for the changes in this PR to be merged?
> It would be very helpful if you could [test the resulting
artifacts](https://github.com/dotnet/maui/wiki/Testing-PR-Builds) from
this PR and let us know in a comment if this change resolves your issue.
Thank you!

### Issue Details:

Entry/Picker focus outline is misaligned with the control border, border
radius of focus outline is too large

### Root Cause:
On macOS (Liquid Glass), Apple changed UIKit so that a UITextField with
BorderStyle = RoundedRect renders its keyboard focus ring as a fully
rounded pill/capsule shape — instead of following the field's actual
corner radius. This is the new
UIFocusHaloEffect behavior introduced in the Liquid Glass design
language (WWDC 2025).
 
### Description of change: 
Overrode LayoutSubviews() in MauiTextField and NoCaretField to set a
custom UIFocusHaloEffect whose path is a
UIBezierPath.FromRoundedRect(Bounds, 5f). This matches UIKit's own
RoundedRect corner radius so the halo aligns with the grey border.

### Validated the behaviour in the following platforms
- [ ] Android
- [ ] Windows
- [ ] iOS
- [x] Mac

### Fixes 
Fixes #34899 

### Screenshots
| Before  | After |
|---------|--------|
|  <video
src="https://github.com/user-attachments/assets/5b76f345-0af2-4d35-84d6-855bac2d1a70">
|   <video
src="https://github.com/user-attachments/assets/4d485a92-3bf0-48be-99c5-c351040ce373"> 
|

---------

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area-controls-entry Entry community ✨ Community Contribution partner/syncfusion Issues / PR's with Syncfusion collaboration platform/ios platform/macos macOS / Mac Catalyst s/agent-reviewed PR was reviewed by AI agent workflow (full 4-phase review) version/iOS-26

Projects

None yet

Development

Successfully merging this pull request may close these issues.

.Net 10 Picker item not centered and wrong focus outline of Entry on Mac

7 participants