Refactor/home page background

android/app/build.gradle.kts

@@ -33,7 +33,7 @@ android {
         applicationId = "com.exptech.dpip"
         minSdk = 26
         targetSdk = flutter.targetSdkVersion
-        versionCode = 300909001
+        versionCode = 300909009
         versionName = flutter.versionName
     }
 

android/app/src/main/kotlin/com/exptech/dpip/MainActivity.kt

@@ -4,12 +4,24 @@ import io.flutter.embedding.android.FlutterActivity
 import io.flutter.embedding.engine.FlutterEngine
 import io.flutter.plugin.common.EventChannel
 import io.flutter.plugin.common.MethodChannel
+import org.maplibre.android.MapLibre
 
 /**
  * Hosts the app's native platform channels. Each capability that replaces a
  * third-party plugin is registered here against the engine's binary messenger.
  */
 class MainActivity : FlutterActivity() {
+    override fun onCreate(savedInstanceState: android.os.Bundle?) {
+        // The maplibre_gl fork's HttpRequestImpl class-init calls
+        // MapLibre.getApplicationContext(), which throws unless MapLibre was
+        // initialized first — and it runs during automatic plugin registration
+        // (inside super.onCreate). Init before the engine attaches or startup
+        // dies with ExceptionInInitializerError and stalls on the splash.
+        // getInstance is idempotent; MapSnapshotChannel re-inits later.
+        MapLibre.getInstance(applicationContext)
+        super.onCreate(savedInstanceState)
+    }
+
     override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
         super.configureFlutterEngine(flutterEngine)
         val messenger = flutterEngine.dartExecutor.binaryMessenger

api.md

@@ -28,7 +28,6 @@
 | `openRtsSse` | `/api/v2/trem/rts?sse=1&compress=1` | `lbApi` | `api.lb-{tpe1,khh1}.exptech.dev` |
 | `getRtsRealtime` | `/api/v2/trem/rts` | `lbApi` | `api.lb-{tpe1,khh1}.exptech.dev` |
 | `getEewRealtime` | `/api/v2/eq/eew` | `lbApi` | `api.lb-{tpe1,khh1}.exptech.dev` |
-| `getLatestReports` | `/api/v1/eq/report` | `coreApi` | `api.core-{tyo1,tnn1}.exptech.dev` |
 | `getReportList` | `/api/v2/eq/report` | `coreApi` | `api.core-{tyo1,tnn1}.exptech.dev` |
 | `getReport` | `/api/v2/eq/report/{id}` | `coreApi` | `api.core-{tyo1,tnn1}.exptech.dev` |
 
@@ -63,14 +62,31 @@ max-age=300`）。`{sec}` 就是解出清單後的 10 位數秒，直接使用
 
 ### 衛星雲圖（v2）—— `core-tnn1`
 
-Himawari Band-13 IR XYZ WebP。時間清單是差量編碼的 Unix 秒（`[baseSec, Δ, …]`），
-在 API 主機上帶 ETag/304；tile 在 **static** 主機。`{sec}` 就是解出清單後的
-10 分鐘秒，直接使用。
+Himawari-9 AHI 的 XYZ WebP,預設是 Band-13 IR。時間清單是差量編碼的
+Unix 秒（`[baseSec, Δ, …]`）,在 API 主機上帶 ETag/304;tile 在 **static**
+主機。`{sec}` 就是解出清單後的 10 分鐘秒,直接使用。
+
+`?channel=` 選取渲染的頻道或產品 —— 單一頻道用數字（`13`）、命名產品用名稱
+（`btd_wvirw`、`cloudtop`…,即 `satellite-tiles-go/docs.md` 的產品目錄）。
+帶 channel 時時間清單為該 channel 的交集（產品需要的頻道缺一就不可渲染,
+`list` 只列齊全的時刻）。App 的圖層選擇器為每個 channel 註冊一個獨立圖層
+（`satellite` 保留給 B13,其餘為 `satellite-<channel>`）。
+
+| 方法 | 路徑 | 層級 | 主機 |
+|---|---|---|---|
+| `getFrames` | `/api/v2/tiles/satellite/list[?channel=…]` | `coreExclusiveApi` | `api.core-tnn1.exptech.dev` |
+| `tileUrl` | `/api/v2/tiles/satellite/{sec}/{z}/{x}/{y}.webp[?channel=…]` | `coreStaticExclusive` | `static.core-tnn1.exptech.dev` |
+
+### 未來1小時降水預報 QPESUMS（v2）—— `core-tnn1`
+
+QPESUMS 定量降水預報 XYZ WebP。時間清單是差量編碼的 Unix **毫秒**
+（`[baseMs, Δ, …]`）；tile 在 **static** 主機。`{ms}` 就是解出清單後的 13 位數
+毫秒，直接使用（時間軸解析已同時支援秒與毫秒）。
 
 | 方法 | 路徑 | 層級 | 主機 |
 |---|---|---|---|
-| `getFrames` | `/api/v2/tiles/satellite/list` | `coreExclusiveApi` | `api.core-tnn1.exptech.dev` |
-| `tileUrl` | `/api/v2/tiles/satellite/{sec}/{z}/{x}/{y}.webp` | `coreStaticExclusive` | `static.core-tnn1.exptech.dev` |
+| `getFrames` | `/api/v2/tiles/qpesums/list` | `coreExclusiveApi` | `api.core-tnn1.exptech.dev` |
+| `tileUrl` | `/api/v2/tiles/qpesums/{ms}/{z}/{x}/{y}.webp` | `coreStaticExclusive` | `static.core-tnn1.exptech.dev` |
 
 ### 防災地圖 DPM（v2）—— `core-tnn1`
 
@@ -172,6 +188,7 @@ typhoon）共用同一組形狀：`/api/v5/meteor/{family}` 是最新快照、`/
 |---|---|
 | `getLocalizationProgress` | `https://exptech.dev/api/v1/dpip/locale` |
 | `getReleases` | `https://api.github.com/repos/ExpTechTW/DPIP/releases`（ETag；`per_page=30`） |
+| `getRainHourForecast` | `https://exptech.dingbot.tw/api/weather/rainforecast/{code}`（`{code}` = 鄉鎮 3 碼；回應為單 series 信封 `{"<系列名>": [{"start": 秒, "rain": [60 × mm]}]}`；空 series `[]` = 該小時無雨，卡片隱藏） |
 
 ## curl 可用性（2026-08-02，HTTP 狀態碼）
 

dart_test.yaml

@@ -0,0 +1,4 @@
+# Development-only previews (they write PNGs); excluded from the default run.
+tags:
+  preview:
+    skip: "development preview — run with: flutter test --tags preview"

lib/app/app.dart

@@ -6,7 +6,6 @@ import 'package:dpip/core/geo/device_location_reporter.dart';
 import 'package:dpip/core/geo/location_monitor.dart';
 import 'package:dpip/core/geo/location_service.dart';
 import 'package:dpip/core/notifications/notification_service.dart';
-import 'package:dpip/core/notifications/notification_tap.dart';
 import 'package:dpip/core/notifications/notification_taps.dart';
 import 'package:dpip/core/platform/background_location.dart';
 import 'package:dpip/core/realtime/realtime_lifecycle.dart';
@@ -75,8 +74,8 @@ class DpipApp extends StatelessWidget {
 
 /// Owns app-level service wiring that needs a [State]/lifecycle:
 /// - the realtime spine's start/pause/resume (via [RealtimeLifecycleObserver]);
-/// - routing a tapped notification to the right tab (the channel-key → route
-///   mapping lives here because this layer owns the router);
+/// - registering the notification tap → route handler ([routeNotificationTap],
+///   whose channel→screen table lives in `notification_routes.dart`);
 /// - requesting notification permission once, after the first frame;
 /// - resolving the current GPS township into the [RegionStore] so 所在地 shows
 ///   the real location (and the "can't get location" state when GPS is off).
@@ -117,7 +116,7 @@ class _AppServicesHostState extends State<_AppServicesHost>
     super.initState();
     _observer = RealtimeLifecycleObserver(widget.realtimeService);
     WidgetsBinding.instance.addObserver(this);
-    NotificationTaps.onTap = _routeNotificationTap;
+    NotificationTaps.onTap = routeNotificationTap;
     widget.onboarding.addListener(_onOnboardingChanged);
     WidgetsBinding.instance.addPostFrameCallback((_) {
       widget.realtimeService.startAll();
@@ -188,13 +187,6 @@ class _AppServicesHostState extends State<_AppServicesHost>
     super.dispose();
   }
 
-  /// Sends a tapped notification to a screen. The destination is resolved by the
-  /// declarative channel→route table; the tap's [NotificationTap.id] is carried
-  /// for the per-item detail routes to come.
-  void _routeNotificationTap(NotificationTap tap) {
-    appRouter.goNamed(routeForNotificationChannel(tap.channelKey));
-  }
-
   @override
   Widget build(BuildContext context) => widget.child;
 }

lib/app/router/notification_routes.dart

@@ -1,7 +1,36 @@
+import 'package:dpip/app/router/app_router.dart';
 import 'package:dpip/core/logging/log.dart';
 import 'package:dpip/core/notifications/notification_channels.dart';
+import 'package:dpip/core/notifications/notification_tap.dart';
 import 'package:dpip/shared/navigation/app_routes.dart';
 
+/// The slice of the router a notification tap needs — [GoRouter.goNamed].
+typedef NotificationRouteNavigator =
+    void Function(
+      String name, {
+      Map<String, String> pathParameters,
+      Map<String, dynamic> queryParameters,
+      String? fragment,
+      Object? extra,
+    });
+
+/// Single owner of notification → destination, mirroring the legacy
+/// `notify.dart` tap table in one file: [NotificationTaps] carries the tap
+/// intent and calls [routeNotificationTap] once the router is live (replaying a
+/// cold-start tap through [NotificationTaps.drainPending]). The channel
+/// resolves to a route name via the declarative group table below, then the
+/// router navigates — no widget hosts this logic, so adding an alert family is
+/// one row in the table and nothing else.
+///
+/// [navigate] is injectable for tests; it defaults to the app router's
+/// [GoRouter.goNamed].
+void routeNotificationTap(
+  NotificationTap tap, {
+  NotificationRouteNavigator? navigate,
+}) {
+  (navigate ?? appRouter.goNamed)(routeForNotificationChannel(tap.channelKey));
+}
+
 /// Resolves a tapped notification's channel to a destination route.
 ///
 /// Declarative and group-driven (via [NotificationChannels.groupOf]) instead of

lib/app/theme/app_glass.dart

@@ -1,3 +1,4 @@
+import 'package:dpip/core/realtime/app_time.dart';
 import 'package:dpip/core/settings/weather_mode.dart';
 import 'package:flutter/material.dart';
 
@@ -10,30 +11,117 @@ import 'package:flutter/material.dart';
 /// — because dark-theme [ColorScheme.onSurface] is white and vanishes on clear
 /// daylight.
 
+/// The card fill the reference paints once the weather is showing: **the sky's own
+/// colour at 20 % alpha**, with only its HSL lightness moved.
+///
+/// The reference's `D()` converts the sky-gradient colour to HSL, shifts `L`
+/// alone — −0.30 in the morning bucket, −0.40 around midday, +0.20 otherwise —
+/// converts back, and returns `Color.argb(51, …)`. Hue and saturation are never
+/// touched, which is why the card reads as a pane of the sky rather than a grey
+/// plate laid over it, and 51/255 = 0.20 is a literal in that method rather
+/// than anything device- or theme-dependent.
+///
+/// [hour] is the local hour that picks the bucket (the reference
+/// buckets 4–9 / 10–14 / rest); it is a parameter so this stays pure.
+Color skyCardTint(Color sky, {required int hour}) {
+  final shift = hour >= 4 && hour <= 9
+      ? -0.30
+      : hour >= 10 && hour <= 14
+      ? -0.40
+      : 0.20;
+  final hsl = HSLColor.fromColor(sky);
+  return hsl
+      .withLightness((hsl.lightness + shift).clamp(0.0, 1.0))
+      .toColor()
+      .withValues(alpha: glassRevealedAlpha);
+}
+
+/// The reference's card alpha once the weather backdrop is showing (`Color.argb(51,…)`).
+///
+/// It is this low on purpose: the falling rain has to be visible *through* the
+/// card. A card opaque enough to hide it stops the rain dead at its edge, which
+/// is the single thing that most gives a port away.
+const double glassRevealedAlpha = 0.20;
+
 /// The translucent card/surface tint: resting
-/// [ColorScheme.surfaceContainerHighest] → near-opaque theme surface as
+/// [ColorScheme.surfaceContainerHighest] → the reference's sky-tinted 20 % fill as
 /// [reveal] rises.
-Color glassSurface(ColorScheme colors, double reveal) => Color.lerp(
+///
+/// Without a [sky] colour (no backdrop running, or before the first LUT bake)
+/// it falls back to a near-opaque theme surface, because 20 % of nothing is an
+/// unreadable card.
+Color glassSurface(
+  ColorScheme colors,
+  double reveal, {
+  Color? sky,
+  int? hour,
+}) => Color.lerp(
   colors.surfaceContainerHighest.withValues(alpha: 0.55),
-  colors.surface.withValues(alpha: 0.92),
+  sky == null
+      ? colors.surface.withValues(alpha: 0.92)
+      : skyCardTint(sky, hour: hour ?? AppTime.utc8.hour),
   reveal,
 )!;
 
-/// Ink for content **inside** a [glassSurface] card — always the theme
-/// on-surface roles. Cards carry their own plate; do not wash these toward
-/// white or black for the sky.
-Color glassOnSurface(ColorScheme colors) => colors.onSurface;
+/// Ink for content **inside** a [glassSurface] card.
+///
+/// At rest the card is its own plate and the theme's on-surface roles are
+/// right. Once [reveal] dissolves it to the 20 % fill above, the card is no
+/// longer a plate — it is a pane of the sky — so its ink has to follow the sky
+/// exactly the way [inkOverWeather] does. Leaving it on [ColorScheme.onSurface]
+/// puts near-black text on a rain sky in a light theme.
+Color glassOnSurface(
+  ColorScheme colors, {
+  double reveal = 0,
+  bool skyIsLight = false,
+}) => inkOverWeather(colors, reveal, skyIsLight: skyIsLight);
 
 /// Secondary ink for content inside a [glassSurface] card.
-Color glassOnSurfaceVariant(ColorScheme colors) => colors.onSurfaceVariant;
+Color glassOnSurfaceVariant(
+  ColorScheme colors, {
+  double reveal = 0,
+  bool skyIsLight = false,
+}) => inkOverWeatherVariant(colors, reveal, skyIsLight: skyIsLight);
 
 /// Whether [mode]'s sky is light enough that dark foregrounds read better than
 /// white once the weather backdrop is showing.
+///
+/// A **fallback only**, for the brief window before the sky has actually
+/// baked (`SkyLutCache.panelAmbient` is still null): the table only knows the
+/// weather *type*, not the time of day, so `clear`/`cloudy`/`snow`/`fog`/`auto`
+/// all resolve to "light" even at night — a clear night sky is the darkest
+/// thing on screen, and this alone would pick near-black ink for it. Once a
+/// sky colour exists, [skyIsLightFrom] must be used instead.
 bool weatherSkyIsLight(WeatherMode mode) => switch (mode) {
-  WeatherMode.rain || WeatherMode.thunderstorm => false,
-  WeatherMode.clear || WeatherMode.fog || WeatherMode.auto => true,
+  WeatherMode.rain ||
+  WeatherMode.thunderstorm ||
+  WeatherMode.overcast ||
+  WeatherMode.sand => false,
+  WeatherMode.clear ||
+  WeatherMode.cloudy ||
+  WeatherMode.snow ||
+  WeatherMode.fog ||
+  WeatherMode.auto => true,
 };
 
+/// Whether [sky] — the actual rendered sky colour (`SkyLutCache.panelAmbient`)
+/// — is light enough that dark foregrounds read better than white.
+///
+/// This is what every ink-on-sky decision should call: [weatherSkyIsLight]
+/// alone can only guess from the weather *type*, and the same "clear" sky is
+/// bright blue at noon and near-black past sunset. Falls back to
+/// [weatherSkyIsLight] only while [sky] is still null (nothing has baked yet),
+/// so ink is never left unset before the first frame.
+///
+/// Uses [ThemeData.estimateBrightnessForColor] rather than a hand-picked
+/// luminance cutoff — it is the same "is this background light or dark"
+/// judgment Flutter already ships and tunes, so a border-hue sky (dawn, a
+/// hazy overcast) resolves the way the rest of the framework would resolve it.
+bool skyIsLightFrom(Color? sky, WeatherMode fallbackMode) {
+  if (sky == null) return weatherSkyIsLight(fallbackMode);
+  return ThemeData.estimateBrightnessForColor(sky) == Brightness.light;
+}
+
 /// Ink for content drawn **on** the weather sky (header, region badges).
 ///
 /// As [reveal] rises, shifts toward dark ink on a light sky (critical in dark

lib/bootstrap.dart

@@ -26,6 +26,7 @@ import 'package:dpip/core/geo/town_boundaries.dart';
 import 'package:dpip/core/geo/town_directory.dart';
 import 'package:dpip/core/settings/experimental_settings.dart';
 import 'package:dpip/core/settings/locale_controller.dart';
+import 'package:dpip/core/settings/map_layer_order_controller.dart';
 import 'package:dpip/core/settings/onboarding_store.dart';
 import 'package:dpip/core/settings/prefs.dart';
 import 'package:dpip/core/settings/region_store.dart';
@@ -85,6 +86,7 @@ Future<void> bootstrap() async {
   final locale = LocaleController(prefs);
   final theme = ThemeController(prefs);
   final defaultMapLayer = DefaultMapLayerController(prefs);
+  final mapLayerOrder = MapLayerOrderController(prefs);
   final cache = await _openCache();
   // MapLibre asks Dart for every ExpTech tile before it asks the network, so
   // this must be bound before the first map is built.
@@ -184,6 +186,7 @@ Future<void> bootstrap() async {
     locale: locale,
     theme: theme,
     defaultMapLayer: defaultMapLayer,
+    mapLayerOrder: mapLayerOrder,
     etagCache: cache?.etag,
     networkUsage: cache?.usage,
     mapTileCache: mapTileCache,

lib/core/di/core_providers.dart

@@ -12,6 +12,7 @@ import 'package:dpip/core/realtime/realtime_service.dart';
 import 'package:dpip/core/settings/default_map_layer_controller.dart';
 import 'package:dpip/core/settings/experimental_settings.dart';
 import 'package:dpip/core/settings/locale_controller.dart';
+import 'package:dpip/core/settings/map_layer_order_controller.dart';
 import 'package:dpip/core/settings/onboarding_store.dart';
 import 'package:dpip/core/settings/region_store.dart';
 import 'package:dpip/core/settings/theme_controller.dart';
@@ -33,6 +34,9 @@ List<SingleChildWidget> coreProviders(SharedDeps deps) => [
   ChangeNotifierProvider<DefaultMapLayerController>.value(
     value: deps.defaultMapLayer,
   ),
+  ChangeNotifierProvider<MapLayerOrderController>.value(
+    value: deps.mapLayerOrder,
+  ),
   Provider<TownDirectory>.value(value: deps.townDirectory),
   Provider<Future<TownBoundaries>>.value(value: deps.townBoundaries),
   Provider<LocationService>.value(value: deps.locationService),

lib/core/di/shared_deps.dart

@@ -14,6 +14,7 @@ import 'package:dpip/core/realtime/server_clock.dart';
 import 'package:dpip/core/settings/default_map_layer_controller.dart';
 import 'package:dpip/core/settings/experimental_settings.dart';
 import 'package:dpip/core/settings/locale_controller.dart';
+import 'package:dpip/core/settings/map_layer_order_controller.dart';
 import 'package:dpip/core/settings/onboarding_store.dart';
 import 'package:dpip/core/settings/prefs.dart';
 import 'package:dpip/core/settings/region_store.dart';
@@ -48,6 +49,7 @@ class SharedDeps {
     required this.locale,
     required this.theme,
     required this.defaultMapLayer,
+    required this.mapLayerOrder,
     this.etagCache,
     this.networkUsage,
     this.mapTileCache,
@@ -113,6 +115,9 @@ class SharedDeps {
   /// Default Map-tab overlay (also provided; drives nav chrome + map open).
   final DefaultMapLayerController defaultMapLayer;
 
+  /// User-customised map layer-picker order (also provided).
+  final MapLayerOrderController mapLayerOrder;
+
   /// On-disk ETag HTTP cache (also provided) — null if the cache DB couldn't be
   /// opened. Exposed for the Debug page's cache stats.
   final EtagCacheStore? etagCache;

lib/core/format.dart

@@ -0,0 +1,10 @@
+/// Number-to-text helpers shared across display sites.
+library;
+
+/// Formats [value] to [digits] decimals, dropping a trailing `.0` — e.g. a
+/// latitude `25.0` reads as `25`, matching what the chart / fact rows did by
+/// hand in the typhoon panel and the station trend axis.
+String trimTrailingZero(double value, {int digits = 1}) {
+  final s = value.toStringAsFixed(digits);
+  return s.endsWith('.0') ? s.substring(0, s.length - 2) : s;
+}

lib/core/geo/geo_math.dart

@@ -0,0 +1,8 @@
+/// Angular + distance helpers shared by geo code and map layers.
+library;
+
+import 'dart:math' as math;
+
+/// Degrees → radians — the conversion used whenever a latitude / longitude /
+/// heading is fed to a trig function.
+double degToRad(double degrees) => degrees * math.pi / 180.0;