Vishal Tyagi
← Projects
Open Source·shipped

Floor Plan Builder — Flutter Package

Flutter package for rendering interactive restaurant/venue floor plans from a JSON table list — shapes, availability colors, pinch-to-zoom, and onTableTap callbacks.

Date2024-07
Reading TimeN/A
Statusshipped
StackFlutter, Dart, SVG+1

What it does

floor_plan_builder takes a JSON list of tables (shape, position, availability) and renders an interactive floor-plan widget: SVG table shapes tinted by status, InteractiveViewer pinch/pan, and onTableTap(TableModel) for the parent app to handle.

Why it exists

A restaurant seating screen needed a visual layout. An events app needed the same idea for venues. Extracting a package avoided copying the widget between apps.

Pairs with image_hotspot — extracted from the same codebase at the same time. Hotspot handles tap regions on an image; this package handles rendered table layouts from JSON.

Decisions & tradeoffs

  • SVG shapes make availability tinting trivial without duplicate assets per color.
  • Pre-cache tinted SVGs at init — smooth zoom/pan for ~30 tables; very large venues may need lazy loading later.
  • Widget-owned TransformationController — simple parent API (tables + callback); no external viewport reset in v0.0.1.

What it demonstrates

  • Flutter package authorship with example app and tests
  • Composable widgets: parent owns data/events; package owns layout/interaction
  • Extracting reusable surfaces while the parent app is still shipping