Warning, /education/marble/examples/qml/explore/explore.qml is written in an unsupported language. File is not indexed.
0001 // SPDX-License-Identifier: LGPL-2.1-or-later 0002 // 0003 // SPDX-FileCopyrightText: 2010 Dennis Nienhüser <nienhueser@kde.org> 0004 // 0005 0006 import Qt 4.7 0007 import org.kde.marble 0.20 0008 0009 Rectangle { 0010 id: screen 0011 width: 600; height: 450 0012 0013 SystemPalette { id: activePalette } 0014 0015 Flipable { 0016 id: flipable 0017 width: screen.width 0018 height: screen.height 0019 scale: 1 0020 z: 0 0021 transformOrigin: "Center" 0022 rotation: 0 0023 0024 property int angle: 0 0025 property bool flipped: false 0026 0027 MapThemeManager { 0028 id: themes 0029 } 0030 0031 MarbleSettings { 0032 id: settings 0033 } 0034 0035 front: 0036 0037 MarbleWidget { 0038 id: map 0039 width: flipable.width 0040 height: flipable.height 0041 0042 mapThemeId: settings.mapTheme 0043 activeFloatItems: [ "compass", "scalebar", "progress" ] 0044 0045 FloatButton { 0046 id: configure 0047 image: "configure.svg" 0048 x: flipable.width - width - 10 0049 y: flipable.height - height - 10; 0050 0051 onClicked: flipable.flipped = !flipable.flipped 0052 } 0053 0054 FloatButton { 0055 id: zoom_in 0056 anchors.bottom: configure.top 0057 image: "zoom-in.svg" 0058 x: flipable.width - width - 10 0059 0060 onClicked: map.zoomIn() 0061 } 0062 0063 FloatButton { 0064 id: zoom_out 0065 anchors.bottom: zoom_in.top 0066 0067 image: "zoom-out.svg" 0068 x: flipable.width - width - 10 0069 0070 onClicked: map.zoomOut() 0071 } 0072 0073 Component.onCompleted: { 0074 map.center.longitude = settings.quitLongitude 0075 map.center.latitude = settings.quitLatitude 0076 map.radius = settings.quitRadius 0077 } 0078 } 0079 0080 back: 0081 0082 Rectangle { 0083 x: 0; y:0 0084 width: screen.width; 0085 height: screen.height; 0086 color: "black" 0087 0088 Component { 0089 id: delegate 0090 Item { 0091 id: wrapper 0092 width: 128+10; height: 128+25 0093 Column { 0094 x: 5; y: 10 0095 Image { 0096 id: mapimaged 0097 width: 128; height: 128; 0098 source: "image://maptheme/" + model.modelData.id 0099 } 0100 Text { 0101 width: parent.width 0102 anchors.left: model.modelData.name.right 0103 text: model.modelData.name; 0104 font.pointSize: 8 0105 horizontalAlignment: "AlignHCenter" 0106 color: "white" 0107 } 0108 } 0109 } 0110 } 0111 // Define a highlight component. Just one of these will be instantiated 0112 // by each ListView and placed behind the current item. 0113 Component { 0114 id: highlight 0115 Rectangle { 0116 color: "lightsteelblue" 0117 radius: 5 0118 } 0119 } 0120 // The actual list 0121 GridView { 0122 id: mapListView 0123 width: parent.width; height: parent.height - flipback.height - 30 0124 cellWidth: 130; cellHeight: 150 0125 model: themes.mapThemes() 0126 delegate: delegate 0127 highlight: highlight 0128 focus: true 0129 clip: true 0130 //orientation: "Horizontal" 0131 0132 MouseArea { 0133 id: maplistarea 0134 anchors.fill: parent 0135 0136 onClicked: { 0137 var x = maplistarea.mouseX + mapListView.contentX 0138 var y = maplistarea.mouseY + mapListView.contentY 0139 mapListView.currentIndex = mapListView.indexAt( x, y ) 0140 } 0141 } 0142 0143 Rectangle { 0144 opacity: 0.5; 0145 anchors.top: mapListView.bottom; 0146 height: 6 0147 x: mapListView.visibleArea.xPosition * mapListView.width 0148 width: mapListView.visibleArea.widthRatio * mapListView.width 0149 color: "black" 0150 } 0151 } 0152 0153 FloatButton { 0154 id: flipback 0155 image: "flipback.svg" 0156 x: 10 0157 y: flipable.height - height - 10; 0158 0159 onClicked: { 0160 // First go back, then apply changes 0161 flipable.flipped = !flipable.flipped 0162 0163 map.mapThemeId = themes.mapThemes()[mapListView.currentIndex].id 0164 } 0165 } 0166 } 0167 0168 transform: Rotation { 0169 origin.x: flipable.width/2 0170 origin.y: flipable.height/2 0171 axis.x: 1; axis.y:0; axis.z: 0 // rotate around y-axis 0172 angle: flipable.angle 0173 } 0174 0175 states: State { 0176 name: "back" 0177 PropertyChanges { target: flipable; angle: 180 } 0178 when: flipable.flipped 0179 } 0180 0181 transitions: Transition { 0182 NumberAnimation { properties: "angle"; duration: 400 } 0183 } 0184 } 0185 }