mirror of
https://github.com/slint-ui/slint.git
synced 2025-09-01 08:07:23 +00:00
91 lines
2.5 KiB
Text
91 lines
2.5 KiB
Text
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
|
|
// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-commercial
|
|
|
|
struct TileData := {
|
|
image: image,
|
|
image_visible: bool,
|
|
solved: bool,
|
|
}
|
|
|
|
MemoryTile := Rectangle {
|
|
callback clicked;
|
|
property <bool> open_curtain;
|
|
property <bool> solved;
|
|
property <image> icon;
|
|
|
|
height: 64px;
|
|
width: 64px;
|
|
background: solved ? #34CE57 : #3960D5;
|
|
animate background { duration: 800ms; }
|
|
|
|
Image {
|
|
source: icon;
|
|
width: parent.width;
|
|
height: parent.height;
|
|
}
|
|
|
|
// Left curtain
|
|
Rectangle {
|
|
background: #193076;
|
|
width: open_curtain ? 0px : (parent.width / 2);
|
|
height: parent.height;
|
|
animate width { duration: 250ms; easing: ease-in; }
|
|
}
|
|
|
|
// Right curtain
|
|
Rectangle {
|
|
background: #193076;
|
|
x: open_curtain ? parent.width : (parent.width / 2);
|
|
width: open_curtain ? 0px : (parent.width / 2);
|
|
height: parent.height;
|
|
animate width { duration: 250ms; easing: ease-in; }
|
|
animate x { duration: 250ms; easing: ease-in; }
|
|
}
|
|
|
|
TouchArea {
|
|
clicked => {
|
|
// Delegate to the user of this element
|
|
root.clicked();
|
|
}
|
|
}
|
|
}
|
|
// ANCHOR: mainwindow_interface
|
|
MainWindow := Window {
|
|
width: 326px;
|
|
height: 326px;
|
|
|
|
callback check_if_pair_solved(); // Added
|
|
property <bool> disable_tiles; // Added
|
|
|
|
property <[TileData]> memory_tiles: [
|
|
{ image: @image-url("icons/at.png") },
|
|
// ANCHOR_END: mainwindow_interface
|
|
{ image: @image-url("icons/balance-scale.png") },
|
|
{ image: @image-url("icons/bicycle.png") },
|
|
{ image: @image-url("icons/bus.png") },
|
|
{ image: @image-url("icons/cloud.png") },
|
|
{ image: @image-url("icons/cogs.png") },
|
|
{ image: @image-url("icons/motorcycle.png") },
|
|
{ image: @image-url("icons/video.png") },
|
|
];
|
|
// ANCHOR: tile_click_logic
|
|
for tile[i] in memory_tiles : MemoryTile {
|
|
x: mod(i, 4) * 74px;
|
|
y: floor(i / 4) * 74px;
|
|
width: 64px;
|
|
height: 64px;
|
|
icon: tile.image;
|
|
open_curtain: tile.image_visible || tile.solved;
|
|
// propagate the solved status from the model to the tile
|
|
solved: tile.solved;
|
|
clicked => {
|
|
// old: tile.image_visible = !tile.image_visible;
|
|
// new:
|
|
if (!root.disable_tiles) {
|
|
tile.image_visible = !tile.image_visible;
|
|
root.check_if_pair_solved();
|
|
}
|
|
}
|
|
}
|
|
// ANCHOR_END: tile_click_logic
|
|
}
|