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.

Sign up for GitHub

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

Jump to bottom

[Android] Fix issues clipping content in Border #7467

Merged
merged 1 commit into from
May 25, 2022
Merged

[Android] Fix issues clipping content in Border #7467

merged 1 commit into from
May 25, 2022
+6 −6

Conversation

jsuarezruiz
Copy link
Contributor

Description of Change

Fix issues clipping content in Border on Android. This definitely didn't work before #6851 and after remove platform-specific density calculations from the cross-platfor layer here e50621c, the issue is back. This PR include changes to maintain the density stuff at platform level but fix the clipping issues.

Screenshot_1653475967

<StackLayout>
    <Label 
        Text="Issue 7448 (Using Ellipse)"/>
    <Border 
        WidthRequest="150"
        HeightRequest="150"
        Stroke="#C49B33"
        StrokeThickness="4"
        Background="#2B0B98"
        HorizontalOptions="Center">
        <Border.StrokeShape>
            <Ellipse />
        </Border.StrokeShape>
        <Label Text=".N"
           VerticalOptions="Center"
           HorizontalOptions="Center"
           TextColor="White"
           FontSize="18"
           FontAttributes="Bold" />
    </Border>
    <Label 
        Text="Issue 7448 (Using EllipseGeometry)"/>
    <Border 
        WidthRequest="150"
        HeightRequest="150"
        Stroke="#C49B33"
        StrokeThickness="4"
        Background="#2B0B98"
        HorizontalOptions="Center">
        <Border.StrokeShape>
            <EllipseGeometry RadiusX="71" RadiusY="71" Center="75,75"/>
        </Border.StrokeShape>
        <Label Text=".N"
           VerticalOptions="Center"
           HorizontalOptions="Center"
           TextColor="White"
           FontSize="18"
           FontAttributes="Bold" />
    </Border>
    <Label 
        Text="Issue 7460"/>
    <Border 
        VerticalOptions="Center" HorizontalOptions="Center"
        HeightRequest="150" WidthRequest="150" Stroke="red" 
        StrokeThickness="6">
        <Border.StrokeShape>
            <RoundRectangle CornerRadius="100"/>
        </Border.StrokeShape>
        <Border.Content>
            <Grid>
                <Image Source="oasis.jpg" Aspect="AspectFill"  />
            </Grid>
        </Border.Content>
    </Border>
</StackLayout>

Issues Fixed

Fixes #7448
Fixes #7460

@jsuarezruiz jsuarezruiz added t/bug Something isn't working platform/android 🤖 area-drawing Shapes, Borders, Shadows, Graphics, BoxView, custom drawing labels May 25, 2022
jsuarezruiz
jsuarezruiz commented May 25, 2022
View reviewed changes
src/Controls/src/Core/Shapes/EllipseGeometry.cs
@@ -56,8 +56,8 @@ public double RadiusY
/// <include file="../../../docs/Microsoft.Maui.Controls.Shapes/EllipseGeometry.xml" path="//Member[@MemberName='AppendPath']/Docs" />
public override void AppendPath(PathF path)
{
var centerX = (float)RadiusX;
var centerY = (float)RadiusY;
var centerX = (float)Center.X;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

😲

Copy link

Choose a reason for hiding this comment

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

This #7460 issue still remains in Android

Unzip the below Project
BorderClipImage.zip

Screenshots

See the clipping issues in Android

In Android
image
In Windows
image

campersau
campersau reviewed May 25, 2022
View reviewed changes
src/Core/src/Platform/Android/ContentViewGroup.cs
Comment on lines 114 to 115
float w = (canvas.Width / density) - strokeThickness;
float h = (canvas.Height / density) - strokeThickness;
Copy link
Contributor

Choose a reason for hiding this comment

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

Is this correct? strokeThickness is now multiplied by density but canvas.Width / canvas.Height is divided by density.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

We apply a Scale by density after this.

@Redth Redth added this to the 6.0.3xx-sr1 milestone May 25, 2022
@Redth Redth merged commit 6655bb6 into main May 25, 2022
@Redth Redth deleted the fix-7448 branch May 25, 2022 17:27
@HausBJB
Copy link

HausBJB commented Jun 14, 2022 •
edited

This error persists

6.0.400 (Service Release 1)

#6805

@Ahamed-Ali
Copy link

Ahamed-Ali commented Jul 29, 2022 •
edited

Hi @jsuarezruiz @Redth

This #7460 issue still remains in Android

Unzip the below Project
BorderClipImage.zip

Screenshots

See the clipping issues in Android

In Android
image
In Windows
image

@github-actions github-actions bot locked and limited conversation to collaborators Dec 21, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@campersau campersau campersau left review comments

@Ahamed-Ali Ahamed-Ali Ahamed-Ali left review comments

@Redth Redth Redth approved these changes

Assignees
No one assigned
Labels
area-drawing Shapes, Borders, Shadows, Graphics, BoxView, custom drawing platform/android 🤖 t/bug Something isn't working
Projects
None yet
Milestone
6.0-sr1
Development

Successfully merging this pull request may close these issues.

Image Clipping issues in Border Border.Stroke Shape is not fully displayed
5 participants
@jsuarezruiz @HausBJB @Ahamed-Ali @Redth @campersau