question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ClipToBounds on parent control is not clipping childrens visual while enabled Compositor

See original GitHub issue

Describe the bug In avaloniaUI you can clip childrens by enabling ClipToBounds property on parent control, additional supports clipping rounded corner. But there was a problem while I want clip corner in AvaloniaUI 11.0, it completely broken and you could see some unclipped corner on parent visual.

To Reproduce Steps to reproduce the behavior:

  1. Create a new project with Avalonia package, version 11.0-preview1
  2. Add a control, might be border, or any control supports CornerRadius property and clipping
  3. Add some childrens in parent control (with Panel wrapping), and fill them with colors
  4. Enable ClipToBounds in parent control, set CornerRadius 16 (or whatever numbers you want, but minimum 4)
  5. Run program, you will see such glitch I described in this issue.

or you can use project from my glitch reproduce repository

Expected behavior Parent control or visual should clip childrens and applying rounded corners clipping with compositor enabled. something like this: screenshot fragment, uses Avalonia 0.10.18, without compositor

Screenshots

In Material.Avalonia Demo:

image image image

In reproduce project:

image

Desktop (please complete the following information):

  • OS: Windows 10 Professional 21H2
  • Version: Avalonia 11.0.0-preview-1

Additional context Actually it can be fixed by disable compositor, but it supposed to work as well while compositor is enabled. Add above code to AppBuilder chain and you will disable compositor.

...
.With(new Win32PlatformOptions
{
    UseCompositor = false
})
...

Issue Analytics

  • State:closed
  • Created a year ago
  • Reactions:1
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
appleneko2001commented, Sep 23, 2022

Also, how to disable compositor in a mobile Android project?

Hi! Use AndroidPlatformOptions instead of Win32PlatformOptions:

.With(new AndroidPlatformOptions
{
    UseCompositor = false
})

Please refer AndroidPlatform.cs#L76 to know which avaloniaUI options have for Android platform

0reactions
kekekekscommented, Dec 28, 2022

This should be fixed by #9543

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why ClipToBounds = false not work?
ClipToBounds is false by default. However, clipping can still happen due to the way certain elements perform layout.
Read more >
UIElement.ClipToBounds Property (System.Windows)
The parent's Height / Width settings will not clip the content when ClipToBounds is false , but will clip the content if ClipToBounds...
Read more >
Viewport3D Class (System.Windows.Controls)
Gets or sets the geometry used to define the outline of the contents of an element. This is a dependency property. (Inherited from...
Read more >
Clip Behavior
Flutter unifies clipBehavior and defaults to not clip in most cases. ... none of the widgets' children expand outside their parent's boundary).
Read more >
Clipping for UMG Widgets in Unreal Engine
This widget clips to its bounds. It intersects those bounds with any previous clipping area. This clipping area cannot be ignored, it will...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found