Fix Image control not respecting VerticalOptions and HorizontalOptions on Windows

[Copilot]

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!

Problem

Image controls under WinUI were not respecting their VerticalOptions and HorizontalOptions properties, causing them to stretch to fill the available space instead of being positioned according to their alignment settings.

Before (WinUI):

Expected (Android behavior):

Root Cause

The ImageHandler.Windows.cs was missing mappings for HorizontalLayoutAlignment and VerticalLayoutAlignment properties to the corresponding Windows platform alignment properties. This caused Images with settings like VerticalOptions="Center" and HorizontalOptions="Center" to be ignored on Windows.

Solution

1. Added layout alignment extension methods in ImageViewExtensions.cs:

   • UpdateHorizontalLayoutAlignment() - Maps MAUI LayoutAlignment to Windows HorizontalAlignment
   • UpdateVerticalLayoutAlignment() - Maps MAUI LayoutAlignment to Windows VerticalAlignment

2. Updated property mapper in ImageHandler.cs to include alignment properties for Windows platform

3. Implemented mapping methods in ImageHandler.Windows.cs:

   • MapHorizontalLayoutAlignment() and MapVerticalLayoutAlignment()
   • Apply alignment to container when available, otherwise directly to the Image control
   • Updated SetupContainer() to apply alignment when container is created

4. Enhanced UpdateAspect method to clear alignment properties for non-AspectFill cases, allowing layout alignment to take precedence while preserving existing AspectFill center alignment behavior

Alignment Mapping

MAUI LayoutAlignment	Windows HorizontalAlignment	Windows VerticalAlignment
Start	Left	Top
Center	Center	Center
End	Right	Bottom
Fill	Stretch	Stretch

Testing

• ✅ All existing Image unit tests pass (29/29 Core + 136/136 Controls)
• ✅ Created comprehensive test case Issue30403 with multiple alignment scenarios
• ✅ Backward compatibility preserved - no breaking changes
• ✅ AspectFill behavior unchanged (still gets center alignment)

Files Changed

• src/Core/src/Platform/Windows/ImageViewExtensions.cs - Added alignment mapping methods
• src/Core/src/Handlers/Image/ImageHandler.cs - Added alignment property mappings for Windows
• src/Core/src/Handlers/Image/ImageHandler.Windows.cs - Implemented alignment mapping methods
• src/Controls/tests/TestCases.HostApp/Issues/Issue30403.xaml[.cs] - Test case
• src/Controls/tests/TestCases.Shared.Tests/Tests/Issues/Issue30403.cs - UI test

Fixes #30403.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[jsuarezruiz]

/azp run MAUI-UITests-public

[azure-pipelines]

Azure Pipelines successfully started running 1 pipeline(s).