Skip to content

Commit

Permalink
live-preview: Make ExpandableGroup more re-usable
Browse files Browse the repository at this point in the history 
I want to use this for runtime properties later.
  • Loading branch information
@hunger
hunger committed Feb 5, 2025
1 parent 25f3bfd commit 595b571
Show file tree
Hide file tree
Showing 2 changed files with 68 additions and 66 deletions.
68 changes: 10 additions & 58 deletions tools/lsp/ui/components/property-widgets.slint
View file
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@ component ResettingLineEdit {
}
}

component CodeWidget inherits VerticalLayout {
export component CodeWidget inherits VerticalLayout {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -234,7 +234,7 @@ component SecondaryContent inherits Rectangle {
}
}

component FloatWidget inherits VerticalLayout {
export component FloatWidget inherits VerticalLayout {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -321,7 +321,7 @@ component FloatWidget inherits VerticalLayout {
}
}

component StringWidget {
export component StringWidget {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -429,7 +429,7 @@ component ColorLineEdit inherits HorizontalLayout {
}
}

component ColorWidget inherits Rectangle {
export component ColorWidget inherits Rectangle {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -533,7 +533,7 @@ component ColorWidget inherits Rectangle {
}
}

component IntegerWidget inherits VerticalLayout {
export component IntegerWidget inherits VerticalLayout {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -576,7 +576,7 @@ component IntegerWidget inherits VerticalLayout {
}
}

component EnumWidget inherits VerticalLayout {
export component EnumWidget inherits VerticalLayout {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -606,7 +606,7 @@ component EnumWidget inherits VerticalLayout {
}
}

component BooleanWidget inherits VerticalLayout {
export component BooleanWidget inherits VerticalLayout {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <PropertyInformation> property-information;
Expand Down Expand Up @@ -649,9 +649,7 @@ component BooleanWidget inherits VerticalLayout {

export component ExpandableGroup {
in property <bool> enabled;
in property <ElementInformation> element-information;
in property <string> text;
in property <[PropertyInformation]> properties;
in property <length> panel-width;

property <bool> open: true;
Expand Down Expand Up @@ -700,56 +698,10 @@ export component ExpandableGroup {
}
}

if root.open: Rectangle {
// background: Palette.alternate-background;
VerticalLayout {
spacing: EditorSpaceSettings.property-spacing;
padding-left: EditorSpaceSettings.group-indent;
padding-right: EditorSpaceSettings.group-indent;
padding-top: EditorSpaceSettings.default-padding;
padding-bottom: EditorSpaceSettings.default-padding;

for property in root.properties: HorizontalLayout {
alignment: stretch;

if property.value.kind == PropertyValueKind.boolean: BooleanWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if (property.value.kind == PropertyValueKind.color) || (property.value.kind == PropertyValueKind.brush): ColorWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
Rectangle {
height: root.open ? self.preferred-height : 0px;

if property.value.kind == PropertyValueKind.code: CodeWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.enum: EnumWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.integer: IntegerWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.string: StringWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.float: FloatWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
}
}
@children
}
}
}
Expand Down
66 changes: 58 additions & 8 deletions tools/lsp/ui/views/property-view.slint
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,16 @@

import { Palette, VerticalBox, ScrollView } from "std-widgets.slint";

import { Api, ElementInformation, PropertyGroup } from "../api.slint";
import { Api, ElementInformation, PropertyGroup, PropertyInformation, PropertyValueKind } from "../api.slint";
import { GroupHeader } from "../components/group.slint";
import { EditorSizeSettings } from "../components/styling.slint";
import { EditorSizeSettings, EditorSpaceSettings } from "../components/styling.slint";

import { ExpandableGroup } from "../components/property-widgets.slint";
import { BooleanWidget, ColorWidget, CodeWidget, EnumWidget, ExpandableGroup, FloatWidget, IntegerWidget, StringWidget } from "../components/property-widgets.slint";

export component PropertyView {
in property <bool> enabled;

property <ElementInformation> current-element <=> Api.current-element;
property <ElementInformation> element-information <=> Api.current-element;
property <[PropertyGroup]> properties <=> Api.properties;

property <length> key-width: self.width / 2.5;
Expand All @@ -22,7 +22,7 @@ export component PropertyView {

content-layer := VerticalLayout {
GroupHeader {
title: @tr("{} Properties", root.current-element.type-name);
title: @tr("{} Properties", root.element-information.type-name);
vertical-stretch: 0;
}

Expand All @@ -38,13 +38,63 @@ export component PropertyView {
groups := VerticalBox {
alignment: start;

for group in root.properties: ExpandableGroup {
for group in root.properties: eg := ExpandableGroup {
property <[PropertyInformation]> properties: group.properties;

enabled: root.enabled;

text: group.group-name;
panel-width: content-layer.width;
element-information <=> root.current-element;
properties: group.properties;

VerticalLayout {
spacing: EditorSpaceSettings.property-spacing;
padding-left: EditorSpaceSettings.group-indent;
padding-right: EditorSpaceSettings.group-indent;
padding-top: EditorSpaceSettings.default-padding;
padding-bottom: EditorSpaceSettings.default-padding;

for property in eg.properties: HorizontalLayout {
alignment: stretch;

if property.value.kind == PropertyValueKind.boolean: BooleanWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if (property.value.kind == PropertyValueKind.color) || (property.value.kind == PropertyValueKind.brush): ColorWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}

if property.value.kind == PropertyValueKind.code: CodeWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.enum: EnumWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.float: FloatWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.integer: IntegerWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
if property.value.kind == PropertyValueKind.string: StringWidget {
enabled: root.enabled;
element-information <=> root.element-information;
property-information: property;
}
}
}

}
}
}
Expand Down

0 comments on commit 595b571

Please sign in to comment.