1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: MIT
3
4import { Theme } from "../theme.slint";
5
6component Bubble inherits Rectangle {
7 in property <bool> selected;
8
9 states [
10 selected when selected : {
11 background: Theme.palette.white;
12 }
13 ]
14
15 min_width: 5px;
16 min_height: 5px;
17 border-radius: max(self.width, self.height) / 2;
18 background: Theme.palette.slint-blue;
19
20 i-touch-area := TouchArea {}
21}
22
23export component Pagination {
24 in property <int> count;
25 in property <int> selected_index;
26
27 callback clicked <=> i-touch-area.clicked;
28
29 min-height: 26px;
30 vertical-stretch: 0;
31
32 VerticalLayout {
33 alignment: center;
34
35 HorizontalLayout {
36 alignment: center;
37 spacing: Theme.spaces.small;
38
39 for index in count : Bubble {
40 selected: index == selected-index;
41 }
42 }
43 }
44
45 i-touch-area := TouchArea {}
46}