Page 1 of 1
Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 9:26 am
by kbmonkey
Here is a technical demo of a scrollable surface. It is nothing fancy but might be useful for some, sharing is caring right?
It uses a stencil and transforms, there is no drawing to off-screen canvasses involved.
- aperture-lorem.gif (405.39 KiB) Viewed 5281 times
- aperture-pictures.gif (205.23 KiB) Viewed 5281 times
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 9:58 am
by grump
Is there an advantage using stencil masks over
scissor functions?
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 11:41 am
by Tjakka5
I don't think there is any advantage using stencils over scissor. It may even be quite a lot slower.
I also looked into the code and saw that, while the pages are indeed being clipped, invisible pages are still being rendered.
I think this is a big issue, since if you for example have a huge list of items performance may be very bad.
Instead I suggest you add a little wrapper for pages, where each page has it's own drawing function.
Then internally you can only draw the currently visible pages.
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 1:02 pm
by zorg
Tjakka5 wrote: ↑Tue Nov 14, 2017 11:41 am
I don't think there is any advantage using stencils over scissor. It may even be quite a lot slower.
I also looked into the code and saw that, while the pages are indeed being clipped, invisible pages are still being rendered.
I think this is a big issue, since if you for example have a huge list of items performance may be very bad.
Instead I suggest you add a little wrapper for pages, where each page has it's own drawing function.
Then internally you can only draw the currently visible pages.
I might be wrong, but in that case, using scissors instead would solve the issue of "invisible rendering", since anything outside the defined rectangle will not be rendered; unless you meant something else.
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 1:22 pm
by grump
zorg wrote: ↑Tue Nov 14, 2017 1:02 pmI might be wrong, but in that case, using scissors instead would solve the issue of "invisible rendering", since anything outside the defined rectangle will not be rendered;
AFAIK, LÖVE doesn't do any clipping against the scissor rectangle. The fragments outside the sicssor rectangle get discarded, that's pretty far down the pipeline. Not much better than stencil tests. Stencils allow for arbitrary clipping shapes though.
Doing it properly it not an easy task though, since (the current version of) LÖVE does not provide a way to access the transformation state outside the GPU.
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 5:30 pm
by kbmonkey
Drawing the visible page would be easy enough
Code: Select all
if loremscroll.page == 1 then
-- draw page 1 here
elseif loremscroll.page == 2 then
-- you get the idea
end
That should satisfy any performance concerns. I will have to try scissors too, thanks for the idea!
Re: Scrolling apertures: a technical demo
Posted: Tue Nov 14, 2017 8:03 pm
by Tjakka5
Note that you'd have to display 2 pages when you're moving from one to the other, just as a heads up
Re: Scrolling apertures: a technical demo
Posted: Wed Nov 15, 2017 9:27 am
by s-ol
Stencils are definitely slower than scissoring, but scissor dimensions cannot be transformed (not even translated or scaled) so either one can be more useful depending on the situation.
harness-testsuite.love