bevy/examples/ui
ickshonpe 100767560f Make clipped areas of UI nodes non-interactive (#10454)
# Objective

Problems:

* The clipped, non-visible regions of UI nodes are interactive.
* `RelativeCursorPostion` is set relative to the visible part of the
node. It should be relative to the whole node.
* The `RelativeCursorPostion::mouse_over` method returns `true` when the
mouse is over a clipped part of a node.

fixes #10470

## Solution

Intersect a node's bounding rect with its clipping rect before checking
if it contains the cursor.

Added the field `normalized_visible_node_rect` to
`RelativeCursorPosition`. This is set to the bounds of the unclipped
area of the node rect by `ui_focus_system` expressed in normalized
coordinates relative to the entire node.

Instead of checking if the normalized cursor position lies within a unit
square, it instead checks if it is contained by
`normalized_visible_node_rect`.

Added outlines to the `overflow` example that appear when the cursor is
over the visible part of the images, but not the clipped area.

---

## Changelog

* `ui_focus_system` intersects a node's bounding rect with its clipping
rect before checking if mouse over.
* Added the field `normalized_visible_node_rect` to
`RelativeCursorPosition`. This is set to the bounds of the unclipped
area of the node rect by `ui_focus_system` expressed in normalized
coordinates relative to the entire node.
* `RelativeCursorPostion` is calculated relative to the whole node's
position and size, not only the visible part.
* `RelativeCursorPosition::mouse_over` only returns true when the mouse
is over an unclipped region of the UI node.
* Removed the `Deref` and `DerefMut` derives from
`RelativeCursorPosition` as it is no longer a single field struct.
* Added some outlines to the `overflow` example that respond to
`Interaction` changes.

## Migration Guide

The clipped areas of UI nodes are no longer interactive.

`RelativeCursorPostion` is now calculated relative to the whole node's
position and size, not only the visible part. Its `mouse_over` method
only returns true when the cursor is over an unclipped part of the node.

`RelativeCursorPosition` no longer implements `Deref` and `DerefMut`.
2023-11-29 16:53:01 -08:00
..
borders.rs UI node outlines (#9931) 2023-10-05 12:10:32 +00:00
button.rs Allow clippy::type_complexity in more places. (#9796) 2023-10-02 21:55:16 +00:00
display_and_visibility.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
flex_layout.rs UI examples clean up (#9479) 2023-08-23 12:49:10 +00:00
font_atlas_debug.rs Bevy Asset V2 (#8624) 2023-09-07 02:07:27 +00:00
grid.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
overflow.rs Make clipped areas of UI nodes non-interactive (#10454) 2023-11-29 16:53:01 -08:00
overflow_debug.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
relative_cursor_position.rs Have a separate implicit viewport node per root node + make viewport node Display::Grid (#9637) 2023-09-19 15:14:46 +00:00
size_constraints.rs Have a separate implicit viewport node per root node + make viewport node Display::Grid (#9637) 2023-09-19 15:14:46 +00:00
text.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
text_debug.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
text_wrap_debug.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
transparency_ui.rs Have a separate implicit viewport node per root node + make viewport node Display::Grid (#9637) 2023-09-19 15:14:46 +00:00
ui.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
ui_material.rs Add UI Materials (#9506) 2023-11-03 22:33:01 +00:00
ui_scaling.rs Change UiScale to a tuple struct (#9444) 2023-08-16 18:18:50 +00:00
ui_texture_atlas.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
viewport_debug.rs Use default resolution for viewport_debug example (#9666) 2023-09-02 18:43:56 +00:00
window_fallthrough.rs Update default ClearColor to better match Bevy's branding (#10339) 2023-11-03 12:57:38 +00:00
z_index.rs Have a separate implicit viewport node per root node + make viewport node Display::Grid (#9637) 2023-09-19 15:14:46 +00:00