| ID | Project | Category | View Status | Date Submitted | Last Update |
|---|---|---|---|---|---|
| 0001850 | NoesisGUI | C++ SDK | public | 2020-11-30 16:32 | 2020-11-30 18:20 |
| Reporter | steveh | Assigned To | sfernandez | ||
| Priority | normal | Severity | minor | ||
| Status | resolved | Resolution | no change required | ||
| Product Version | 3.0.7 | ||||
| Summary | 0001850: Inconsistent clipping inside grid cell | ||||
| Description | Hi guys, I've finally been able to track down some odd inconsistent clipping behaviour: https://www.noesisengine.com/xamltoy/72e6e2aa974cac7e8f182f717bed033f So you can see that we have a 599x300 grid cell that contains a listbox. Nothing should be clip to bounds. The listbox is 600 pixels high so the listbox is just slightly too large to fit into the cell. If we set the RowDefinition so it's height goes from 599 -> 600 so it can fit the listbox, it doesn't clip the listbox, nor any of the listbox items. It seems like the second the parent listbox can't be contained inside the grid bounds, it clips to the entire cell grid cell, even though it shouldn't from what I can see. This same code behaves fine in WPF / Blend. We see this behaviour quite a lot because we have a "focus" animation which usually increases the render scale of listboxitems when they're selected. In some cases, this is fine. In other cases the listboxitems clip to the parent bounds regardless of what the ClipToBounds property is set to. I don't think this is just limited to grids, I think this is a general issue with any element (content controls, stack panels, dock panels etc). I think this is just a general issue with the way it determines to clip regions. | ||||
| Steps To Reproduce |
| ||||
| Platform | Any | ||||
 |
Are you sure about Blend showing this fine? Because I just copied the same xaml you have in xamltoy into a Blend project and it shows the ListBox clipped, and after increasing the cell height to 600 then it shows without clip exactly as in Noesis (see attached image). The behavior I see seems logical to me, as ListBox doesn't fit inside the layout slot assigned by the parent Grid it has to activate clipping. This is how layout clip is supposed to work. Anyway, changing RenderTransform scale doesn't affect layout and shouldn't produce any clipping if the ListBox wasn't originally clipped. |
 |
You're right, in Blend it does clip, however, I'm still getting a different behaviour to you in Blend. In Blend it always clips to the bounds of the parent (see my attached image, notice that the Pink area is the area of the grid cell, the black area is the area of the listbox which is set to auto/auto and aligned to the centre.) To clarify, I'm still seeing inconsistent behaviour where Noesis will clip if and only if the parent needs to be clipped, whereas in Blend it looks to always clip. Is there any way to make it so the layout clip is ignored so it will always render the child objects? If not, that's fine, we can work around this and just ensure we have enough padding to grow the elements to avoid the clipping, I just need to let our artists know to take this into account. Cheers, -Steven Clipping_Blend.png (20,803 bytes) |
|
|
Can you share the Blend xaml/project? Because I'm getting different results here with Blend. >> Is there any way to make it so the layout clip is ignored so it will always render the child objects? If not, that's fine, we can work around this and just ensure we have enough padding to grow the elements to avoid the clipping, I just need to let our artists know to take this into account. |
|
|
I added this to one of our files in our UserControl files for our game. I've just tried it with a new project and you're right, both Noesis and Blend work identically, so I'm guessing that it's an issue with one a resource in our theme. I'll track it down now I know it's an issue with our code. Sorry for messaging you, it looks like Noesis and Blend are behaving identically then, it's just a bug in our theme mixed with a misunderstanding on my part :) It all looks good, I think we can close this bug and I'll track down the issue with our theme. Much appreciated, cheers Sergio! And cheers for the info about the canvas, I'll add this to our default theme for our custom listbox style (which is where I'm seeing all these clipping issues) -Steven |
|
|
Ok, glad to help. Just want to remark that increasing the size of children using RenderTransform property shouldn't affect layout, so if parent ListBox wasn't initially clipped, then scaling up list items (on focus/selection) won't clip the list either. |
|
|
Yeah, the issue is that as soon as clipping is enabled it will clip to the listbox. By default a lot of our child elements sit outside the measured region (our focus storyboard increases the render scale of the listboxitem by ~10% and apply a slight rotation to them). This causes the elements to go outside the border of the listbox by quite a bit. This is fine, it causes elements to overlay but this is a stylistic choice, we want the selected element to overlay other UI elements, and we just ensure that the selected element is always on top of other elements in terms of z-depth. This works fine until anything causes the parent listbox to clip. If this happens then it'll cause all selected items to then clip quite a lot. I think the canvas solution will suit us perfectly, or we just have to make sure that the listbox always fits inside the parent so the layout clipping is not enabled on this object. Cheers, I have a much deeper understanding of how this works now so I'll be able to feed back to our artists and let them know about this. -Steven |
|
|
Cheers. |
