Slint

https://docs.slint.dev/latest/docs
Admin
Slint is a toolkit for building native user interfaces for desktop, embedded, and web applications...
Tokens:927,877
Snippets:8,710
Trust Score:9.5
Update:2 weeks ago
Show doc for...
Tokens:
Raw
### Setup Python project: rename directory and install dependencies with uv

Source: https://docs.slint.dev/latest/docs/slint/tutorial/getting_started

Commands to rename and enter the Python template directory (memory) and then install dependencies with uv sync.

```sh
mv slint-python-template-main memory
cd memory
```

```sh
uv sync
```

--------------------------------

### Set up and run the Node.js template

Source: https://docs.slint.dev/latest/docs/slint/guide/getting-started

Steps to set up the Node.js template: rename the extracted directory, install dependencies, and start the application.

```sh
mv slint-nodejs-template-main my-project
cd my-project
```

```sh
npm install
npm start
```

--------------------------------

### Getting Started with bun: main.slint and index.ts

Source: https://docs.slint.dev/latest/docs/node

Create a new Slint project with bun. The .slint file declares the UI, and the TypeScript entry point imports the Slint API, loads the .slint file with loadFile(), instantiates the Demo component, and runs it with await demo.run(). Run with `bun run index.ts`.

```slint
import { AboutSlint, Button, VerticalBox } from "std-widgets.slint";
export component Demo inherits Window {
    in-out property <string> greeting <=> label.text;
    VerticalBox {
        alignment: start;
        label := Text {
            text: "Hello World!";
            font-size: 24px;
            horizontal-alignment: center;
        }
        AboutSlint {
            preferred-height: 150px;
        }
        HorizontalLayout { alignment: center; Button { text: "OK!"; } }
    }
}
```

```ts
import * as slint from "slint-ui";
let ui = slint.loadFile(new URL("main.slint", import.meta.url)) as any;
let demo = new ui.Demo();


await demo.run();
```

--------------------------------

### Using winit_window() to get the winit window

Source: https://docs.slint.dev/latest/docs/rust/i_slint_backend_winit/trait.WinitWindowAccessor

Shows how to select the winit backend and obtain the winit window via the winit_window() future. The example prints the window id after awaiting the future. Requires the winit backend to be active and the window to exist.

```rust
// Bring winit and accessor traits into scope.
use slint::winit_030::{WinitWindowAccessor, winit};

slint::slint!{
    import { VerticalBox, Button } from "std-widgets.slint";
    export component HelloWorld inherits Window {
        callback clicked;
        VerticalBox {
            Text {
                text: "hello world";
                color: green;
            }
            Button {
                text: "Click me";
                clicked => { root.clicked(); }
            }
        }
    }
}
fn main() -> Result<(), Box<dyn std::error::Error>> {
    // Make sure the winit backed is selected:
   slint::BackendSelector::new()
       .backend_name("winit".into())
       .select()?;

    let app = HelloWorld::new()?;
    let app_weak = app.as_weak();

    slint::spawn_local(async move {
        let app = app_weak.unwrap();
        let winit_window = app.window().winit_window().await.unwrap();
        eprintln!("window id = {:#?}", winit_window.id());
    }).unwrap();
    app.run()?;
    Ok(())
}
```

--------------------------------

### Install .metainfo.xml in Flatpak build-commands

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/desktop/linux/packaging

Install the .metainfo.xml file from build-commands in your Flatpak manifest, alongside the desktop entry and icon. Use ${FLATPAK_ID} to reference the package ID and install to ${FLATPAK_DEST}/share/metainfo/.

```yaml
# ...
    build-commands:
      # ...
      - install -Dm0644 path/to/${FLATPAK_ID}.metainfo.xml ${FLATPAK_DEST}/share/metainfo/${FLATPAK_ID}.metainfo.xml
      # ...
```

--------------------------------

### Install slint-lsp with cargo binstall

Source: https://docs.slint.dev/latest/docs/slint/guide/tooling/manual-setup

Installs the pre-built slint-lsp binary using cargo binstall, which automatically downloads and installs the binary.

```sh
cargo binstall slint-lsp
```

--------------------------------

### WGPUConfiguration::Manual

Source: https://docs.slint.dev/latest/docs/rust/slint/wgpu_29/enum.WGPUConfiguration

Use Manual if you have initialized WGPU and want to supply the instance, adapter, device, and queue for use.

```APIDOC
## WGPUConfiguration::Manual

### Description
Use `Manual` if you've initialized WGPU and want to supply the instance, adapter, device, and queue for use.

### Variant
`Manual`

### Fields
- **instance** (`Instance`) - The WGPU instance to use.
- **adapter** (`Adapter`) - The WGPU adapter to use.
- **device** (`Device`) - The WGPU device to use.
- **queue** (`Queue`) - The WGPU queue to use.

### Example
```rust
let config = WGPUConfiguration::Manual {
    instance,
    adapter,
    device,
    queue,
};
```
```

--------------------------------

### element_offset basic example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Basic usage of `element_offset` to get the index of an element reference. Returns `Some(index)` when the reference points to the start of an element.

```rust
let nums: &[u32] = &[1, 7, 1, 1];
let num = &nums[2];

assert_eq!(num, &1);
assert_eq!(nums.element_offset(num), Some(2));
```

--------------------------------

### build example with renderer-software

Source: https://docs.slint.dev/latest/docs/rust/i_slint_backend_winit/struct.BackendBuilder

Example for build: configures the builder to use the software renderer and then builds the backend, setting it as the platform.

```rust
let mut backend = i_slint_backend_winit::Backend::builder()
    .with_renderer_name("renderer-software")
    .build()
    .unwrap();
slint::platform::set_platform(Box::new(backend));
```

--------------------------------

### get() example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Returns a reference to an element or subslice depending on the type of index. Example shows getting an element by position and a subslice by range, and None for out-of-bounds.

```rust
let v = [10, 40, 30];
assert_eq!(Some(&40), v.get(1));
assert_eq!(Some(&[10, 40][..]), v.get(0..2));
assert_eq!(None, v.get(3));
assert_eq!(None, v.get(0..4));
```

--------------------------------

### Import example library in Slint

Source: https://docs.slint.dev/latest/docs/rust/slint_build/struct.CompilerConfiguration.html

Imports the 'example' library in ui/main.slint using the @library syntax.

```slint
import { Example } from "@example";
```

--------------------------------

### split separators at start or end example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedString

Shows that separators at the start or end of a string are neighbored by empty strings. The string starts and ends with '0'.

```rust
let d: Vec<_> = "010".split("0").collect();
assert_eq!(d, &["", "1", ""]);
```

--------------------------------

### Install translations with gettext

Source: https://docs.slint.dev/latest/docs/python/api/functions/init_translations

Example of installing translations for a Slint application. It attempts to load German translations from a 'lang' directory and installs them using slint.install_translations, ignoring OSError if the translation file is missing.

```python
import gettext
import slint

translations_dir = os.path.join(os.path.dirname(__file__), "lang")
try:
    translations = gettext.translation("my_app", translations_dir, ["de"])
    slint.install_translations(translations)
except OSError:
    pass
```

--------------------------------

### Set up and run the Python template

Source: https://docs.slint.dev/latest/docs/slint/guide/getting-started

Steps to set up the Python template: rename the extracted directory, install dependencies, and run the application with uv.

```sh
mv slint-python-template-main my-project
cd my-project
```

```sh
uv run main.py
```

--------------------------------

### Install Rust target for ARM64

Source: https://docs.slint.dev/latest/docs/cpp/cmake

Installs the Rust target toolchain for an ARM64 embedded Linux target, as used in the Yocto SDK example.

```sh
rustup target add aarch64-unknown-linux-gnu
```

--------------------------------

### substr_range example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedString

Uses substr_range with split to get the byte ranges of each substring.

```rust
use core::range::Range;

let data = "a, b, b, a";
let mut iter = data.split(", ").map(|s| data.substr_range(s).unwrap());

assert_eq!(iter.next(), Some(Range { start: 0, end: 1 }));
assert_eq!(iter.next(), Some(Range { start: 3, end: 4 }));
assert_eq!(iter.next(), Some(Range { start: 6, end: 7 }));
assert_eq!(iter.next(), Some(Range { start: 9, end: 10 }));
```

--------------------------------

### Create main window and tray, wire clicked callback, run event loop

Source: https://docs.slint.dev/latest/docs/slint/reference/window/systemtrayicon

Shows how to create a main window and a system tray icon, wire the tray's clicked callback to show the window, and run the event loop. The tray's visible property is set via show() and the platform backend translates it to the native tray API. A visible tray keeps the event loop alive like a visible window.

```rust
fn main() -> Result<(), slint::PlatformError> {
    let window = MainWindow::new()?;
    let tray = ExampleTray::new()?;

    let window_weak = window.as_weak();
    tray.on_clicked(move || {
        if let Some(w) = window_weak.upgrade() {
            let _ = w.show();
        }
    });

    window.show()?;
    tray.show()?;
    slint::run_event_loop()
}
```

```cpp
int main() {
    auto window = MainWindow::create();
    auto tray = ExampleTray::create();

    auto window_weak = slint::ComponentWeakHandle(window);
    tray->on_clicked([window_weak] {
        if (auto w = window_weak.lock()) {
            (*w)->show();
        }
    });

    window->show();
    tray->show();
    slint::run_event_loop();
}
```

```javascript
const window = new ui.MainWindow();
const tray = new ui.ExampleTray();
tray.clicked = () => window.show();
window.show();
tray.show();
await slint.runEventLoop();
```

```python
window = module.MainWindow()
tray = module.ExampleTray()
tray.clicked = lambda: window.show()
window.show()
tray.show()
slint.run_event_loop()
```

--------------------------------

### get_unchecked() example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Returns a reference to an element or subslice without bounds checking. Unsafe; calling with an out-of-bounds index is undefined behavior. Example shows getting an element at index 1.

```rust
let x = &[1, 2, 4];

unsafe {
    assert_eq!(x.get_unchecked(1), &2);
}
```

--------------------------------

### Compile with library paths example

Source: https://docs.slint.dev/latest/docs/rust/slint_build/struct.CompilerConfiguration.html

Compiles ui/main.slint with an 'example' library path using with_library_paths.

```rust
let manifest_dir = std::path::PathBuf::from(std::env::var_os("CARGO_MANIFEST_DIR").unwrap());
let library_paths = std::collections::HashMap::from([(
    "example".to_string(),
    manifest_dir.join("third_party/example/ui/lib.slint"),
)]);
let config = slint_build::CompilerConfiguration::new().with_library_paths(library_paths);
slint_build::compile_with_config("ui/main.slint", config).unwrap();
```

--------------------------------

### ScaleRotateGestureHandler example in Slint

Source: https://docs.slint.dev/latest/docs/slint/reference/gestures/scalerotategesturehandler

Example of using ScaleRotateGestureHandler to handle pinch and rotation gestures on a rectangle. The handler's started callback captures the initial scale and rotation, and the updated callback applies the cumulative scale and rotation to the rectangle. The example is marked as a playground snippet.

```slint
export component Example inherits Window {
    width: 400px;
    height: 400px;

    property <float> start-scale;
    property <angle> start-rotation;

    gesture := ScaleRotateGestureHandler {
        started => {
            start-scale = rect.current-scale;
            start-rotation = rect.current-rotation;
        }
        updated => {
            rect.current-scale = start-scale * self.scale;
            rect.current-rotation = start-rotation + self.rotation;
        }

        rect := Rectangle {
            background: @radial-gradient(circle, #4488ff, #224488);
            border-radius: 8px;

            property <float> current-scale: 1.0;
            property <angle> current-rotation: 0deg;
            width: 200px * self.current-scale;
            height: 200px * self.current-scale;
            x: (parent.width - self.width) / 2;
            y: (parent.height - self.height) / 2;

            Text {
                text: "Pinch & rotate";
                color: white;
            }
        }
    }
}
```

--------------------------------

### Slint document for set_global_callback example

Source: https://docs.slint.dev/latest/docs/rust/src/slint_interpreter/api.rs

Shows the Slint document used in the `set_global_callback` example. It defines an exported global `Logic` with a pure callback `to_uppercase` and a component `MyWin` that uses the callback in a property binding. The code is incomplete as shown; the full example continues with compilation and callback setup.

```rust
use slint_interpreter::{Compiler, Value, SharedString};
use core::convert::TryInto;
let code = r#"
    export global Logic {
        pure callback to_uppercase(string) -> string;
    }
    export component MyWin inherits Window {
        out property <string> hello: Logic.to_uppercase("world");
    }
"#;
```

--------------------------------

### Initialize winit backend with set_platform

Source: https://docs.slint.dev/latest/docs/rust/i_slint_backend_winit/index.html

Initialize the winit backend as the first step in main to ensure the runtime backend is selected.

```rust
slint::platform::set_platform(Box::new(i_slint_backend_winit::Backend::new().unwrap()));
// ...
```

--------------------------------

### Get global property example

Source: https://docs.slint.dev/latest/docs/rust/slint_interpreter/api/struct.ComponentInstance.html

Shows how to retrieve a property from an exported global singleton using get_global_property. The example defines a global Glob with property my_property, exports it as TheGlobal, and then retrieves the value from the component instance.

```rust
use slint_interpreter::{Compiler, Value, SharedString};
let code = r#"
    global Glob {
        in-out property <int> my_property: 42;
    }
    export { Glob as TheGlobal }
    export component MyWin inherits Window {
    }
"#;
let mut compiler = Compiler::default();
let result = spin_on::spin_on(compiler.build_from_source(code.into(), Default::default()));
assert_eq!(result.diagnostics().count(), 0, "{:?}", result.diagnostics().collect::<Vec<_>>());
let instance = result.component("MyWin").unwrap().create().unwrap();
assert_eq!(instance.get_global_property("TheGlobal", "my_property").unwrap(), Value::from(42));
```

--------------------------------

### Backend::new

Source: https://docs.slint.dev/latest/docs/rust/i_slint_backend_winit/struct.Backend

Creates a new winit backend with the default renderer that's compiled in.

```APIDOC
## Backend::new

### Description
Creates a new winit backend with the default renderer that's compiled in. See the backend documentation for details on how to select the default renderer.

### Method
pub fn new() -> Result<Self, PlatformError>

### Parameters
None

### Returns
- `Result<Self, PlatformError>` - A new Backend instance or a PlatformError if initialization fails.

### Example
```rust
use i_slint_backend_winit::Backend;
let backend = Backend::new().unwrap();
```
```

--------------------------------

### Set up, build, and run the C++ template

Source: https://docs.slint.dev/latest/docs/slint/guide/getting-started

Steps to set up the C++ template: rename the extracted directory, configure and build with CMake (the first configure fetches and builds Slint from source, which takes a few minutes), then run the application on Linux/macOS or Windows.

```sh
mv slint-cpp-template-main my-project
cd my-project
```

```sh
cmake -B build
cmake --build build
```

```sh
./build/my_application
```

```sh
build\my_application.exe
```

--------------------------------

### strip_prefix example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Demonstrates the strip_prefix method on slices. It returns Some with the subslice after the prefix if the slice starts with the prefix, or None otherwise. The example includes cases with empty prefix, full match, and a string prefix converted to bytes.

```rust
let v = &[10, 40, 30];
assert_eq!(v.strip_prefix(&[10]), Some(&[40, 30][..]));
assert_eq!(v.strip_prefix(&[10, 40]), Some(&[30][..]));
assert_eq!(v.strip_prefix(&[10, 40, 30]), Some(&[][..]));
assert_eq!(v.strip_prefix(&[50]), None);
assert_eq!(v.strip_prefix(&[10, 50]), None);

let prefix : &str = "he";
assert_eq!(b"hello".strip_prefix(prefix.as_bytes()),
           Some(b"llo".as_ref()));
```

--------------------------------

### Install debug APK with Gradle

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/mobile/android

Connect a device or start an emulator, then run `./gradlew installDebug` to build the native library, package it into an APK, and install it. The first build takes longer because it compiles Slint and the Skia renderer from source.

```sh
./gradlew installDebug
```

--------------------------------

### Upload demo to Pico2 with picotool

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/embedded

Mounts the Pico2 storage on Linux and uploads the built demo using picotool.

```sh
# If you're on Linux: mount the device
udisksctl mount -b /dev/sda1
# upload
picotool load -u -v -x -t elf target/thumbv8m.main-none-eabihf/release/printerdemo_mcu
```

--------------------------------

### Timer::start example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.Timer

Example showing how to create a repeated timer that prints a message every 200ms using Timer::start.

```rust
use slint::{Timer, TimerMode};
let timer = Timer::default();
timer.start(TimerMode::Repeated, std::time::Duration::from_millis(200), move || {
   println!("This will be printed every 200ms.");
});
// ... more initialization ...
slint::run_event_loop();
```

--------------------------------

### strip_circumfix example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Demonstrates the strip_circumfix method on slices. It returns Some with the subslice after the prefix and before the suffix if the slice starts with the prefix, ends with the suffix, and they do not overlap; otherwise returns None. The example includes cases with empty prefix/suffix and overlapping prefix/suffix.

```rust
let v = &[10, 50, 40, 30];
assert_eq!(v.strip_circumfix(&[10], &[30]), Some(&[50, 40][..]));
assert_eq!(v.strip_circumfix(&[10], &[40, 30]), Some(&[50][..]));
assert_eq!(v.strip_circumfix(&[10, 50], &[40, 30]), Some(&[][..]));
assert_eq!(v.strip_circumfix(&[50], &[30]), None);
assert_eq!(v.strip_circumfix(&[10], &[40]), None);
assert_eq!(v.strip_circumfix(&[], &[40, 30]), Some(&[10, 50][..]));
assert_eq!(v.strip_circumfix(&[10, 50], &[]), Some(&[40, 30][..]));
assert_eq!(v.strip_circumfix(&[10, 50, 40], &[50, 40, 30]), None);
```

--------------------------------

### Get property example

Source: https://docs.slint.dev/latest/docs/rust/slint_interpreter/api/struct.ComponentInstance.html

Shows how to create a component instance and retrieve a public property value using get_property. The example builds a component from source with a property my_property set to 42, then asserts the retrieved value equals 42.

```rust
use slint_interpreter::{ComponentDefinition, Compiler, Value, SharedString};
let code = r#"
    export component MyWin inherits Window {
        in-out property <int> my_property: 42;
    }
"#;
let mut compiler = Compiler::default();
let result = spin_on::spin_on(
    compiler.build_from_source(code.into(), Default::default()));
assert_eq!(result.diagnostics().count(), 0, "{:?}", result.diagnostics().collect::<Vec<_>>());
let instance = result.component("MyWin").unwrap().create().unwrap();
assert_eq!(instance.get_property("my_property").unwrap(), Value::from(42));
```

--------------------------------

### Set up and run the Rust template

Source: https://docs.slint.dev/latest/docs/slint/guide/getting-started

Steps to set up the Rust template: rename the extracted directory and change into it, then build and run the application with cargo run.

```sh
mv slint-rust-template-main my-project
cd my-project
```

```sh
cargo run
```

--------------------------------

### starts_with example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Checks whether the slice starts with the given prefix. Returns `true` when the needle is a prefix or equal to the slice.

```rust
let v = [10, 40, 30];
assert!(v.starts_with(&[10]));
assert!(v.starts_with(&[10, 40]));
assert!(v.starts_with(&v));
assert!(!v.starts_with(&[50]));
assert!(!v.starts_with(&[10, 50]));
```

--------------------------------

### Create a minimal .metainfo.xml file

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/desktop/linux/packaging

Minimal .metainfo.xml file that passes validation for package managers and Flathub. The <id> must match your Flatpak package ID, and the <launchable> must reference your .desktop file. Flathub requires at least one screenshot in a <screenshots> section, but leave it out while developing because an empty section fails validation.

```xml
<?xml version="1.0" encoding="UTF-8" ?>
<component type="desktop-application">
    <!-- This must be the same as your Flatpak package ID -->
    <id>com.yourorganization.YourApp</id>

    <name>Your App</name>
    <summary>A short line describing what your application does</summary>

    <categories>
        <category>Development</category>
    </categories>

    <keywords>
        <keyword>development</keyword>
    </keywords>

    <developer id="com.yourorganization">
        <name>Your Organization</name>
    </developer>

    <icon type="stock">com.yourorganization.YourApp</icon>

    <metadata_license>MIT</metadata_license>
    <project_license>MIT</project_license>

    <description>
        <p>
            A paragraph about your application. Software centers show this
            underneath its name, so write a sentence or two rather than
            repeating the summary above.
        </p>
    </description>

    <url type="homepage">https://slint.dev/</url>

    <!-- The name of your .desktop file, including the extension -->
    <launchable type="desktop-id">com.yourorganization.YourApp.desktop</launchable>

    <!-- Required by Flathub. `oars-1.1` with no attributes declares that
         your application has nothing to disclose -->
    <content_rating type="oars-1.1"/>

    <releases>
        <release version="1.0" date="2026-07-07"/>
    </releases>
</component>
```

--------------------------------

### trim_prefix example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Demonstrates the trim_prefix method on slices. It returns the subslice after the prefix if the slice starts with the prefix, otherwise returns the original slice. The example includes cases with prefix present, prefix absent, and a string prefix converted to bytes.

```rust
let v = &[10, 40, 30];

// Prefix present - removes it
assert_eq!(v.trim_prefix(&[10]), &[40, 30][..]);
assert_eq!(v.trim_prefix(&[10, 40]), &[30][..]);
assert_eq!(v.trim_prefix(&[10, 40, 30]), &[][..]);

// Prefix absent - returns original slice
assert_eq!(v.trim_prefix(&[50]), &[10, 40, 30][..]);
assert_eq!(v.trim_prefix(&[10, 50]), &[10, 40, 30][..]);

let prefix : &str = "he";
assert_eq!(b"hello".trim_prefix(prefix.as_bytes()), b"llo".as_ref());
```

--------------------------------

### Create index.ts entry point

Source: https://docs.slint.dev/latest/docs/node

Main JavaScript entry point for the Deno example. Imports the Slint API, loads the .slint file, instantiates the Demo component, and runs it.

```ts
import * as slint from "slint-ui";
let ui = slint.loadFile(new URL("main.slint", import.meta.url));
let demo = new ui.Demo();


await demo.run();

```

--------------------------------

### match_indices examples

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedString

Returns an iterator over matches along with the starting index of each match. Shows the indices for non-overlapping matches of a string literal.

```rust
let v: Vec<_> = "abcXXXabcYYYabc".match_indices("abc").collect();
assert_eq!(v, [(0, "abc"), (6, "abc"), (12, "abc")]);

let v: Vec<_> = "1abcabc2".match_indices("abc").collect();
assert_eq!(v, [(1, "abc"), (4, "abc")]);
```

--------------------------------

### Run C++ application on Windows (tutorial step)

Source: https://docs.slint.dev/latest/docs/slint/tutorial/getting_started

Runs the application on Windows when stepping through the tutorial.

```sh
my_application
```

--------------------------------

### Initialize screen and run Slint app in appmain

Source: https://docs.slint.dev/latest/docs/cpp/mcu/stm32/generic

Example appmain function that initializes the LCD and touch screen using BSP functions, initializes the Slint platform integration, creates the AppWindow instance, and runs the event loop. It includes the necessary headers and calls Error_Handler on failures.

```cpp
#include <slint-stm32.h>
#include <stdio.h>
#include <stm32h735g_discovery.h>
#include <stm32h735g_discovery_lcd.h>
#include <stm32h735g_discovery_ts.h>

#include "app-window.h"

// Called from main()
extern "C" void appmain() {
    if (BSP_LCD_InitEx(0, LCD_ORIENTATION_LANDSCAPE, LCD_PIXEL_FORMAT_RGB565,
                        LCD_DEFAULT_WIDTH, LCD_DEFAULT_HEIGHT) != 0) {
        Error_Handler();
    }

    BSP_LCD_DisplayOn(0);
    BSP_LCD_SetActiveLayer(0, 0);

    TS_Init_t hTS;
    hTS.Width = LCD_DEFAULT_WIDTH;
    hTS.Height = LCD_DEFAULT_HEIGHT;
    hTS.Orientation = TS_SWAP_XY;
    hTS.Accuracy = 0;
    /* Touchscreen initialization */
    if (BSP_TS_Init(0, &hTS) != 0) {
        Error_Handler();
    }

    slint_stm32_init(SlintPlatformConfiguration());

    auto app_window = AppWindow::create();

    app_window->run();

    return 0;
}
```

--------------------------------

### Slider basic example

Source: https://docs.slint.dev/latest/docs/slint/reference/std-widgets/basic-widgets/slider

Shows a basic Slider inside a VerticalBox with a value of 42. Use this as a starting point for embedding a slider in a window.

```slint
import { Slider,  VerticalBox } from "std-widgets.slint";
export component Example inherits Window {
    width: 200px;
    height: 40px;

    VerticalBox {
        alignment: center;

        Slider {
            value: 42;
        }
    }
}
```

--------------------------------

### trim_start directionality example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedString

Shows the directionality of `trim_start`: it removes leading whitespace from the start of the byte string, which for right-to-left languages like Hebrew is the right side.

```rust
let s = "  English  ";
assert!(Some('E') == s.trim_start().chars().next());

let s = "  עברית  ";
assert!(Some('ע') == s.trim_start().chars().next());
```

--------------------------------

### Create app-window.slint UI

Source: https://docs.slint.dev/latest/docs/python

Slint UI definition for the quick start example. Declares an AppWindow component with a counter property and a button that triggers the request-increase-value callback.

```slint
import { Button, VerticalBox } from "std-widgets.slint";


export component AppWindow inherits Window {
    in-out property<int> counter: 42;
    callback request-increase-value();
    VerticalBox {
        Text {
            text: "Counter: \{root.counter}";
        }
        Button {
            text: "Increase value";
            clicked => {
                root.request-increase-value();
            }
        }
    }
}

```

--------------------------------

### Build and install Flatpak package with flatpak-builder

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/desktop/linux/packaging

Builds the Flatpak package and installs it for the current user. The first build downloads a couple of gigabytes and compiles every dependency; later builds reuse the cache in `.flatpak-builder`. Add the `build-dir` directory to `.gitignore`.

```bash
flatpak-builder --user --install --force-clean --install-deps-from=flathub \
    build-dir com.yourorganization.YourApp.yml
```

--------------------------------

### Check xbuild setup with x doctor

Source: https://docs.slint.dev/latest/docs/slint/guide/platforms/mobile/android

Run `x doctor` to check if all required tools are installed and found by xbuild, if `x run` doesn't work.

```sh
x doctor
```

--------------------------------

### Create Window from custom WindowAdapter

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.Window

Example for creating a Window from a custom WindowAdapter. Use this when implementing a custom backend with Platform::create_window_adapter. The window adapter must own the Window, so this uses Rc::new_cyclic.

```rust
use std::rc::Rc;
use slint::platform::{WindowAdapter, Renderer};
use slint::{Window, PhysicalSize};
struct MyWindowAdapter {
    window: Window,
    //...
}
impl WindowAdapter for MyWindowAdapter {
   fn window(&self) -> &Window { &self.window }
   fn size(&self) -> PhysicalSize { unimplemented!() }
   fn renderer(&self) -> &dyn Renderer { unimplemented!() }
}

fn create_window_adapter() -> Rc<dyn WindowAdapter> {
   Rc::<MyWindowAdapter>::new_cyclic(|weak| {
       MyWindowAdapter {
          window: Window::new(weak.clone()),
          //...
       }
   })
}
```

--------------------------------

### element_offset unaligned example

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Shows `element_offset` returning `None` when the reference does not point to the start of an element. Uses `as_flattened` to create a flat slice and then constructs references that may be unaligned.

```rust
let arr: &[[u32; 2]] = &[[0, 1], [2, 3]];
let flat_arr: &[u32] = arr.as_flattened();

let ok_elm: &[u32; 2] = flat_arr[0..2].try_into().unwrap();
let weird_elm: &[u32; 2] = flat_arr[1..3].try_into().unwrap();

assert_eq!(ok_elm, &[0, 1]);
assert_eq!(weird_elm, &[1, 2]);

assert_eq!(arr.element_offset(ok_elm), Some(0)); // Points to element 0
assert_eq!(arr.element_offset(weird_elm), None); // Points between element 0 and 1
```

--------------------------------

### windows examples

Source: https://docs.slint.dev/latest/docs/rust/slint/struct.SharedVector

Examples for the `windows` method. The first shows overlapping windows of size 3, the second shows that a slice shorter than the window size yields no values, and the third demonstrates using `Cell::as_slice_of_cells` to mutate elements through windows.

```rust
let slice = ['l', 'o', 'r', 'e', 'm'];
let mut iter = slice.windows(3);
assert_eq!(iter.next().unwrap(), &['l', 'o', 'r']);
assert_eq!(iter.next().unwrap(), &['o', 'r', 'e']);
assert_eq!(iter.next().unwrap(), &['r', 'e', 'm']);
assert!(iter.next().is_none());
```

```rust
let slice = ['f', 'o', 'o'];
let mut iter = slice.windows(4);
assert!(iter.next().is_none());
```

```rust
use std::cell::Cell;

let mut array = ['R', 'u', 's', 't', ' ', '2', '0', '1', '5'];
let slice = &mut array[..];
let slice_of_cells: &[Cell<char>] = Cell::from_mut(slice).as_slice_of_cells();
for w in slice_of_cells.windows(3) {
    Cell::swap(&w[0], &w[2]);
}
assert_eq!(array, ['s', 't', ' ', '2', '0', '1', '5', 'u', 'R']);
```

--------------------------------

### Main file include_modules and HelloWorld

Source: https://docs.slint.dev/latest/docs/rust/slint_build

In the main file, use slint::include_modules!() to include the generated code, then instantiate and run the HelloWorld component.

```rust
slint::include_modules!();
fn main() {
    HelloWorld::new().run();
}

```
Tokens:
Raw