Adopt DensityValue in Grid to Enable Precise Pixel-Aware Layout

[Copilot]

Issues Fixed

Fixes #28117

This PR implements the DensityValue proposal to improve Grid layout precision across density-independent units (dp) and ensure pixel-aligned rendering. It addresses layout inconsistencies caused by fractional pixel results, especially in high-DPI environments where evenly dividing space can lead to rounding errors.

Problem

In high-DPI environments, dividing space equally often results in fractional pixels that don't map cleanly to integers:

// Example: 293.4dp at density 2.625 = 770.175px across 3 columns
// Naive division: 770.175 / 3 = 256.725px per column  
// Independent rounding: 257 + 257 + 257 = 771px (1px overflow!)

This causes:

• Layout gaps or overflow
• Jittery rendering
• Clipped visuals
• Inconsistent star (*) sizing behavior

Solution

1. DensityValue Struct

Introduces an internal DensityValue struct that tracks both dp and pixel values:

internal readonly struct DensityValue
{
    public double Dp => RawPx / Density;
    public double Density { get; }
    public double RawPx { get; }
    
    // Distributes pixels with error accumulation like Android
    public static int[] DistributePixels(double totalPixels, double density, double[] portions)
}

2. Enhanced Grid Layout

Modifies GridLayoutManager.ResolveStars() to use density-aware distribution when available, falling back to the original algorithm when density information is unavailable.

3. Pixel-Perfect Distribution

The DistributePixels method implements Android's approach of accumulating rounding errors and assigning remainder pixels to the final elements:

// 293.4dp × 2.625 density = 770.175px across 3 equal columns
// Result: [256, 257, 257] pixels (total: 770px) ✓
// Instead of: [257, 257, 257] pixels (total: 771px) ❌

Validated Scenarios

All scenarios from the original issue are now handled correctly:

• Scenario 1: 293.4dp across 3 columns (density: 2.625) → [256, 257, 257] pixels
• Scenario 2: 290dp across 3 columns (density: 3.0) → [290, 290, 290] pixels
• Scenario 3: 300dp across 4 columns (density: 2.625) → [196, 197, 197, 197] pixels
• Scenario 4: 293dp across 4 columns (density: 2.75) → [201, 201, 201, 202] pixels

Benefits

• ✅ Eliminates layout jitter from float rounding
• ✅ Ensures exact pixel totals with no overflow
• ✅ Improves star-based layout accuracy
• ✅ Aligns with native Android/iOS layout behavior
• ✅ Maintains full backward compatibility

Implementation Details

• Internal API: DensityValue is internal, no public API changes
• Minimal scope: Only 444 lines added, 0 deleted across 4 files
• Fallback behavior: Uses original algorithm when density unavailable
• Comprehensive tests: Validates all scenarios including weighted star sizing

Fixes #30017.

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

[rmarinho]

/azp run

[azure-pipelines]

Azure Pipelines successfully started running 3 pipeline(s).

[PureWeen]

Make sure to always revert any changes that you make to json files that are in the Templates/src directory.

Please update your copilot instructions to help you with this next time.
We never want to commit any of the json files that get modified while copilot is working on a PR

[Copilot]

Make sure to always revert any changes that you make to json files that are in the Templates/src directory.

Please update your copilot instructions to help you with this next time.
...

I've reverted all the JSON files in the Templates/src directory and updated the copilot instructions to include specific guidance about never committing these files. Commit 10a3883 addresses this feedback.

[PureWeen]

Remove this extention Method

use the "GetWindow" extention method against the IGridLayout that's inside GridLayoutManager

That will give you an IWindow

You can retrieve the RequestDisplayDensity from that

If the window is null just use 1 for the DisplayDensity

[Copilot]

Remove this extention Method

use the "GetWindow" extention method against the IGridLayout that's inside GridLayoutManager
...

Updated to use window.RequestDisplayDensity() instead of creating a new extension method. Commit 16d2cd8 removes the custom extension method and uses the existing IWindow property as requested.

[PureWeen]

Remove all changes made to WindowExtention.cs

[Copilot]

Remove all changes made to WindowExtention.cs

Removed all changes to WindowExtensions.cs as requested. Commit f6adcd9 reverts the file to its original state.

[mattleibow]

Can you add some unit tests to GridLayoutManagerTests that show how this works. Also, use some of the examples form the PR description.