feat(ui): a scrollbar held where it was taken, a popover that keeps the mouse, easing that lands
- the scrollbar is .ui-scrollbar with a .ui-thumb, styled by the default sheet or a theme; a press on the thumb holds it at the point it was taken and the pointer moves it in proportion, a press on the track jumps the thumb's middle there and holds it, and neither presses what is under the bar (it used to centre the thumb on the pointer and press the row beneath as well); - while a popover is up only scroll boxes inside it take the pointer, and a press outside it that closes it forgets any press in progress; - a transition ends exactly on its value (it stopped a rounding error short, at every frame rate). Tests: ui_popover_mouse, ui_scrollbar, ui_ease (60/120/180/240 Hz). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
parent
9f59000f5b
commit
a4c7a756f0
19 changed files with 299 additions and 29 deletions
3
examples/library/ui_popover_mouse_parts/Grid.lss
Normal file
3
examples/library/ui_popover_mouse_parts/Grid.lss
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
.page { width: 300px; height: 300px }
|
||||
.cell { width: 200px; height: 100px }
|
||||
.verbs { top: 10px; left: 10px; width: 120px }
|
||||
8
examples/library/ui_popover_mouse_parts/Grid.ludic
Normal file
8
examples/library/ui_popover_mouse_parts/Grid.ludic
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
# Grid.ludic - a grid cell with a popover of verbs laid over it, written BEFORE the cell, so the cell
|
||||
# comes later in the tree and would win any hit test that went by the order things are drawn in
|
||||
component Grid {
|
||||
state open: bool = false
|
||||
state opened: int = 0
|
||||
state dropped: int = 0
|
||||
state closed: int = 0
|
||||
}
|
||||
9
examples/library/ui_popover_mouse_parts/Grid.xml
Normal file
9
examples/library/ui_popover_mouse_parts/Grid.xml
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<div class="page">
|
||||
<if test="{open}">
|
||||
<div popover class="verbs" on-close="set open = false; set closed = closed + 1">
|
||||
<button id="drop" on-click="set dropped = dropped + 1; set open = false">Drop</button>
|
||||
</div>
|
||||
</if>
|
||||
<button id="cell" class="cell" on-click="set opened = opened + 1; set open = true">Axe</button>
|
||||
<p>opened {opened} dropped {dropped} closed {closed} {open}</p>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue