Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Windows] Fixes border content clipping #17310

Merged
merged 15 commits into from
Sep 25, 2023
Merged

[Windows] Fixes border content clipping #17310

merged 15 commits into from
Sep 25, 2023

Conversation

emaf
Copy link
Contributor

@emaf emaf commented Sep 11, 2023

Description of Change

Fixes clip path size to consider the border stroke thickness, so it only uses the inner space. For the space the border takes we consider both sides (top and bottom, or left and right) and not just the thickness.

On top of that, the clip should not be sentered with the content, so we need to offset it based on the contents position.

Issues Fixed

Fixes #17109
Fixes #16444
Fixes #17500

Fixes clip path size to consider the border stroke thickness, so it only uses the inner space. For the space the border takes we consider both sides (top and bottom, or left and right) and not just the thickness.

On top of that, the clip should not be sentered with the content, so we need to offset it based on the contents position.
Fixes clip path size to consider the border stroke thickness, so it only uses the inner space. For the space the border takes we consider both sides (top and bottom, or left and right) and not just the thickness.

On top of that, the clip should not be sentered with the content, so we need to offset it based on the contents position.
Add stroke thickness to polygon border
@emaf
Copy link
Contributor Author

emaf commented Sep 11, 2023

This PR partially fixes how content in borders with shapes other than rectangles clip, but there are still two problems:

  1. When the border shape is a polygon, the content goes over the border. The problem seems to be the Polygon's shape GetPath method is not considering the bounds set on GetPathForBounds.
  2. When scaling images, the clip seems to be scaled too.

clipping problems

@emaf
Copy link
Contributor Author

emaf commented Sep 11, 2023

  1. When the border shape is a polygon, the content goes over the border. The problem seems to be the Polygon's shape GetPath method is not considering the bounds set on GetPathForBounds.

Polygon just returns the original path: https://github.com/dotnet/maui/blob/main/src/Controls/src/Core/Shapes/Polygon.cs#L53-L68. And this is something that happens with other shapes too, like polyline https://github.com/dotnet/maui/blob/main/src/Controls/src/Core/Shapes/Polyline.cs.

On the other hand, ellipse does consider the bounds through Width/HieghtForPathComputation https://github.com/dotnet/maui/blob/main/src/Controls/src/Core/Shapes/Ellipse.cs#L30-L45, which maks it work correctly.

@samhouts samhouts added this to the .NET 8 GA milestone Sep 11, 2023
@samhouts samhouts added the stale Indicates a stale issue/pr and will be closed soon label Sep 19, 2023
@samhouts
Copy link
Member

Is this ready for review?

@samhouts samhouts added the s/pr-needs-author-input PR needs an update from the author label Sep 19, 2023
@ghost
Copy link

ghost commented Sep 19, 2023

Hi @emaf. We have added the "s/pr-needs-author-input" label to this issue, which indicates that we have an open question/action for you before we can take further action. This PRwill be closed automatically in 14 days if we do not hear back from you by then - please feel free to re-open it if you come back to this PR after that time.

@jstedfast jstedfast marked this pull request as ready for review September 20, 2023 18:48
@jstedfast jstedfast requested a review from a team as a code owner September 20, 2023 18:48
@jstedfast
Copy link
Member

Filed the Image clipping issue here: #17523

jstedfast
jstedfast previously approved these changes Sep 20, 2023
@@ -45,6 +45,18 @@
<MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#FFFFFF" BaseSize="168,208" />
</ItemGroup>

<ItemGroup>
<Compile Update="Elements\Border1.xaml.cs">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we can remove these

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed (thanks to jeff earlier)

@jstedfast jstedfast removed the s/pr-needs-author-input PR needs an update from the author label Sep 22, 2023
@jstedfast jstedfast removed the stale Indicates a stale issue/pr and will be closed soon label Sep 22, 2023
@BretJohnson BretJohnson self-assigned this Sep 25, 2023
@BretJohnson
Copy link
Member

Fully enabling the tests is now moved a separate PR, here: #17633, so that we can merge this PR ASAP.

@PureWeen PureWeen enabled auto-merge (squash) September 25, 2023 23:28
@PureWeen PureWeen merged commit ca12263 into main Sep 25, 2023
47 checks passed
@PureWeen PureWeen deleted the dev/ema/clip branch September 25, 2023 23:28
@github-actions github-actions bot locked and limited conversation to collaborators Dec 6, 2023
@samhouts samhouts added the fixed-in-8.0.0-rc.2.9373 Look for this fix in 8.0.0-rc.2.9373! label Aug 2, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
fixed-in-8.0.0-rc.2.9373 Look for this fix in 8.0.0-rc.2.9373! platform/windows 🪟
Projects
None yet
5 participants