language-servers/slint
1
0
Fork 0
mirror of https://github.com/slint-ui/slint.git synced 2025-11-01 12:24:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Fix flicker in the component list in design mode

Browse source 
Since the category items have different heights, the extrapolation of the listview to compute the correct scrollbar height will always be off, unless listview instantiated all items.

So let's do that by hand and use a ScrollView.
This commit is contained in:
Simon Hausmann 2024-07-12 08:08:32 +02:00 • committed by Simon Hausmann
parent 4c73006bf9
commit 16996dfa16
1 changed files with 36 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

70
tools/lsp/ui/components/expandable-listview.slint
View file

@ -1,7 +1,7 @@
// 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
import { ListView, HorizontalBox, Palette } from "std-widgets.slint";
import { HorizontalBox, Palette, ScrollView } from "std-widgets.slint";
import { ComponentListItem, ComponentItem } from "../api.slint";
import { StateLayer } from "./state-layer.slint";
import { EditorSizeSettings, EditorAnimationSettings, Icons } from "./styling.slint";
@ -112,7 +112,7 @@ component ItemTemplate {
]
}
export component ExpandableListView inherits ListView {
export component ExpandableListView inherits ScrollView {
in property <[ComponentListItem]> known-components;
in property <length> preview-area-position-x;
in property <length> preview-area-position-y;
@ -132,44 +132,46 @@ export component ExpandableListView inherits ListView {
property <bool> preview-visible: preview-area-width > 0px && preview-area-height > 0px;
property <length> list-spacing: 10px;
for cli[index] in root.known-components: VerticalLayout {
property <int> my-category-index: index;
header-item := HeaderItemTemplate {
text: cli.category;
}
if header-item.open : VerticalLayout {
for ci[index] in cli.components: ItemTemplate {
property <length> drop-x: self.absolute-position.x + self.mouse-x - root.preview-area-position-x;
property <length> drop-y: self.absolute-position.y + self.mouse-y - root.preview-area-position-y;
property <bool> on-drop-area:
VerticalLayout {
alignment: start;
for cli[index] in root.known-components: VerticalLayout {
property <int> my-category-index: index;
header-item := HeaderItemTemplate {
text: cli.category;
}
if header-item.open: VerticalLayout {
for ci[index] in cli.components: ItemTemplate {
property <length> drop-x: self.absolute-position.x + self.mouse-x - root.preview-area-position-x;
property <length> drop-y: self.absolute-position.y + self.mouse-y - root.preview-area-position-y;
property <bool> on-drop-area:
drop-x >= 0 && drop-x <= root.preview-area-width && drop-y >= 0 && drop-y <= root.preview-area-height;
property <ComponentItem> data: ci;
property <ComponentItem> data: ci;
can-drop-here: !self.data.is-currently-shown && root.can-drop(self.data.name, drop-x, drop-y, on-drop-area);
enabled: root.preview-visible;
text: ci.name;
offset: header-item.offset;
height: self.min-height;
can-drop-here: !self.data.is-currently-shown && root.can-drop(self.data.name, drop-x, drop-y, on-drop-area);
enabled: root.preview-visible;
text: ci.name;
offset: header-item.offset;
height: self.min-height;
clicked => {
if ci.is_user_defined && !ci.is_currently_shown {
root.show-preview-for(self.data.name, self.data.defined_at)
clicked => {
if ci.is_user_defined && !ci.is_currently_shown {
root.show-preview-for(self.data.name, self.data.defined_at)
}
}
pointer-event(event) => {
if self.can-drop-here && event.kind == PointerEventKind.up && event.button == PointerEventButton.left {
root.drop(self.data.name, drop-x, drop-y);
}
}
init() => {
root.visible-component = ci;
}
}
pointer-event(event) => {
if self.can-drop-here && event.kind == PointerEventKind.up && event.button == PointerEventButton.left {
root.drop(self.data.name, drop-x, drop-y);
}
}
init() => {
root.visible-component = ci;
}
}
}
}
}
}