Slint Kit Documentation

Navigation

KitDrawer

Panneau modal latéral borné à la largeur de sa fenêtre hôte.

Panneau modal latéral borné à la largeur de sa fenêtre hôte.
Capture native du même exemple, moteur Skia.

Montez-le à la racine de la fenêtre après le contenu défilant et donnez-lui tout le viewport. Connectez les callbacks hérités dismiss et focus-next, puis restore-focus, à la pile de modales et au registre de focus.

Le panneau est ancré au bord final et borne panel-width à la largeur disponible. L’ouverture place le focus sur Fermer ; l’hôte doit enregistrer les champs et restaurer l’ouvreur exact à la fermeture.

Voir le code source ↗

Exemple complet

Ce fichier Slint complet présente une composition visuelle et produit la capture ci-dessus. Les textes internes sans propriété de libellé conservent la langue par défaut du kit ; les dialogues système suivent la plateforme. Les états projetés et les signaux qui demandent une décision doivent être raccordés à l’hôte ; cet exemple isolé ne fournit pas ce contrôleur. Configurer le projet Rust, puis consulter l’application avec contrôleurs typés pour relier réellement édition, validation et sélection.

// Public label overrides localize this fixture; toolkit/host defaults keep their language.
// SPDX-License-Identifier: GPL-3.0-or-later
import { KitButton, KitDrawer, KitTextField, KitTheme, KitThemes } from "@kit/kit.slint";

export component Example inherits Window {
    title: "KitDrawer — exemple";
    preferred-width: 560px;
    preferred-height: 420px;
    max-width: 100000px;
    max-height: 100000px;
    background: root.theme.canvas;
    in-out property <KitTheme> theme: KitThemes.light;
    in-out property <string> status;
    KitDrawer { close-label: "Fermer le panneau"; theme: root.theme; panel-width: 380px * root.theme.text-scale; width: parent.width; height: parent.height; title: "Détails du projet"; state: { open: true, topmost: true, busy: false }; Text { text: "Notes de terrain"; color: root.theme.text-primary; font-size: 14px * root.theme.text-scale; wrap: word-wrap; vertical-stretch: 0; }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"; }KitButton { theme: root.theme; text: "Enregistrer les modifications"; activated => { root.status = "Action demandée"; } } if root.status != "": Text { text: root.status; color: root.theme.text-secondary; font-size: 12px * root.theme.text-scale; wrap: word-wrap; vertical-stretch: 0; } }
}

Télécharger cet exemple

API publique

Hérite de KitDialogSurface. Les déclarations suivantes sont extraites des sources du composant. Les propriétés du parent restent disponibles ; les détails de gestion d’état sont décrits dans le guide des contrôleurs.

Propriétés

Nom Type Sens
control-size ControlSize in
title string in
close-label string in
panel-width length in

Types et variantes

Les noms ci-dessous utilisent la syntaxe Slint. Les types Rust partagés se trouvent dans slint_kit ; les enums de présentation proviennent des types Rust générés par Slint.

Type Déclaration
enum ControlSize compact, medium, comfortable

Signaux

Fonctions

Voir aussi