Domain: slint-ui.com -> slint.dev

This commit is contained in:
Olivier Goffart 2023-06-16 09:37:34 +02:00 committed by Olivier Goffart
parent 24c822dd60
commit 11dea135f7
1248 changed files with 1542 additions and 1542 deletions

View file

@ -1,4 +1,4 @@
# Copyright © SixtyFPS GmbH <info@slint-ui.com>
# Copyright © SixtyFPS GmbH <info@slint.dev>
# SPDX-License-Identifier: MIT
cmake_minimum_required(VERSION 3.21)

View file

@ -7,5 +7,5 @@ We recommend the following links to continue:
* [Examples](https://github.com/slint-ui/slint/tree/master/examples): In the Slint repository we have collected a few demos and examples. These are a great starting point to learn how to use many Slint features.
* [Todo Example](https://github.com/slint-ui/slint/tree/master/examples/todo): This is one of the examples that implements a classic use-case.
* [Memory Puzzle](https://github.com/slint-ui/slint/tree/master/examples/memory): This is a slightly more polished version of the code in this example. And you can <a href="https://slint-ui.com/demos/memory/" target="_blank">play the wasm version</a> in your browser.
* [Slint API Docs](https://slint-ui.com/docs/cpp/): The reference documentation for the C++ library.
* [Memory Puzzle](https://github.com/slint-ui/slint/tree/master/examples/memory): This is a slightly more polished version of the code in this example. And you can <a href="https://slint.dev/demos/memory/" target="_blank">play the wasm version</a> in your browser.
* [Slint API Docs](https://slint.dev/docs/cpp/): The reference documentation for the C++ library.

View file

@ -3,9 +3,9 @@
What we'll do is take the list of tiles declared in the .slint language, duplicate it, and shuffle it.
We'll do so by accessing the `memory_tiles` property through the C++ code. For each top-level property,
a getter and a setter function is generated - in our case `get_memory_tiles` and `set_memory_tiles`.
Since `memory_tiles` is an array in the `.slint` language, it's represented as a [`std::shared_ptr<slint::Model>`](https://slint-ui.com/docs/cpp/api/classslint_1_1model).
Since `memory_tiles` is an array in the `.slint` language, it's represented as a [`std::shared_ptr<slint::Model>`](https://slint.dev/docs/cpp/api/classslint_1_1model).
We can't modify the model generated by the .slint, but we can extract the tiles from it, and put it
in a [`slint::VectorModel`](https://slint-ui.com/docs/cpp/api/classslint_1_1vectormodel) which inherits from `Model`.
in a [`slint::VectorModel`](https://slint.dev/docs/cpp/api/classslint_1_1vectormodel) which inherits from `Model`.
`VectorModel` allows us to make modifications and we can use it to replace the static generated model.
We modify the main function like so:
@ -17,4 +17,4 @@ We modify the main function like so:
Running this gives us a window on the screen that now shows a 4 by 4 grid of rectangles, which can show or obscure
the icons when clicking. There's only one last aspect missing now, the rules for the game.
<video autoplay loop muted playsinline src="https://slint-ui.com/blog/memory-game-tutorial/creating-the-tiles-from-rust.mp4"></video>
<video autoplay loop muted playsinline src="https://slint.dev/blog/memory-game-tutorial/creating-the-tiles-from-rust.mp4"></video>

View file

@ -30,4 +30,4 @@ using the modulo and integer division to create a 4 by 4 grid.
Running this gives us a window that shows 8 tiles, which can be opened individually.
<video autoplay loop muted playsinline src="https://slint-ui.com/blog/memory-game-tutorial/from-one-to-multiple-tiles.mp4"></video>
<video autoplay loop muted playsinline src="https://slint.dev/blog/memory-game-tutorial/from-one-to-multiple-tiles.mp4"></video>

View file

@ -1,7 +1,7 @@
# Getting Started
In this tutorial, we use C++ as the host programming language. We also support other programming languages like
[Rust](https://slint-ui.com/docs/rust/slint/) or [JavaScript](https://slint-ui.com/docs/node/).
[Rust](https://slint.dev/docs/rust/slint/) or [JavaScript](https://slint.dev/docs/node/).
You will need a development environment that can compile C++20, [CMake 3.21](https://cmake.org/download/),
and we recommend [Ninja](https://ninja-build.org) for `-GNinja`.
@ -77,7 +77,7 @@ If you are stepping through this tutorial on a Windows machine, you can run it w
memory_game
```
![Screenshot of initial tutorial app showing Hello World](https://slint-ui.com/blog/memory-game-tutorial/getting-started.png "Hello World")
![Screenshot of initial tutorial app showing Hello World](https://slint.dev/blog/memory-game-tutorial/getting-started.png "Hello World")
Feel free to use your favorite IDE for this purpose, or use out-of-tree build, or Ninja, ...
We just keep it simple here for the purpose of this blog.

View file

@ -2,11 +2,11 @@
The game is visually a little bare. Here are some ideas how you could make further changes to enhance it:
- The tiles could have rounded corners, to look a little less sharp. The [border-radius](https://slint-ui.com/docs/slint/src/builtins/elements.html#rectangle)
- The tiles could have rounded corners, to look a little less sharp. The [border-radius](https://slint.dev/docs/slint/src/builtins/elements.html#rectangle)
property of _Rectangle_ can be used to achieve that.
- In real world memory games, the back of the tiles often have some common graphic. You could add an image with
the help of another _[Image](https://slint-ui.com/docs/slint/src/builtins/elements.html#image)_
the help of another _[Image](https://slint.dev/docs/slint/src/builtins/elements.html#image)_
element. Note that you may have to use _Rectangle_'s _clip property_
element around it to ensure that the image is clipped away when the curtain effect opens.

View file

@ -10,5 +10,5 @@ If you uncover two tiles with the same icon, then they remain visible - they're
This is how the game looks like in action:
<video autoplay loop muted playsinline src="https://slint-ui.com/blog/memory-game-tutorial/memory_clip.mp4"
<video autoplay loop muted playsinline src="https://slint.dev/blog/memory-game-tutorial/memory_clip.mp4"
class="img-fluid img-thumbnail rounded"></video>

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// clang-format off

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// ANCHOR: main

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// main.cpp

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// ANCHOR: main_window

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
struct TileData {

View file

@ -19,19 +19,19 @@ from our business logic.
Inside the <span class="hljs-built_in">Rectangle</span> we place an <span class="hljs-built_in">Image</span> element that
loads an icon with the <span class="hljs-built_in">@image-url()</span> macro. The path is relative to the folder in which
the `memory.slint` is located. This icon and others we're going to use later need to be installed first. You can download a
[Zip archive](https://slint-ui.com/blog/memory-game-tutorial/icons.zip) that we have prepared.
[Zip archive](https://slint.dev/blog/memory-game-tutorial/icons.zip) that we have prepared.
If you are on Linux or macOS, download and extract it with the following two commands:
```sh
curl -O https://slint-ui.com/blog/memory-game-tutorial/icons.zip
curl -O https://slint.dev/blog/memory-game-tutorial/icons.zip
unzip icons.zip
```
If you are on Windows, use the following commands:
```
powershell curl -Uri https://slint-ui.com/blog/memory-game-tutorial/icons.zip -Outfile icons.zip
powershell curl -Uri https://slint.dev/blog/memory-game-tutorial/icons.zip -Outfile icons.zip
powershell Expand-Archive -Path icons.zip -DestinationPath .
```
@ -40,4 +40,4 @@ This should unpack an `icons` directory containing a bunch of icons.
We compile the program with `cmake --build .` and running with the `./memory_game` gives us a
window on the screen that shows the icon of a bus on a blue background.
![Screenshot of the first tile](https://slint-ui.com/blog/memory-game-tutorial/memory-tile.png "Memory Tile Screenshot")
![Screenshot of the first tile](https://slint.dev/blog/memory-game-tutorial/memory-tile.png "Memory Tile Screenshot")

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
// ANCHOR: main_window

View file

@ -1,4 +1,4 @@
// Copyright © SixtyFPS GmbH <info@slint-ui.com>
// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: MIT
struct TileData {

View file

@ -29,4 +29,4 @@ to the current element.
Running this gives us a window on the screen with a rectangle that opens up to show us the bus icon, when clicking on
it. Subsequent clicks will close and open the curtain again.
<video autoplay loop muted playsinline src="https://slint-ui.com/blog/memory-game-tutorial/polishing-the-tile.mp4"></video>
<video autoplay loop muted playsinline src="https://slint.dev/blog/memory-game-tutorial/polishing-the-tile.mp4"></video>