Slint Kit Documentation

Fichiers

Liste de fichiers pour Slint

KitFileList · Slint Kit 0.3.1

Lignes de fichiers avec nom, détail et action de retrait.

Lignes de fichiers avec nom, détail et action de retrait.
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.

Retirez une ressource d’exemple. Rust retire sa clé stable puis projette une nouvelle génération ; aucun fichier n’est supprimé du disque.

ui/app.slint

export { KitFormValidation, HtmlInputKind, NumberInputFormat, KitInputConstraints, KitValidationResult, KitValidityState } from "@kit/kit.slint";
import {KitFileList,KitThemes,FileViewEntry} from "@kit/kit.slint";
export {FileViewEntry}
export component App inherits Window {
 title:"File list";preferred-width:540px;preferred-height:320px;max-width:100000px;max-height:100000px;background:KitThemes.light.canvas;
 in property <[FileViewEntry]> entries;in property <string> status;callback remove(int,int);
 VerticalLayout{padding:24px;spacing:16px;alignment:start;
 control:=KitFileList{entries:root.entries;remove-requested(token,generation)=>{root.remove(token,generation);}}
 Text{text:root.status;color:KitThemes.light.text-primary;}
 }
}

src/main.rs

use slint::ComponentHandle;
use std::{cell::RefCell, rc::Rc};
mod ui {
    slint::include_modules!();
}
#[derive(Clone, Copy, PartialEq)]
struct FileId(i32);
struct Entry {
    id: FileId,
    name: &'static str,
}
struct Files {
    generation: i32,
    entries: Vec<Entry>,
}
fn publish(app: &ui::App, state: &Files) {
    app.set_entries(slint::ModelRc::new(slint::VecModel::from(
        state
            .entries
            .iter()
            .map(|entry| ui::FileViewEntry {
                token: entry.id.0,
                generation: state.generation,
                name: entry.name.into(),
                detail: "Sample resource".into(),
                removable: true,
            })
            .collect::<Vec<_>>(),
    )));
    app.set_status(format!("{} selected files", state.entries.len()).into());
}
fn main() -> Result<(), slint::PlatformError> {
    let app = ui::App::new()?;
    slint_kit::init_form_validation!(ui, app);
    let state = Rc::new(RefCell::new(Files {
        generation: 1,
        entries: vec![
            Entry {
                id: FileId(11),
                name: "brief.txt",
            },
            Entry {
                id: FileId(23),
                name: "notes.md",
            },
        ],
    }));
    publish(&app, &state.borrow());
    let weak = app.as_weak();
    app.on_remove(move |token, generation| {
        if let Some(app) = weak.upgrade() {
            let mut state = state.borrow_mut();
            if state.generation != generation {
                return;
            }
            state.entries.retain(|entry| entry.id != FileId(token));
            state.generation = state.generation.checked_add(1).expect("view generation");
            publish(&app, &state);
        }
    });
    app.run()
}

Cargo.toml et build.rs

Cargo.toml

[package]
name = "slint-kit-file-list-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

Projetez chaque élément vers FileViewEntry avec un identifiant stable et une génération de vue. Vérifiez les deux dans remove-requested.

L’exemple retire les entrées de sa sélection en mémoire. Retirer une ligne ne supprime pas le fichier du disque.

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
Lignes de fichiers avec nom, détail et action de retrait.
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 { KitFileList, KitTheme, KitThemes } from "@kit/kit.slint";

export component Example inherits Window {
    title: "KitFileList — exemple";
    preferred-width: 520px;
    preferred-height: 260px;
    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: "Liste de fichiers"; color: root.theme.text-primary; font-size: 20px * root.theme.text-scale; font-weight: 600; }
        KitFileList { theme: root.theme; entries: [{ token: 11, generation: 1, name: "project-brief.txt", detail: "Document texte · 2,4 Ko", removable: true }, { token: 23, generation: 1, name: "meeting-notes.md", detail: "Markdown · 1,2 Ko", removable: true }]; remove-requested(token, generation) => { root.status = "Retirer le fichier d’identifiant " + token; } }
        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 Rectangle.

Propriétés

Nom Type Sens
theme KitTheme in
control-size ControlSize in
access FieldAccess in
entries [FileViewEntry] in

Types et variantes

Type Déclaration
enum ControlSize compact, medium, comfortable
enum FieldAccess editable, read-only, disabled
struct FileViewEntry token: int, generation: int, name: string, detail: string, removable: bool

Signaux

Voir aussi