mirror of
https://github.com/servo/servo.git
synced 2025-06-16 20:34:30 +00:00
57 lines
2.1 KiB
Markdown
57 lines
2.1 KiB
Markdown
Scrolling
|
|
=========
|
|
|
|
Scrolling is implemented by the compositor. Compositor layers that opt in to
|
|
scroll events via the `wants_scroll_events` flag can scroll their contents.
|
|
These will be referred "scrolling roots." Scrolling roots serve as a viewport
|
|
into their content, which is stored in descendant layers. In order for
|
|
scrolling roots to be able to scroll their content, they need to be smaller
|
|
than that content. If the content was smaller than the scrolling root, it would
|
|
not be able to move around inside the scrolling root. Imagine a browser window
|
|
that is larger than the content that it contains. The size of each layer is
|
|
defined by the window size (the root layer) or the block size for iframes and
|
|
elements with `overflow:scroll`.
|
|
|
|
Since the compositor allows layers to exist independently of their parents,
|
|
child layers can overflow or fail to intersect their parents completely. To
|
|
prevent this, scrolling roots use the `masks_to_bounds` flag, which is a signal
|
|
to the compositor that it should not paint the parts of descendant layers that
|
|
lie outside the boundaries of the scrolling root.
|
|
|
|
Below is an ASCII art diagram showing a scrolling root with three content
|
|
layers (a, b, and c), scrolled down a few ticks. `masks_to_bounds` has not been
|
|
applied in the diagram.
|
|
|
|
<pre>
|
|
+-----------------------+
|
|
| |
|
|
=========================
|
|
| | scrolling
|
|
| <-------------+root
|
|
| |
|
|
| +-------+ |
|
|
=========================
|
|
| | b | |
|
|
++-------+ +--^----+ |
|
|
|| | | |
|
|
|| | | | content
|
|
|| c <---------+---------+layers
|
|
|+-------+ / |
|
|
| a < |
|
|
| |
|
|
+-----------------------+
|
|
</pre>
|
|
|
|
Everything above and below the set of `====` bars would be hidden by
|
|
`masks_to_bounds`, so the composited scene will just be the viewport defined by
|
|
the scrolling root with the content layers a and b visible.
|
|
|
|
<pre>
|
|
=========================
|
|
| |
|
|
| |
|
|
| |
|
|
| +-------+ |
|
|
=========================
|
|
</pre>
|
|
|