// Copyright © SixtyFPS GmbH // SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-1.0 OR LicenseRef-Slint-commercial import { ScrollView } from "scrollview.slint"; import { ListItem } from "components.slint"; // `ListView` is like a `Scrollview` but it should have a `for` element, and the content is automatically laid out in a list. export component ListView inherits ScrollView { @children } component StandardListViewBase inherits ListView { private property item-height: self.viewport-height / self.model.length; private property current-item-y: self.viewport-y + current-item * item-height; in property <[StandardListViewItem]> model; in-out property current-item: -1; for item[idx] in root.model : ListItem { selected: idx == root.current-item; text: item.text; clicked => { set-current-item(idx); } } public function set-current-item(index: int) { if(index < 0 || index >= model.length) { return; } current-item = index; if(current-item-y < 0) { self.viewport-y += 0 - current-item-y; } if(current-item-y + item-height > self.visible-height) { self.viewport-y -= current-item-y + item-height - self.visible-height; } } } // Like `ListView`, but with a default delegate, and a `model` property which is a model of type `StandardListViewItem`. export component StandardListView inherits StandardListViewBase { FocusScope { key-pressed(event) => { if (event.text == Key.UpArrow) { root.set-current-item(root.current-item - 1); return accept; } else if (event.text == Key.DownArrow) { root.set-current-item(root.current-item + 1); return accept; } reject } } }