@@ -20,7 +20,6 @@ class _BasemapStyleExamplePageState extends State<BasemapStyleExamplePage> {
20
20
ArcgisMapController ? _controller;
21
21
BaseMap selectedBasemap = BaseMap .values.first;
22
22
bool show3dMap = false ;
23
- bool isBasemapMenuOpened = false ;
24
23
final initialCenter = const LatLng (51.16 , 10.45 );
25
24
final tappedHQ = const LatLng (48.1234963 , 11.5910182 );
26
25
@@ -63,192 +62,184 @@ class _BasemapStyleExamplePageState extends State<BasemapStyleExamplePage> {
63
62
@override
64
63
Widget build (BuildContext context) {
65
64
return Scaffold (
66
- // appBar: AppBar(),
67
65
key: _scaffoldKey,
68
- body: GestureDetector (
69
- onTap: () {
70
- setState (() {
71
- isBasemapMenuOpened = false ;
72
- });
73
- },
74
- child: Stack (
75
- children: [
76
- ArcgisMap (
77
- mapStyle: show3dMap ? MapStyle .threeD : MapStyle .twoD,
78
- apiKey: arcGisApiKey,
79
- basemap: BaseMap .osmDarkGray,
80
- ground: show3dMap ? Ground .worldElevation : null ,
81
- showLabelsBeneathGraphics: true ,
82
- initialCenter: initialCenter,
83
- zoom: 8 ,
84
- rotationEnabled: true ,
85
- onMapCreated: _onMapCreated,
86
- defaultUiList: [
87
- DefaultWidget (
88
- viewType: DefaultWidgetType .compass,
89
- position: WidgetPosition .topRight,
90
- ),
91
- ],
92
- ),
93
- Positioned (
94
- top: MediaQuery .paddingOf (context).top + 8 ,
95
- left: 8 ,
96
- child: BackButton (
97
- color: Colors .black,
98
- style: ButtonStyle (
99
- backgroundColor: WidgetStatePropertyAll (Colors .grey)),
66
+ body: Stack (
67
+ children: [
68
+ ArcgisMap (
69
+ mapStyle: show3dMap ? MapStyle .threeD : MapStyle .twoD,
70
+ apiKey: arcGisApiKey,
71
+ basemap: BaseMap .osmDarkGray,
72
+ ground: show3dMap ? Ground .worldElevation : null ,
73
+ showLabelsBeneathGraphics: true ,
74
+ initialCenter: initialCenter,
75
+ zoom: 8 ,
76
+ rotationEnabled: true ,
77
+ onMapCreated: _onMapCreated,
78
+ defaultUiList: [
79
+ DefaultWidget (
80
+ viewType: DefaultWidgetType .compass,
81
+ position: WidgetPosition .topRight,
100
82
),
83
+ ],
84
+ ),
85
+ Positioned (
86
+ top: MediaQuery .paddingOf (context).top + 8 ,
87
+ left: 8 ,
88
+ child: BackButton (
89
+ color: Colors .black,
90
+ style: ButtonStyle (
91
+ backgroundColor: WidgetStatePropertyAll (Colors .grey)),
101
92
),
102
- Positioned (
103
- bottom: 40 ,
104
- right: 0 ,
105
- left: 0 ,
106
- child: Column (
107
- crossAxisAlignment: CrossAxisAlignment .start,
108
- children: [
109
- Row (
110
- children: [
111
- FloatingActionButton (
112
- heroTag: "zoom-in-button" ,
113
- onPressed: () {
114
- _controller? .zoomIn (
115
- lodFactor: 1 ,
116
- animationOptions: AnimationOptions (
117
- duration: 1000 ,
118
- animationCurve: AnimationCurve .easeIn,
119
- ),
120
- );
121
- },
122
- backgroundColor: Colors .grey,
123
- child: const Icon (Icons .add),
124
- ),
125
- FloatingActionButton (
126
- heroTag: "zoom-out-button" ,
127
- onPressed: () {
128
- _controller? .zoomOut (
129
- lodFactor: 1 ,
130
- animationOptions: AnimationOptions (
131
- duration: 1000 ,
132
- animationCurve: AnimationCurve .easeIn,
133
- ),
134
- );
135
- },
136
- backgroundColor: Colors .grey,
137
- child: const Icon (Icons .remove),
138
- ),
93
+ ),
94
+ Positioned (
95
+ bottom: 40 ,
96
+ right: 0 ,
97
+ left: 0 ,
98
+ child: Column (
99
+ crossAxisAlignment: CrossAxisAlignment .start,
100
+ children: [
101
+ Row (
102
+ children: [
103
+ FloatingActionButton (
104
+ heroTag: "zoom-in-button" ,
105
+ onPressed: () {
106
+ _controller? .zoomIn (
107
+ lodFactor: 1 ,
108
+ animationOptions: AnimationOptions (
109
+ duration: 1000 ,
110
+ animationCurve: AnimationCurve .easeIn,
111
+ ),
112
+ );
113
+ },
114
+ backgroundColor: Colors .grey,
115
+ child: const Icon (Icons .add),
116
+ ),
117
+ FloatingActionButton (
118
+ heroTag: "zoom-out-button" ,
119
+ onPressed: () {
120
+ _controller? .zoomOut (
121
+ lodFactor: 1 ,
122
+ animationOptions: AnimationOptions (
123
+ duration: 1000 ,
124
+ animationCurve: AnimationCurve .easeIn,
125
+ ),
126
+ );
127
+ },
128
+ backgroundColor: Colors .grey,
129
+ child: const Icon (Icons .remove),
130
+ ),
131
+ FloatingActionButton (
132
+ heroTag: "move-camera-button" ,
133
+ backgroundColor: Colors .red,
134
+ child: const Icon (Icons .place_outlined),
135
+ onPressed: () {
136
+ _controller? .moveCamera (
137
+ point: tappedHQ,
138
+ zoomLevel: 8.0 ,
139
+ threeDHeading: 30 ,
140
+ threeDTilt: 60 ,
141
+ animationOptions: AnimationOptions (
142
+ duration: 1500 ,
143
+ animationCurve: AnimationCurve .easeIn,
144
+ ),
145
+ );
146
+ },
147
+ ),
148
+ if (kIsWeb)
139
149
FloatingActionButton (
140
- heroTag: "move-camera-button" ,
141
- backgroundColor: Colors .red,
142
- child: const Icon (Icons .place_outlined),
150
+ heroTag: "3d-map-button" ,
143
151
onPressed: () {
144
- _controller? .moveCamera (
145
- point: tappedHQ,
146
- zoomLevel: 8.0 ,
147
- threeDHeading: 30 ,
148
- threeDTilt: 60 ,
149
- animationOptions: AnimationOptions (
150
- duration: 1500 ,
151
- animationCurve: AnimationCurve .easeIn,
152
- ),
153
- );
152
+ setState (() {
153
+ show3dMap = ! show3dMap;
154
+ _controller? .switchMapStyle (
155
+ show3dMap ? MapStyle .threeD : MapStyle .twoD,
156
+ );
157
+ });
154
158
},
159
+ backgroundColor: show3dMap ? Colors .red : Colors .blue,
160
+ child: Text (show3dMap ? '3D' : '2D' ),
155
161
),
156
- if (kIsWeb)
157
- FloatingActionButton (
158
- heroTag: "3d-map-button" ,
159
- onPressed: () {
160
- setState (() {
161
- show3dMap = ! show3dMap;
162
- _controller? .switchMapStyle (
163
- show3dMap ? MapStyle .threeD : MapStyle .twoD,
164
- );
165
- });
166
- },
167
- backgroundColor: show3dMap ? Colors .red : Colors .blue,
168
- child: Text (show3dMap ? '3D' : '2D' ),
169
- ),
170
- ],
171
- ),
172
- SizedBox (height: 8 ),
173
- Center (
174
- child: ElevatedButton (
175
- style: ButtonStyle (
176
- shape: WidgetStatePropertyAll (
177
- RoundedRectangleBorder (
178
- borderRadius: BorderRadius .circular (8 )),
179
- ),
162
+ ],
163
+ ),
164
+ SizedBox (height: 8 ),
165
+ Center (
166
+ child: ElevatedButton (
167
+ style: ButtonStyle (
168
+ shape: WidgetStatePropertyAll (
169
+ RoundedRectangleBorder (
170
+ borderRadius: BorderRadius .circular (8 )),
180
171
),
181
- onPressed : () {
182
- showModalBottomSheet (
183
- context : context,
184
- builder : ( context) {
185
- return PointerInterceptorWeb (
186
- child : ListView . separated (
187
- padding : EdgeInsets . only (
188
- top : 8 ,
189
- bottom :
190
- MediaQuery . paddingOf (context). bottom +
191
- 8 ),
192
- itemCount : BaseMap .values.length ,
193
- separatorBuilder : (_, __) => Padding (
194
- padding : const EdgeInsets . symmetric (
195
- horizontal : 20 ),
196
- child : Divider (
197
- height : 1 ,
198
- ) ,
172
+ ),
173
+ onPressed : () {
174
+ showModalBottomSheet (
175
+ context : context,
176
+ builder : (context) {
177
+ return PointerInterceptorWeb (
178
+ child : ListView . separated (
179
+ padding : EdgeInsets . only (
180
+ top : 8 ,
181
+ bottom:
182
+ MediaQuery . paddingOf (context).bottom +
183
+ 8 ) ,
184
+ itemCount : BaseMap .values.length,
185
+ separatorBuilder : (_, __) => Padding (
186
+ padding : const EdgeInsets . symmetric (
187
+ horizontal : 20 ),
188
+ child : Divider (
189
+ height : 1 ,
199
190
),
200
- itemBuilder: (context, int i) {
201
- final basemap = BaseMap .values[i];
202
- return ListTile (
203
- dense: true ,
204
- onTap: () {
205
- Navigator .pop (context);
206
- setState (() {
207
- selectedBasemap = basemap;
208
- });
191
+ ),
192
+ itemBuilder: (context, int i) {
193
+ final basemap = BaseMap .values[i];
194
+ return ListTile (
195
+ dense: true ,
196
+ onTap: () {
197
+ Navigator .pop (context);
198
+ setState (() {
199
+ selectedBasemap = basemap;
200
+ });
209
201
210
- _controller!
211
- .toggleBaseMap (baseMap: basemap);
212
- },
213
- title: Text (
214
- basemap.name,
215
- style: TextStyle (
216
- color: Theme .of (context)
217
- .buttonTheme
218
- .colorScheme!
219
- .onPrimaryContainer,
220
- ),
202
+ _controller!
203
+ .toggleBaseMap (baseMap: basemap);
204
+ },
205
+ title: Text (
206
+ basemap.name,
207
+ style: TextStyle (
208
+ color: Theme .of (context)
209
+ .buttonTheme
210
+ .colorScheme!
211
+ .onPrimaryContainer,
221
212
),
222
- );
223
- },
224
- ) ,
225
- );
226
- } );
227
- },
228
- child : Row (
229
- mainAxisSize : MainAxisSize .min,
230
- children : [
231
- Text (
232
- selectedBasemap.name,
233
- style : TextStyle (
234
- decoration : TextDecoration .underline,
235
- fontSize : 15 ,
236
- ) ,
213
+ ),
214
+ );
215
+ } ,
216
+ ),
217
+ );
218
+ });
219
+ },
220
+ child : Row (
221
+ mainAxisSize : MainAxisSize .min,
222
+ children : [
223
+ Text (
224
+ selectedBasemap.name,
225
+ style : TextStyle (
226
+ decoration : TextDecoration .underline ,
227
+ fontSize : 15 ,
237
228
),
238
- SizedBox (width : 8 ),
239
- Icon (
240
- Icons .keyboard_arrow_down,
241
- size : 22 ,
242
- )
243
- ],
244
- ) ,
229
+ ),
230
+ SizedBox (width : 8 ),
231
+ Icon (
232
+ Icons .keyboard_arrow_down ,
233
+ size : 22 ,
234
+ )
235
+ ] ,
245
236
),
246
237
),
247
- ] ,
248
- ) ,
238
+ ) ,
239
+ ] ,
249
240
),
250
- ] ,
251
- ) ,
241
+ ) ,
242
+ ] ,
252
243
),
253
244
);
254
245
}
0 commit comments