maplibre-native-slint/cpp/map_window.slint at main · maplibre/maplibre-native-slint · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
import { Button, VerticalBox, ComboBox, HorizontalBox, Slider } from "std-widgets.slint";
import { MMapView, MMapAdapter } from "@maplibre-native-slint/maplibre.slint";

export { MMapAdapter }

// Re-export Size for C++ backend to read map dimensions
export struct Size {
    width: length,
    height: length,
}

export component MapWindow inherits Window {
    preferred-width: 800px;
    preferred-height: 600px;

    // Expose map area size for C++ backend initialization/resize
    out property<Size> map-size: { width: map.width, height: map.height };
    callback map-size-changed;
    changed map-size => { map-size-changed(); }

    property <[string]> style-urls: [
        "https://demotiles.maplibre.org/style.json",
        "https://tile.openstreetmap.jp/styles/osm-bright/style.json",
    ];

    VerticalBox {
        HorizontalBox {
            ComboBox {
                model: root.style-urls;
                selected(url) => {
                    map.style-url = url;
                }
            }
            Button {
                text: "Paris";
                clicked => { map.fly-to(48.8566, 2.3522, 10); }
            }
            Button {
                text: "New York";
                clicked => { map.fly-to(40.7128, -74.0060, 10); }
            }
            Button {
                text: "Tokyo";
                clicked => { map.fly-to(35.6895, 139.6917, 10); }
            }
            Text {
                text: "Pitch:";
                vertical-alignment: center;
            }
            Slider {
                minimum: 0;
                maximum: 100;
                value: 0;
                changed value => {
                    map.set-pitch(self.value / 100 * 60);
                }
            }
            Text {
                text: "Bearing:";
                vertical-alignment: center;
            }
            Slider {
                minimum: 0;
                maximum: 100;
                value: 0;
                changed value => {
                    map.set-bearing(self.value / 100 * 360);
                }
            }
            Text {
                text: "Zoom: " + round(map.current-zoom);
                vertical-alignment: center;
            }
        }
        map := MMapView {
            style-url: "https://demotiles.maplibre.org/style.json";
            center-lat: 0;
            center-lon: 0;
            zoom: 1;
        }
    }
}