You create an instance of the PageComponent with the
new keyword, decide on its size, and add the layers that will become pages.
Here’s an example:
# creating the PageComponent page = new PageComponent width: 375, height: 667 point: Align.center borderColor: "gray", borderWidth: 1 scrollVertical: no
Just as with the ScrollComponent, you can restrict the scrolling direction. Here I disabled vertical scrolling.
We can now add pages to
page (the name of our PageComponent) by setting
page.content as their parent.
# adding 4 pages page1 = new Layer width: page.width, height: page.height backgroundColor: cycler() parent: page.content page2 = new Layer width: page.width, height: page.height backgroundColor: cycler() parent: page.content x: page.width ...
Here I gave the layers the same size as the PageComponent and used
page.width to place the second layer right next to the first one (and did the same for consecutive layers).
Bonus: I also used 🛠 Cycle to create a function that returns a different color every time it’s called.