1 | #![allow (deprecated)]slint::slint!{#[include_path=r#"/input/slint/tests/driver/driverlib/../../cases/examples"# ] |
2 | // Copyright © SixtyFPS GmbH <info@slint.dev> |
3 | // SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-1.1 OR LicenseRef-Slint-commercial |
4 | |
5 | // Test to show the internal `BoxShadow` element. This can be used for manual |
6 | // visual verification and it also serves as a test to ensure that such generated |
7 | // code compiles. |
8 | |
9 | // Shows three colored rectangles with drop shadow in a vertical box layout. The first |
10 | // is manually created, the other two come out of a repeater. |
11 | |
12 | // Additionally, there are three green rectangles at the bottom placed diagonally |
13 | // using equal spacing and manual calculation, using a repeater. |
14 | |
15 | BlueRect := Rectangle { |
16 | background: blue; |
17 | border-radius: 10px; |
18 | drop-shadow-offset-x: 10px; |
19 | drop-shadow-offset-y: 10px; |
20 | drop-shadow-color: #00000080; |
21 | drop-shadow-blur: 5px; |
22 | opacity: 0.5; |
23 | clip: true; |
24 | } |
25 | |
26 | TestCase := Window { |
27 | width: 800px; |
28 | height: 600px; |
29 | |
30 | VerticalLayout { |
31 | padding: 50px; |
32 | |
33 | BlueRect {} |
34 | |
35 | for r[i] in [ |
36 | {color: #0f0 }, |
37 | {color: #f00 }, |
38 | ]: Rectangle { |
39 | background: r.color; |
40 | drop-shadow-offset-x: 10px; |
41 | drop-shadow-offset-y: 10px; |
42 | drop-shadow-color: #00000080; |
43 | drop-shadow-blur: 5px; |
44 | } |
45 | |
46 | Rectangle { |
47 | clip: true; |
48 | border-color: black; |
49 | border-width: 1px; |
50 | border-radius: 2px; |
51 | |
52 | Rectangle { |
53 | x: parent.width / 2; |
54 | y: parent.height / 2; |
55 | width: parent.width / 2; |
56 | height: parent.height / 4; |
57 | |
58 | background: blue; |
59 | |
60 | drop-shadow-offset-x: 10px; |
61 | drop-shadow-offset-y: 10px; |
62 | drop-shadow-color: #249a04; |
63 | drop-shadow-blur: 3px; |
64 | } |
65 | } |
66 | } |
67 | |
68 | for i in 3: Rectangle { |
69 | background: green; |
70 | border-color: black; |
71 | border-width: 1px; |
72 | |
73 | x: 100px + i * 50px; |
74 | y: 300px + i * 30px; |
75 | width: 30px; |
76 | height: 20px; |
77 | |
78 | drop-shadow-offset-x: 5px; |
79 | drop-shadow-offset-y: 5px; |
80 | drop-shadow-color: #00000080; |
81 | drop-shadow-blur: 5px; |
82 | } |
83 | } |
84 | } |
85 | |