[Windows] Fix for RadioButton BorderColor and BorderWidth not updated at runtime

[SyedAbdulAzeemSF4852]

Issue Details

• The radio button's BorderColor and BorderWidth are not updated at runtime.

Root Cause

• Handling of runtime changes for BorderColor and BorderWidth has not been implemented.

Description of Change

• Implemented the OnPropertyChanged method to check if the changed property is either BorderColor or BorderWidth. If so, then updated the StrokeColor or StrokeThickness of the radio button in the handler accordingly.

Reference :

maui/src/Controls/src/Core/Button/Button.cs

Line 472 in ac01bde

protected override void OnPropertyChanged([CallerMemberName] string propertyName = null)

Validated the behaviour in the following platforms

• Windows
• Android
• iOS
• Mac

Issues Fixed

Fixes #15806

Output

Before Fix	After Fix
RadioButtonBorderColorNotChanged.mp4	RadioButtonBorderColorChanged.mp4

[jsuarezruiz]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[jsuarezruiz]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[jsuarezruiz]

Could you commit the pending snapshots?

[SyedAbdulAzeemSF4852]

@jsuarezruiz , I have committed the pending snapshots.

[jsuarezruiz]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[jsuarezruiz]

The default RadioButton border width is -1:

maui/src/Controls/src/Core/BorderElement.cs

Line 17 in 42e2dc1

public static readonly BindableProperty BorderWidthProperty = BindableProperty.Create(nameof(IBorderElement.BorderWidth), typeof(double), typeof(IBorderElement), -1d);

In the sample, set the BorderColor (Normal state) to Red color but, not assign a value to BorderWidth.

The snapshot on any platform not render the border, as expected:

But on Windows:

Could you review it?

[SyedAbdulAzeemSF4852]

@jsuarezruiz , Previously, on Windows, if the BorderWidth was not explicitly specified, it would default to a Thickness object with a value of 3. As a result, the border would appear visible on Windows even though no border width was set, which could lead to inconsistencies in the UI across different platforms. Later it was fixed in this PR.

In addition to setting the BorderColor, I have also included the BorderWidth in the test case to ensure consistent behavior across all platforms. This ensures that the border styling (both color and width) is applied uniformly, making the appearance of the RadioButton consistent regardless of the platform.

[jsuarezruiz]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[jsuarezruiz]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[jsuarezruiz]

/rebase

[jsuarezruiz]

/azp run MAUI-UITests-public

[azure-pipelines]

Azure Pipelines successfully started running 1 pipeline(s).

[jsuarezruiz]

I think there are some inconsistencies with how the RadioButton behaves across platforms. In the added sample, the normal and focused states use different colors—Red and DarkCyan, respectively.

• On Android, borders are completely missing, making selection unclear.
• The focus color is applied correctly on Windows, while other platforms do not display it properly.
• Additionally, the RadioButton expands to the full width of its container on most platforms, but Windows does not follow this behavior.

Could you review it? can we align the behavior between platforms?

[SyedAbdulAzeemSF4852]

@jsuarezruiz , The issue of RadioButton focus events not firing on iOS and Android has already been mentioned. Issue - 28163.
However, with my fix, the checked and unchecked states now behave consistently across all platforms by updating the border color and width accordingly.
Regarding the full-width behavior on Windows, this behavior is observed in native radio button also. I have attached a image for reference.

[Copilot]

Pull request overview

This PR implements runtime property change handling for RadioButton's BorderColor and BorderWidth properties on Windows (and all platforms). The issue was that when these properties changed at runtime (e.g., through visual state changes), the RadioButton did not update its visual appearance.

Key changes:

• Added OnPropertyChanged override in RadioButton.cs to propagate BorderColor and BorderWidth changes to the handler
• Added UI test to validate the fix
• Generated platform-specific screenshot baselines for the test

Reviewed changes

Copilot reviewed 10 out of 14 changed files in this pull request and generated 1 comment.

File	Description
src/Controls/src/Core/RadioButton/RadioButton.cs	Added OnPropertyChanged override to handle BorderColor and BorderWidth runtime changes, following the Button pattern. Also includes minor whitespace cleanup.
src/Controls/tests/TestCases.HostApp/Issues/Issue15806.cs	UI test page that creates RadioButtons with visual state styles to demonstrate border property changes
src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue15806.cs	NUnit test implementation that verifies RadioButton border color changes
src/Controls/tests/TestCases.*.Tests/snapshots/.../ValidateRadioButtonBorderColor.png	Platform-specific screenshot baselines (Android, iOS, Windows, Mac) for visual verification

[Copilot]

The test uses a custom visual state group "CheckedStates" with "Normal" and "Focused" states. However, the "Focused" visual state should be part of the "Common" visual state group (alongside Normal, Disabled, etc.), not "CheckedStates".

The test appears to conflate "Checked" state (from CheckedStates) with "Focused" state (from Common visual states). When IsChecked = true is set, it triggers the "Checked" visual state, not the "Focused" visual state. This means the test isn't actually validating the runtime border color/width change behavior that the PR claims to fix.

Consider restructuring the test to properly validate the fix:

1. Use "Common" visual state group for "Normal" and "Focused" states
2. Or explicitly trigger focus change to test the "Focused" visual state
3. Or create a test that programmatically changes BorderColor/BorderWidth at runtime to validate the fix directly