Bug: Right aligned ComboBox popup drastically shifts to the right on opened

[0x5bfa]

Describe the bug

When you align ComBoBox to the right and open its popup, it is opened at a wrong position with the minimum width that includes chevron and its padding.

When I tried with the event of OnSelectionChanged and OnSizeChanged, those didn’t work.
However, a guy at UWP Community made it work, overriding MeasureOverride method and setting base width.

Steps to reproduce the bug

1. Add a ComboBox
2. Align to the right
3. Open its pop up

Expected behavior

ComboBox Opens its pop up with the item width.

Screenshots

NuGet package version

WinUI 3 - Windows App SDK 1.5.2: 1.5.240404000

Windows version

Windows 11 (22H2): Build 22621

Additional context

No response

[github-actions]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one. Thank you!

Open similar issues:

• Combobox changing size when popup open (#4551), similarity score: 0.76

Closed similar issues:

• ComboBox dropdown / flyout opens in the wrong location when using certain RelativePanel attached properties (#6554), similarity score: 0.77
• Opening list in ComboBox causes layout side effects (#6956), similarity score: 0.75
• The WinUI3 popup element can not exceed the parent window area！ (#7933), similarity score: 0.73
• Controls (dropdowns) that overhangs the title bar, not clickable (also in WinUI Gallery) (#8788), similarity score: 0.73

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[YourOrdinaryCat]

Setting the placeholder text to the current selection works as well - when the popup opens, the width seems to be measured based on the placeholder. Why ComboBox behaves this way is beyond me, but that's the workaround I'll be using for now.

[0x5bfa]

For anyone suffering from this behavior (original credit: Discord user @metrorail):

// Copyright (c) 2024 Files Community
// Licensed under the MIT License. See the LICENSE.

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Windows.Foundation;

namespace Files.App.UserControls
{
	public class ComboBoxEx : ComboBox
	{
		double _cachedWidth;

		protected override void OnDropDownOpened(object e)
		{
			Width = _cachedWidth;

			base.OnDropDownOpened(e);
		}

		protected override void OnDropDownClosed(object e)
		{
			Width = double.NaN;

			base.OnDropDownClosed(e);
		}

		protected override Size MeasureOverride(Size availableSize)
		{
			var baseSize = base.MeasureOverride(availableSize);

			if (baseSize.Width != 64)
				_cachedWidth = baseSize.Width;

			return baseSize;
		}
	}
}

[kmahone]

What is happening here is that when the combobox is opened, the currently selected item is moved into the popup menu so that it can be shown there. But since it was removed from the main part of the ComboBox, that can cause the ComboBox to re-layout at a smaller size and so you get this jarring behavior.

ComboBox should maintain its width when it opens its popup to prevent this issue from happening. The "ComboBoxEx" workaround proposed does that.

Another workaround here would be to set a MinWidth on the ComboBox so that it maintains its size regardless of the selected item.