feat: flame_water and flame_lighting for the wet world

examples/lib/main.dart

@@ -38,9 +38,10 @@ import 'package:examples/stories/svg/svg.dart';
 import 'package:examples/stories/system/system.dart';
 import 'package:examples/stories/tiled/tiled.dart';
 import 'package:examples/stories/utils/utils.dart';
+import 'package:examples/stories/wet_world/wet_world.dart';
 import 'package:examples/stories/widgets/widgets.dart';
 import 'package:flame/game.dart';
-import 'package:flutter/material.dart';
+import 'package:material_ui/material_ui.dart';
 
 void main() {
   final page = PageProviderImpl().getPage();
@@ -69,9 +70,11 @@ void main() {
 void runAsDashbook() {
   final dashbook = Dashbook(
     title: 'Flame Examples',
-    theme: ThemeData.dark(),
   );
 
+  // The SERDUN fork's own samples: water that mirrors the world.
+  addWetWorldStories(dashbook);
+
   // Some small sample games
   addGameStories(dashbook);
 

examples/lib/stories/wet_world/mirror_puddle_example.dart

@@ -0,0 +1,46 @@
+import 'package:examples/stories/wet_world/street.dart';
+import 'package:flame/components.dart';
+import 'package:flame/game.dart';
+import 'package:flame_water/flame_water.dart';
+
+class MirrorPuddleExample extends FlameGame {
+  MirrorPuddleExample({
+    this.reflectivity = 0.75,
+    this.squash = 1,
+    this.fade = 0.7,
+    this.wetRoadOn = true,
+  }) : super(
+         camera: CameraComponent.withFixedResolution(width: 800, height: 450),
+       );
+
+  static const String description = '''
+    A puddle mirrors the street above it: the sky, the houses, the lamps and
+    the walker, clipped to its shape, squeezed as water seen at a low angle
+    and faded with depth. The road itself is a thin film of water with a
+    faint mirror of its own. Nothing is rendered off screen: each reflected
+    component is drawn a second time, upside down.
+  ''';
+
+  final double reflectivity;
+  final double squash;
+  final double fade;
+  final bool wetRoadOn;
+
+  @override
+  Future<void> onLoad() async {
+    await WaterShader.load();
+    camera.viewfinder.anchor = Anchor.topLeft;
+    await world.addAll([
+      ...street(),
+      if (wetRoadOn) wetRoad(),
+      puddle(
+        left: 260,
+        width: 320,
+        reflectivity: reflectivity,
+        fade: fade,
+      )..squash = squash,
+      puddle(left: 500, width: 130, top: 398, height: 44),
+      Rain(),
+    ]);
+  }
+}

examples/lib/stories/wet_world/rainy_night_example.dart

@@ -0,0 +1,82 @@
+import 'package:examples/stories/wet_world/street.dart';
+import 'package:flame/components.dart';
+import 'package:flame/game.dart';
+import 'package:flame_lighting/flame_lighting.dart';
+import 'package:flame_water/flame_water.dart';
+
+class RainyNightExample extends FlameGame {
+  RainyNightExample({
+    this.darkness = 0.7,
+    this.glow = 0.35,
+    this.haze = 0.5,
+    this.rain = 1,
+    this.drying = 1,
+    this.wetness = 1,
+  }) : super(
+         camera: CameraComponent.withFixedResolution(width: 800, height: 450),
+       );
+
+  static const String description = '''
+    A street at night in the rain, made only of elements - the road, its
+    film of water, puddles, houses, lamps, a walker with a torch, the rain,
+    the night. Everything that happens between them is their own: the rain
+    falls on whatever catches it, the water ripples and bends what it
+    mirrors, the houses get wet and glint, the lights cut the night, lay
+    pools on the road and show in the water. Stop the rain and the street
+    dries as fast as the weather dries it: the walls first, then the
+    asphalt, the puddles last.
+  ''';
+
+  final double darkness;
+  final double glow;
+  final double haze;
+  final double rain;
+  final double drying;
+
+  /// How wet the street is when the scene opens, from dry to soaked; from
+  /// then on the rain and the drying move it.
+  final double wetness;
+
+  Lighting? _lighting;
+  Rain? _rain;
+
+  /// Changes the weather on the running street, keeping how wet it has got.
+  void setWeather({
+    required double darkness,
+    required double glow,
+    required double haze,
+    required double rain,
+    required double drying,
+  }) {
+    _lighting
+      ?..darkness = darkness
+      ..glow = glow
+      ..haze = haze;
+    _rain
+      ?..intensity = rain
+      ..drying = drying;
+  }
+
+  /// Makes everything that gets wet [wetness] wet now.
+  void setWetness(double wetness) {
+    for (final wet in world.descendants().whereType<Wettable>()) {
+      wet.wetness = wetness;
+    }
+  }
+
+  @override
+  Future<void> onLoad() async {
+    await WaterShader.load();
+    await LightingShader.load();
+    camera.viewfinder.anchor = Anchor.topLeft;
+    await world.addAll([
+      ...street(lit: true),
+      wetRoad(),
+      puddle(left: 260, width: 320),
+      puddle(left: 500, width: 130, top: 398, height: 44),
+      _lighting = Lighting(darkness: darkness, glow: glow, haze: haze),
+      _rain = Rain(intensity: rain, drying: drying),
+    ]);
+    setWetness(wetness);
+  }
+}

examples/lib/stories/wet_world/ripples_example.dart

@@ -0,0 +1,48 @@
+import 'package:examples/stories/wet_world/street.dart';
+import 'package:flame/components.dart';
+import 'package:flame/events.dart';
+import 'package:flame/game.dart';
+import 'package:flame_water/flame_water.dart';
+
+class RipplesExample extends FlameGame with TapCallbacks {
+  RipplesExample({this.rain = 1})
+    : super(
+        camera: CameraComponent.withFixedResolution(width: 800, height: 450),
+      );
+
+  static const String description = '''
+    Rain on the street by day: every drop lands on whatever catches it - a
+    ring in a puddle, a small quick one in the film on the road, a splash on
+    a roof - and the ring bends the reflection around it, through the water
+    shader. Tap a puddle to splash it yourself.
+  ''';
+
+  final double rain;
+  final List<WaterSurface> _puddles = [];
+
+  @override
+  Future<void> onLoad() async {
+    await WaterShader.load();
+    camera.viewfinder.anchor = Anchor.topLeft;
+    _puddles.addAll([
+      puddle(left: 260, width: 320),
+      puddle(left: 500, width: 130, top: 398, height: 44),
+    ]);
+    await world.addAll([
+      ...street(),
+      wetRoad(),
+      ..._puddles,
+      Rain(intensity: rain),
+    ]);
+  }
+
+  @override
+  void onTapDown(TapDownEvent event) {
+    final at = camera.globalToLocal(event.canvasPosition);
+    for (final puddle in _puddles) {
+      if (puddle.covers(at)) {
+        puddle.splash(at);
+      }
+    }
+  }
+}