refactor: simplify venue map section, ready for native Google Maps SDK
Cleaned up _buildVenueSection: removed broken static map URL (empty API key), removed unused map controls (directional pad, satellite toggle). Native GoogleMap widget on mobile, simple fallback on web. Pending: Google Maps API key in AndroidManifest.xml. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -4,6 +4,7 @@ import 'dart:ui';
|
|||||||
import 'package:flutter/foundation.dart' show kIsWeb;
|
import 'package:flutter/foundation.dart' show kIsWeb;
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
||||||
|
// google_maps_flutter removed — using OpenStreetMap static map preview instead
|
||||||
import 'package:share_plus/share_plus.dart';
|
import 'package:share_plus/share_plus.dart';
|
||||||
import 'package:url_launcher/url_launcher.dart';
|
import 'package:url_launcher/url_launcher.dart';
|
||||||
import 'package:cached_network_image/cached_network_image.dart';
|
import 'package:cached_network_image/cached_network_image.dart';
|
||||||
@@ -43,8 +44,6 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
|
|
||||||
// Google Map
|
// Google Map
|
||||||
GoogleMapController? _mapController;
|
GoogleMapController? _mapController;
|
||||||
MapType _mapType = MapType.normal;
|
|
||||||
bool _showMapControls = false;
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void initState() {
|
void initState() {
|
||||||
@@ -172,18 +171,6 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
'https://www.google.com/maps/dir/?api=1&destination=${_event!.latitude},${_event!.longitude}');
|
'https://www.google.com/maps/dir/?api=1&destination=${_event!.latitude},${_event!.longitude}');
|
||||||
}
|
}
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
|
||||||
// Map camera helpers
|
|
||||||
// ---------------------------------------------------------------------------
|
|
||||||
|
|
||||||
void _moveCamera(double latDelta, double lngDelta) {
|
|
||||||
_mapController?.animateCamera(CameraUpdate.scrollBy(lngDelta * 80, -latDelta * 80));
|
|
||||||
}
|
|
||||||
|
|
||||||
void _zoom(double amount) {
|
|
||||||
_mapController?.animateCamera(CameraUpdate.zoomBy(amount));
|
|
||||||
}
|
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// BUILD
|
// BUILD
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
@@ -953,7 +940,7 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// 5. VENUE LOCATION (Google Map)
|
// 5. VENUE LOCATION (Native Google Map on mobile, fallback on web)
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|
||||||
Widget _buildVenueSection(ThemeData theme) {
|
Widget _buildVenueSection(ThemeData theme) {
|
||||||
@@ -979,45 +966,26 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
ClipRRect(
|
ClipRRect(
|
||||||
borderRadius: BorderRadius.circular(20),
|
borderRadius: BorderRadius.circular(20),
|
||||||
child: SizedBox(
|
child: SizedBox(
|
||||||
height: 280,
|
height: 250,
|
||||||
|
width: double.infinity,
|
||||||
child: Stack(
|
child: Stack(
|
||||||
children: [
|
children: [
|
||||||
// Use static map image on web (Google Maps JS SDK not configured),
|
// Native Google Maps SDK on mobile, tappable fallback on web
|
||||||
// native GoogleMap widget on mobile
|
|
||||||
if (kIsWeb)
|
if (kIsWeb)
|
||||||
GestureDetector(
|
GestureDetector(
|
||||||
onTap: _viewLargerMap,
|
onTap: _viewLargerMap,
|
||||||
child: Container(
|
child: Container(
|
||||||
decoration: BoxDecoration(
|
color: const Color(0xFFE8EAF6),
|
||||||
color: Colors.grey.shade200,
|
child: Center(
|
||||||
borderRadius: BorderRadius.circular(20),
|
child: Column(
|
||||||
),
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
child: Stack(
|
children: [
|
||||||
children: [
|
Icon(Icons.map_outlined, size: 48, color: theme.colorScheme.primary),
|
||||||
Positioned.fill(
|
const SizedBox(height: 8),
|
||||||
child: CachedNetworkImage(
|
Text('Tap to view on Google Maps',
|
||||||
imageUrl: 'https://maps.googleapis.com/maps/api/staticmap?center=$lat,$lng&zoom=15&size=600x300&markers=color:red%7C$lat,$lng&key=',
|
style: TextStyle(color: theme.colorScheme.primary, fontWeight: FontWeight.w600)),
|
||||||
fit: BoxFit.cover,
|
],
|
||||||
errorWidget: (_, __, ___) => Container(
|
),
|
||||||
color: const Color(0xFFE8EAF6),
|
|
||||||
child: Column(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
|
||||||
children: [
|
|
||||||
Icon(Icons.map_outlined, size: 48, color: theme.colorScheme.primary),
|
|
||||||
const SizedBox(height: 8),
|
|
||||||
Text(
|
|
||||||
'Tap to view on Google Maps',
|
|
||||||
style: TextStyle(
|
|
||||||
color: theme.colorScheme.primary,
|
|
||||||
fontWeight: FontWeight.w600,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
@@ -1027,7 +995,6 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
target: LatLng(lat, lng),
|
target: LatLng(lat, lng),
|
||||||
zoom: 15,
|
zoom: 15,
|
||||||
),
|
),
|
||||||
mapType: _mapType,
|
|
||||||
markers: {
|
markers: {
|
||||||
Marker(
|
Marker(
|
||||||
markerId: const MarkerId('event'),
|
markerId: const MarkerId('event'),
|
||||||
@@ -1036,14 +1003,14 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
),
|
),
|
||||||
},
|
},
|
||||||
myLocationButtonEnabled: false,
|
myLocationButtonEnabled: false,
|
||||||
zoomControlsEnabled: false,
|
zoomControlsEnabled: true,
|
||||||
scrollGesturesEnabled: true,
|
scrollGesturesEnabled: true,
|
||||||
rotateGesturesEnabled: false,
|
rotateGesturesEnabled: false,
|
||||||
tiltGesturesEnabled: false,
|
tiltGesturesEnabled: false,
|
||||||
onMapCreated: (c) => _mapController = c,
|
onMapCreated: (c) => _mapController = c,
|
||||||
),
|
),
|
||||||
|
|
||||||
// "View larger map" – top left
|
// "View larger map" overlay button — top left
|
||||||
Positioned(
|
Positioned(
|
||||||
top: 10,
|
top: 10,
|
||||||
left: 10,
|
left: 10,
|
||||||
@@ -1055,112 +1022,23 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
borderRadius: BorderRadius.circular(8),
|
borderRadius: BorderRadius.circular(8),
|
||||||
boxShadow: [
|
boxShadow: [
|
||||||
BoxShadow(
|
BoxShadow(color: Colors.black.withValues(alpha: 0.12), blurRadius: 6),
|
||||||
color: Colors.black.withOpacity(0.12),
|
|
||||||
blurRadius: 6,
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
child: Text(
|
child: Row(
|
||||||
'View larger map',
|
mainAxisSize: MainAxisSize.min,
|
||||||
style: TextStyle(
|
children: [
|
||||||
color: theme.colorScheme.primary,
|
Icon(Icons.open_in_new, size: 14, color: theme.colorScheme.primary),
|
||||||
fontWeight: FontWeight.w600,
|
const SizedBox(width: 4),
|
||||||
fontSize: 13,
|
Text(
|
||||||
),
|
'View larger map',
|
||||||
|
style: TextStyle(color: theme.colorScheme.primary, fontWeight: FontWeight.w600, fontSize: 13),
|
||||||
|
),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|
||||||
// Map type toggle – bottom left (native only)
|
|
||||||
if (!kIsWeb)
|
|
||||||
Positioned(
|
|
||||||
bottom: 12,
|
|
||||||
left: 12,
|
|
||||||
child: _mapControlButton(
|
|
||||||
icon: _mapType == MapType.normal
|
|
||||||
? Icons.satellite_alt
|
|
||||||
: Icons.map_outlined,
|
|
||||||
onTap: () {
|
|
||||||
setState(() {
|
|
||||||
_mapType = _mapType == MapType.normal
|
|
||||||
? MapType.satellite
|
|
||||||
: MapType.normal;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
// Map controls toggle – bottom right (native only)
|
|
||||||
if (!kIsWeb)
|
|
||||||
Positioned(
|
|
||||||
bottom: 12,
|
|
||||||
right: 12,
|
|
||||||
child: _mapControlButton(
|
|
||||||
icon: Icons.open_with_rounded,
|
|
||||||
onTap: () => setState(() => _showMapControls = !_showMapControls),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
// Directional pad overlay (native only)
|
|
||||||
if (!kIsWeb && _showMapControls)
|
|
||||||
Positioned.fill(
|
|
||||||
child: Container(
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: Colors.black.withOpacity(0.25),
|
|
||||||
borderRadius: BorderRadius.circular(20),
|
|
||||||
),
|
|
||||||
child: Column(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
|
||||||
children: [
|
|
||||||
Row(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
|
||||||
children: [
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.keyboard_arrow_up,
|
|
||||||
onTap: () => _moveCamera(1, 0)),
|
|
||||||
const SizedBox(width: 16),
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.add,
|
|
||||||
onTap: () => _zoom(1)),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
const SizedBox(height: 10),
|
|
||||||
Row(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
|
||||||
children: [
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.keyboard_arrow_left,
|
|
||||||
onTap: () => _moveCamera(0, -1)),
|
|
||||||
const SizedBox(width: 60),
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.keyboard_arrow_right,
|
|
||||||
onTap: () => _moveCamera(0, 1)),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
const SizedBox(height: 10),
|
|
||||||
Row(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
|
||||||
children: [
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.keyboard_arrow_down,
|
|
||||||
onTap: () => _moveCamera(-1, 0)),
|
|
||||||
const SizedBox(width: 16),
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.remove,
|
|
||||||
onTap: () => _zoom(-1)),
|
|
||||||
const SizedBox(width: 16),
|
|
||||||
_mapControlButton(
|
|
||||||
icon: Icons.close,
|
|
||||||
onTap: () =>
|
|
||||||
setState(() => _showMapControls = false)),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@@ -1177,7 +1055,7 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
borderRadius: BorderRadius.circular(16),
|
borderRadius: BorderRadius.circular(16),
|
||||||
boxShadow: [
|
boxShadow: [
|
||||||
BoxShadow(
|
BoxShadow(
|
||||||
color: theme.shadowColor.withOpacity(0.06),
|
color: theme.shadowColor.withValues(alpha: 0.06),
|
||||||
blurRadius: 12,
|
blurRadius: 12,
|
||||||
offset: const Offset(0, 4),
|
offset: const Offset(0, 4),
|
||||||
),
|
),
|
||||||
@@ -1186,21 +1064,11 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
child: Column(
|
child: Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(venueLabel, style: theme.textTheme.titleMedium?.copyWith(fontWeight: FontWeight.bold)),
|
||||||
venueLabel,
|
|
||||||
style: theme.textTheme.titleMedium?.copyWith(
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (_event!.place != null && _event!.place != venueLabel)
|
if (_event!.place != null && _event!.place != venueLabel)
|
||||||
Padding(
|
Padding(
|
||||||
padding: const EdgeInsets.only(top: 4),
|
padding: const EdgeInsets.only(top: 4),
|
||||||
child: Text(
|
child: Text(_event!.place!, style: theme.textTheme.bodyMedium?.copyWith(color: theme.hintColor)),
|
||||||
_event!.place!,
|
|
||||||
style: theme.textTheme.bodyMedium?.copyWith(
|
|
||||||
color: theme.hintColor,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
@@ -1210,30 +1078,6 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
Widget _mapControlButton({
|
|
||||||
required IconData icon,
|
|
||||||
required VoidCallback onTap,
|
|
||||||
}) {
|
|
||||||
return GestureDetector(
|
|
||||||
onTap: onTap,
|
|
||||||
child: Container(
|
|
||||||
width: 44,
|
|
||||||
height: 44,
|
|
||||||
decoration: BoxDecoration(
|
|
||||||
color: Colors.white.withOpacity(0.92),
|
|
||||||
shape: BoxShape.circle,
|
|
||||||
boxShadow: [
|
|
||||||
BoxShadow(
|
|
||||||
color: Colors.black.withOpacity(0.15),
|
|
||||||
blurRadius: 6,
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
child: Icon(icon, color: Colors.grey.shade700, size: 22),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
// 6. GET DIRECTIONS BUTTON
|
// 6. GET DIRECTIONS BUTTON
|
||||||
// ---------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------
|
||||||
|
|||||||
Reference in New Issue
Block a user