Slint Kit Documentation

Gestion du focus

Cible de focus pour Slint

KitFocusTarget · Slint Kit 0.3.1

Pont entre une cible visuelle réelle et les requêtes du registre de focus.

Pont entre une cible visuelle réelle et les requêtes du registre de focus.
Application native de l’exemple ci-dessous.

Essayer le composant

Télécharger le projet complet, le décompresser et lancer cargo run --locked dans son dossier. Rust 1.92+ ; Slint Kit 0.3.0 depuis crates.io. Vous pouvez aussi copier les quatre fichiers ci-dessous.

Cliquez sur le bouton : Rust publie une nouvelle demande de focus ; saisissez ensuite le nom du projet.

ui/app.slint

export { KitFormValidation, HtmlInputKind, NumberInputFormat, KitInputConstraints, KitValidationResult, KitValidityState } from "@kit/kit.slint";
// SPDX-License-Identifier: GPL-3.0-or-later
import { KitFocusTarget, KitTextField, KitThemes, FocusRequest, KitButton } from "@kit/kit.slint";
export { FocusRequest }
export component App inherits Window {
    title: "KitFocusTarget";
    preferred-width: 460px;
    preferred-height: 260px;
    max-width: 100000px;
    max-height: 100000px;
    background: KitThemes.light.canvas;
    in-out property <string> draft;
    in property <FocusRequest> focus-request;
    callback request-focus();
    VerticalLayout {
        padding: 24px; spacing: 16px; alignment: start;
        KitButton { text: "Focus project name"; activated => { root.request-focus(); } }
        KitFocusTarget {
            token: 42; generation: 1; request: root.focus-request;
            focus-requested => { editor.take-focus(); }
            editor := KitTextField { label: "Project name"; text <=> root.draft; }
        }
        Text { text: "Draft: " + root.draft; color: KitThemes.light.text-primary; }
    }
}

src/main.rs

// SPDX-License-Identifier: GPL-3.0-or-later
use slint::ComponentHandle;
use std::cell::Cell;
slint::include_modules!();

fn main() -> Result<(), slint::PlatformError> {
    let app = App::new()?;
    slint_kit::init_form_validation!(self, app);
    let sequence = Cell::new(0_i32);
    let weak = app.as_weak();
    app.on_request_focus(move || {
        if let Some(app) = weak.upgrade() {
            let request = sequence
                .get()
                .checked_add(1)
                .expect("focus request capacity");
            sequence.set(request);
            app.set_focus_request(FocusRequest {
                present: true,
                token: 42,
                generation: 1,
                request,
            });
        }
    });
    app.run()
}
Cargo.toml et build.rs

Cargo.toml

[package]
name = "slint-kit-focus-target-example"
version = "0.1.0"
edition = "2024"
rust-version = "1.92"
license = "GPL-3.0-or-later"
publish = false

[dependencies]
slint-kit = "=0.3.0"
slint = { version = "=1.18.1", default-features = false, features = ["std", "compat-1-18", "backend-winit", "renderer-skia", "accessibility"] }

[build-dependencies]
slint-kit-build = "=0.3.0"

[workspace]

build.rs

fn main() {
    slint_kit_build::compile("ui/app.slint").expect("compile component example");
}

Fichiers : Cargo.toml · build.rs · ui/app.slint · src/main.rs

Attribuez un token et une generation stables. Publiez un nouveau FocusRequest depuis Rust à chaque demande, puis relayez focus-requested vers take-focus() du champ natif.

Une FocusRequest ne s’applique que si le token, la génération et l’éligibilité correspondent, une seule fois par identifiant de demande. Une cible recyclée doit changer de génération ; focus-applied confirme la demande traitée.

Voir le code source ↗

Composition visuelle

Le fichier ci-dessous produit la capture. Pour les composants pilotés par un contrôleur, il montre l’état affiché sans fournir le branchement Rust. Créer un projet.

Afficher le fichier de la capture
Pont entre une cible visuelle réelle et les requêtes du registre de focus.
Capture native du même exemple, moteur Skia.
// Public label overrides localize this fixture; toolkit/host defaults keep their language.
// SPDX-License-Identifier: GPL-3.0-or-later
import { KitFocusTarget, KitTextField, KitTheme, KitThemes } from "@kit/kit.slint";

export component Example inherits Window {
    title: "KitFocusTarget — exemple";
    preferred-width: 420px;
    preferred-height: 180px;
    max-width: 100000px;
    max-height: 100000px;
    background: root.theme.canvas;
    in-out property <KitTheme> theme: KitThemes.light;
    in-out property <string> status;
    VerticalLayout {
        padding: 24px; spacing: 16px; alignment: start;
        Text { text: "Cible de focus"; color: root.theme.text-primary; font-size: 20px * root.theme.text-scale; font-weight: 600; }
        KitFocusTarget { token: 42; generation: 1; request: { present: true, token: 42, generation: 1, request: 1 }; focus-requested => { editor.take-focus(); } editor := KitTextField { character-count-label: "caractères"; checking-label: "Vérification…"; clear-label: "Effacer la recherche"; hide-label: "Masquer le mot de passe"; reveal-label: "Afficher le mot de passe"; theme: root.theme; label: "Nom du projet"; text: "Notes de terrain"; } }
        if root.status != "": Text { text: root.status; color: root.theme.text-secondary; font-size: 12px * root.theme.text-scale; wrap: word-wrap; }
    }
}

Télécharger cet exemple

API publique

Hérite de FocusScope.

Propriétés

Nom Type Sens
token int in
generation int in
eligible bool in
request FocusRequest in

Types et variantes

Type Déclaration
struct FocusRequest present: bool, token: int, generation: int, request: int

Signaux

Voir aussi