NuGet.Client icon indicating copy to clipboard operation
NuGet.Client copied to clipboard

Fixes resizing behavior of the filters in the PMUI top panel

Open jebriede opened this issue 2 months ago • 2 comments

Bug

Fixes: https://github.com/NuGet/Home/issues/13002 https://github.com/NuGet/Home/issues/14221

Description

The filters in the PM UI top panel (include prerelease and show only vulnerable packages) are set to trim the text if the window size is too small or if the font is too large for the text to fit. As part of that change, a max width was set on the columns containing the checkboxes but that prevents the checkbox text from growing past that point if the text size is increased, even if there's additional room for the checkbox text to grow.

The proposed fix #6908 offers a solution for this issue using a custom computation in codebehind. This fix is an alternative to that solution that resolves the issue exclusively in WPF and reacts to text size changes and window resizing.

Some of the principal features of this fix are that each of the filter checkboxes will collapse proportionally, they will be left justified and will not "float" away from each other as the screen size is increased, and they will resize dynamically along with window resizing and text scaling changes.

Additionally, I added tooltips to the filter checkboxes so the full text will display when hovered over. This will help in cases where the full text is truncated and also with keyboard navigation and accessibility.

Here are some screenshots demonstrating the behavior:

Starting text sizing (120%): image

Starting text sizing (120%), shrunken window size: image

Starting text sizing (120%), even smaller window size: image

Increased text size (185%) with same screen size: image

Large text size (185%) with VS maximized: image

Tooltip example (both filters now have tooltips): image

Note: I also included a fix for the grid column number for the Package Sources grid. It was previously specified as 2 when it should be 1.

PR Checklist

  • [x] Meaningful title, helpful description and a linked NuGet/Home issue
  • [ ] ~Added tests~ Manually tested
  • [ ] ~Link to an issue or pull request to update docs if this PR changes settings, environment variables, new feature, etc.~

jebriede avatar Nov 13 '25 00:11 jebriede

This PR contains changes to XAML files. Verify that you've completed the following tasks:

This PR contains changes to XAML files. Verify that you've completed the following tasks:

Tested against the containing grid and each of the filter checkboxes: image

jebriede avatar Nov 13 '25 01:11 jebriede