language-servers/slint
1
0
Fork 0
mirror of https://github.com/slint-ui/slint.git synced 2025-11-17 02:43:04 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

docs: Tweak the tutorial (#7967)

Browse source
This commit is contained in:
Nigel Breslaw 2025-04-02 13:10:59 +03:00 • committed by GitHub
parent 5760c1f168
commit bd093b5119
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 4 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
docs/astro/src/content/docs/tutorial/polishing_the_tile.mdx
View file

@ -7,8 +7,10 @@ description: Polishing the Tile
import { Code } from '@astrojs/starlight/components';
import { extractLines } from '/src/utils/utils.ts';
In this step, you add a curtain-like cover that opens when clicked. You do this by declaring two rectangles
below the <span class="hljs-built_in">Image</span>, so that Slint draws them after the Image and thus on top of the image.
In this step, you add a curtain-like cover that opens when clicked. Slint files have an implicit z order for drawing items.
Each subsequent item is drawn above the previous one. So a `Rectangle` on line 10 would be underneath another declared later
in the file on line 50. To give the impression of curtains that cover the image,
declare two rectangles after the <span class="hljs-built_in">Image</span>, so that Slint draws them over the Image.
The <span class="hljs-built_in">TouchArea</span> element declares a transparent rectangular region that allows
reacting to user input such as a mouse click or tap. The element forwards a callback to the <em>MainWindow</em> indicating that a user clicked the tile.