flutter_widget_to_marker_one 0.0.5 copy "flutter_widget_to_marker_one: ^0.0.5" to clipboard
flutter_widget_to_marker_one: ^0.0.5 copied to clipboard

A Flutter package that converts Flutter widgets into Google Maps markers, allowing for custom, dynamic marker designs using standard Flutter widgets.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter_widget_to_marker_one/flutter_widget_to_marker_one.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Widget to Marker Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MapScreen(),
    );
  }
}

class MapScreen extends StatefulWidget {
  const MapScreen({super.key});

  @override
  State<MapScreen> createState() => _MapScreenState();
}

class _MapScreenState extends State<MapScreen> {
  late GoogleMapController mapController;
  Set<Marker> markers = {};

  // Example location (San Francisco)
  static const LatLng _center = LatLng(37.7749, -122.4194);

  void _onMapCreated(GoogleMapController controller) {
    mapController = controller;
    _addCustomMarker();
  }

  Future<void> _addCustomMarker() async {
    // Create a custom marker using a simple widget
    final marker = await convertWidgetToMarker(
      markerId: 'custom_marker',
      position: _center,
      widget: Container(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(16),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.2),
              blurRadius: 6,
              offset: const Offset(0, 3),
            ),
          ],
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Icon(Icons.location_pin, color: Colors.blue.shade700),
            const SizedBox(width: 8),
            const Text(
              'Custom Marker',
              style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 16,
              ),
            ),
          ],
        ),
      ),
      context: context,
      size: const Size(200, 50),
    );

    setState(() {
      markers.add(marker);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Widget to Marker Example'),
      ),
      body: GoogleMap(
        onMapCreated: _onMapCreated,
        initialCameraPosition: const CameraPosition(
          target: _center,
          zoom: 15,
        ),
        markers: markers,
      ),
    );
  }
}
1
likes
115
points
52
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter package that converts Flutter widgets into Google Maps markers, allowing for custom, dynamic marker designs using standard Flutter widgets.

Documentation

API reference

License

MIT (license)

Dependencies

flutter, google_maps_flutter

More

Packages that depend on flutter_widget_to_marker_one