mirror of
https://github.com/slint-ui/slint.git
synced 2025-11-03 13:23:00 +00:00
136 lines
4.9 KiB
Text
136 lines
4.9 KiB
Text
// Copyright © SixtyFPS GmbH <info@slint.dev>
|
|
// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-2.0 OR LicenseRef-Slint-Software-3.0
|
|
|
|
// cSpell: ignore Heade
|
|
|
|
import { Button, ComboBox, ListView, ScrollView, VerticalBox } from "std-widgets.slint";
|
|
import { Api, ComponentItem } from "api.slint";
|
|
|
|
import { DiagnosticsOverlay } from "./components/diagnostics-overlay.slint";
|
|
import { EditorSpaceSettings, Icons } from "./components/styling.slint";
|
|
import { StatusLine } from "./components/status-line.slint";
|
|
import { HeaderView } from "./views/header-view.slint";
|
|
import { LibraryView } from "./views/library-view.slint";
|
|
import { DrawAreaMode, PreviewView } from "./views/preview-view.slint";
|
|
import { PropertyView } from "./views/property-view.slint";
|
|
|
|
export { Api }
|
|
|
|
export component PreviewUi inherits Window {
|
|
property <length> border: 20px;
|
|
property <ComponentItem> visible-component: {
|
|
name: "",
|
|
defined-at: "",
|
|
pretty-location: "",
|
|
is-user-defined: false,
|
|
is-currently-shown: false,
|
|
};
|
|
property <bool> show-left-sidebar: true;
|
|
property <bool> show-right-sidebar: true;
|
|
|
|
title: "Slint Live-Preview";
|
|
icon: @image-url("assets/slint-logo-small-light.png");
|
|
|
|
VerticalLayout {
|
|
if !Api.show-preview-ui: no-ui-drawing-rect := Rectangle {
|
|
VerticalLayout {
|
|
ComponentContainer {
|
|
component-factory: Api.preview-area;
|
|
}
|
|
}
|
|
|
|
// Diagnostics overlay:
|
|
DiagnosticsOverlay {
|
|
width: 100%;
|
|
height: 100%;
|
|
diagnostics <=> Api.diagnostics;
|
|
show-document(url, line, column) => {
|
|
Api.show-document(url, line, column);
|
|
}
|
|
}
|
|
}
|
|
if Api.show-preview-ui: Rectangle {
|
|
VerticalLayout {
|
|
header-view := HeaderView {
|
|
show-left-sidebar <=> root.show-left-sidebar;
|
|
show-right-sidebar <=> root.show-right-sidebar;
|
|
|
|
edit-mode <=> Api.design-mode;
|
|
current-style <=> Api.current-style;
|
|
known-styles <=> Api.known-styles;
|
|
|
|
edit-mode-toggled() => {
|
|
key-handler.focus();
|
|
}
|
|
|
|
style-selected => {
|
|
Api.style-changed();
|
|
}
|
|
|
|
Button {
|
|
icon: Icons.sync;
|
|
colorize-icon: true;
|
|
clicked => { Api.reload-preview(); }
|
|
}
|
|
Button {
|
|
icon: Icons.inspect;
|
|
colorize-icon: true;
|
|
checkable: true;
|
|
checked <=> preview.select-mode;
|
|
enabled: !preview.design-mode;
|
|
}
|
|
}
|
|
|
|
HorizontalLayout {
|
|
spacing: EditorSpaceSettings.default-spacing;
|
|
|
|
if Api.design-mode && root.show-left-sidebar: LibraryView {
|
|
known-components: Api.known-components;
|
|
preview-area-position-x: preview.preview-area-position-x;
|
|
preview-area-position-y: preview.preview-area-position-y;
|
|
preview-area-width: preview.preview-area-width;
|
|
preview-area-height: preview.preview-area-height;
|
|
visible-component <=> root.visible-component;
|
|
|
|
can-drop(index, x, y, on-drop-area) => {
|
|
Api.can-drop(index, x, y, on-drop-area);
|
|
}
|
|
|
|
drop(index, x, y) => {
|
|
Api.drop(index, x, y);
|
|
}
|
|
|
|
show-preview-for(name, defined-at) => {
|
|
Api.show-preview-for(name, defined-at);
|
|
}
|
|
}
|
|
|
|
preview := PreviewView {
|
|
visible-component <=> root.visible-component;
|
|
}
|
|
|
|
if Api.design-mode && root.show-right-sidebar: PropertyView { }
|
|
}
|
|
|
|
StatusLine { }
|
|
}
|
|
|
|
key-handler := FocusScope {
|
|
enabled: preview.mode == DrawAreaMode.designing;
|
|
|
|
key-released(event) => {
|
|
if event.text == Key.Delete {
|
|
// This `if` should not be necessary, but without it
|
|
// we do trigger deletion of Elements while errors
|
|
// are on screen.
|
|
if preview.mode == DrawAreaMode.designing {
|
|
Api.selected-element-delete();
|
|
}
|
|
return accept;
|
|
}
|
|
reject
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|