1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: MIT
3
4import { HorizontalBox, VerticalBox, ListView, StandardListView, GroupBox, ComboBox } from "std-widgets.slint";
5import { GallerySettings } from "../gallery_settings.slint";
6import { Page } from "page.slint";
7
8export component ListViewPage inherits Page {
9 title: @tr("ListView");
10 show-enable-switch: false;
11 description: @tr("ListViews can be used to display a list of elements. The StandardListBox is like the default ListView just with a default text based definition of the visual items. Both can be imported from \"std-widgets.slint\"");
12
13 GroupBox {
14 vertical-stretch: 0;
15 title: @tr("Scroll Bar Policy:");
16
17 function policy-from-index(index: int) -> ScrollBarPolicy
18 {
19 if (index == 1) {
20 return ScrollBarPolicy.always-on;
21 }
22 if (index == 2) {
23 return ScrollBarPolicy.always-off;
24 }
25 return ScrollBarPolicy.as-needed;
26 }
27
28 HorizontalBox {
29 VerticalBox {
30 Text {
31 text: @tr("Vertical:");
32 }
33 vertical-scrollbar-policy := ComboBox {
34 in-out property<ScrollBarPolicy> current-policy: policy-from-index(self.current-index);
35
36 model: [@tr("As Needed"), @tr("Always On"), @tr("Always Off")];
37 }
38 }
39 VerticalBox {
40 Text {
41 text: @tr("Horizontal:");
42 }
43 horizontal-scrollbar-policy := ComboBox {
44 in-out property<ScrollBarPolicy> current-policy: policy-from-index(self.current-index);
45
46 model: [@tr("As Needed"), @tr("Always On"), @tr("Always Off")];
47 }
48 }
49 }
50 }
51
52 HorizontalBox {
53 vertical-stretch: 1;
54 GroupBox {
55 title: @tr("ListView");
56
57 ListView {
58 vertical-scrollbar-policy: vertical-scrollbar-policy.current-policy;
59 horizontal-scrollbar-policy: horizontal-scrollbar-policy.current-policy;
60 vertical-stretch: 0;
61 for i in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11] : HorizontalBox {
62 Image {
63 width: 24px;
64 source: @image-url("../../thumbsup.png");
65 }
66 Text {
67 text: @tr("Item {}", i);
68 }
69 }
70 }
71 }
72
73 GroupBox {
74 title: @tr("StandardListView");
75 vertical-stretch: 0;
76
77 StandardListView {
78 vertical-scrollbar-policy: vertical-scrollbar-policy.current-policy;
79 horizontal-scrollbar-policy: horizontal-scrollbar-policy.current-policy;
80 model: [
81 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
82 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
83 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
84 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
85 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
86 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
87 {text: @tr("Lorem")}, {text: @tr("ipsum")},{text: @tr("dolor")},{text: @tr("sit")},{text: @tr("amet")},{text: @tr("consetetur")},
88 ];
89 }
90 }
91 }
92}
93