human_body_map_selector 1.0.1

A Flutter widget for picking anatomical regions on a front/back human body diagram - tap a region to drop a pin and get back its region id.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:human_body_map_selector/human_body_map_selector.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Human Body Map Selector',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.teal),
      ),
      home: const BodyMapDemoPage(),
      debugShowCheckedModeBanner: false,
    );
  }
}

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

  @override
  State<BodyMapDemoPage> createState() => _BodyMapDemoPageState();
}

class _BodyMapDemoPageState extends State<BodyMapDemoPage> {
  List<BodyMapSelection> _selections = const [];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Human Body Map Selector')),
      body: SafeArea(
        child: SingleChildScrollView(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const Text(
                'Tap a body part to select it. Tap it again to deselect.',
              ),
              const SizedBox(height: 16),
              Center(
                child: ConstrainedBox(
                  constraints: const BoxConstraints(maxWidth: 320),
                  child: HumanBodyMapSelector(
                    maxWidth: 260,
                    onSelectionChanged: (selections) =>
                        setState(() => _selections = selections),
                  ),
                ),
              ),
              const SizedBox(height: 24),
              Text(
                'Selected regions',
                style: Theme.of(context).textTheme.titleMedium,
              ),
              const SizedBox(height: 8),
              if (_selections.isEmpty)
                const Text('None yet.')
              else
                for (final selection in _selections)
                  Text(
                    '${defaultBodyRegionsById[selection.regionId]?.label ?? selection.regionId} (${selection.view.label})',
                  ),
            ],
          ),
        ),
      ),
    );
  }
}