Merge branch 'flet-dev:main' into add-pep561-pytyped

Author: nimaxin

CHANGELOG.md

@@ -13,6 +13,7 @@
   * Controls in Python are now defined as plain dataclasses
   * Unified diffing algorithm supports both imperative and declarative styles
   * Refactored Flutter layer using inherited widgets and `Provider`
+* Added a Shimmer control for building skeleton loaders and animated placeholders.
 * Added `FletApp.appErrorMessage` template to customize loading screen errors.
 * See the list of [breaking changes](https://github.com/flet-dev/flet/issues/5238)
 

client/pubspec.lock

@@ -1206,6 +1206,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.4.1"
+  shimmer:
+    dependency: transitive
+    description:
+      name: shimmer
+      sha256: "5f88c883a22e9f9f299e5ba0e4f7e6054857224976a5d9f839d4ebdc94a14ac9"
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.0.0"
   sky_engine:
     dependency: transitive
     description: flutter

packages/flet/lib/src/controls/container.dart

@@ -50,7 +50,7 @@ class ContainerControl extends StatelessWidget with FletStoreMixin {
     Widget? container;
 
     var onAnimationEnd = control.getBool("on_animation_end", false)!
-        ? () => control.triggerEvent("animation_end" "container")
+        ? () => control.triggerEvent("animation_end", "container")
         : null;
     if ((onClick || url != null || onLongPress || onHover || onTapDown) &&
         ink &&

packages/flet/lib/src/controls/dropdown.dart

@@ -280,6 +280,7 @@ class _DropdownControlState extends State<DropdownControl> {
       helperText: widget.control.getString("helper_text"),
       menuStyle: menuStyle,
       inputDecorationTheme: inputDecorationTheme,
+      inputFormatters: inputFormatters.isEmpty ? null : inputFormatters,
       onSelected: widget.control.disabled
           ? null
           : (String? selection) {
@@ -291,7 +292,6 @@ class _DropdownControlState extends State<DropdownControl> {
     );
 
     var didAutoFocus = false;
-
     if (!didAutoFocus && autofocus) {
       didAutoFocus = true;
       SchedulerBinding.instance.addPostFrameCallback((_) {

packages/flet/lib/src/controls/page.dart

@@ -20,6 +20,7 @@ import '../models/page_design.dart';
 import '../routing/route_parser.dart';
 import '../routing/route_state.dart';
 import '../routing/router_delegate.dart';
+import '../services/service_binding.dart';
 import '../services/service_registry.dart';
 import '../utils/device_info.dart';
 import '../utils/locale.dart';
@@ -57,6 +58,9 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
   late final AppLifecycleListener _appLifecycleListener;
   ServiceRegistry? _pageServices;
   ServiceRegistry? _userServices;
+  String? _userServicesUid;
+  ServiceBinding? _windowService;
+  Control? _windowControl;
   bool? _prevOnKeyboardEvent;
   bool _keyboardHandlerSubscribed = false;
   String? _prevViewRoutes;
@@ -95,12 +99,15 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
 
     _attachKeyboardListenerIfNeeded();
     widget.control.addInvokeMethodListener(_invokeMethod);
+    widget.control.addListener(_onPageControlChanged);
+    _ensureServiceRegistries();
   }
 
   @override
   void didChangeDependencies() {
     debugPrint("Page.didChangeDependencies: ${widget.control.id}");
     super.didChangeDependencies();
+    _ensureServiceRegistries();
     _loadFontsIfNeeded(FletBackend.of(context));
   }
 
@@ -109,26 +116,7 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
     debugPrint("Page.didUpdateWidget: ${widget.control.id}");
     super.didUpdateWidget(oldWidget);
     _updateMultiViews();
-
-    // page services
-    _pageServices ??= ServiceRegistry(
-        control: widget.control,
-        propertyName: "_services",
-        backend: FletBackend.of(context));
-
-    // user services
-    var userServicesControl = widget.control.child("_user_services");
-    if (userServicesControl != null) {
-      if (_userServices == null ||
-          _userServices?.control.internals?["uid"] !=
-              userServicesControl.internals?["uid"]) {
-        _userServices = ServiceRegistry(
-            control: userServicesControl,
-            propertyName: "_services",
-            backend: FletBackend.of(context));
-      }
-    }
-
+    _ensureServiceRegistries();
     _attachKeyboardListenerIfNeeded();
     _loadFontsIfNeeded(FletBackend.of(context));
   }
@@ -148,9 +136,60 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
       HardwareKeyboard.instance.removeHandler(_handleKeyDown);
     }
     widget.control.removeInvokeMethodListener(_invokeMethod);
+    widget.control.removeListener(_onPageControlChanged);
+    _pageServices?.dispose();
+    _userServices?.dispose();
+    _windowService?.dispose();
     super.dispose();
   }
 
+  void _onPageControlChanged() {
+    _ensureServiceRegistries();
+  }
+
+  void _ensureServiceRegistries() {
+    if (!mounted) {
+      return;
+    }
+    var backend = FletBackend.of(context);
+
+    _pageServices ??= ServiceRegistry(
+        control: widget.control,
+        propertyName: "_services",
+        backend: backend);
+
+    var userServicesControl = widget.control.child("_user_services");
+    if (userServicesControl != null) {
+      var uid = userServicesControl.internals?["uid"];
+      if (_userServices == null || _userServicesUid != uid) {
+        _userServices?.dispose();
+        _userServices = ServiceRegistry(
+            control: userServicesControl,
+            propertyName: "_services",
+            backend: backend);
+        _userServicesUid = uid;
+      }
+    } else if (_userServices != null) {
+      _userServices?.dispose();
+      _userServices = null;
+      _userServicesUid = null;
+    }
+
+    var windowControl = widget.control.child("window", visibleOnly: false);
+    if (windowControl != null) {
+      if (!identical(windowControl, _windowControl)) {
+        _windowService?.dispose();
+        _windowService =
+            ServiceBinding(control: windowControl, backend: backend);
+        _windowControl = windowControl;
+      }
+    } else if (_windowService != null) {
+      _windowService?.dispose();
+      _windowService = null;
+      _windowControl = null;
+    }
+  }
+
   Future<dynamic> _invokeMethod(String name, dynamic args) async {
     debugPrint("Page.$name($args)");
 
@@ -341,8 +380,7 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
       var appStatus = context
           .select<FletBackend, ({bool isLoading, String error})>((backend) =>
               (isLoading: backend.isLoading, error: backend.error));
-      var appStartupScreenMessage =
-          backend.appStartupScreenMessage ?? "";
+      var appStartupScreenMessage = backend.appStartupScreenMessage ?? "";
       var formattedErrorMessage =
           backend.formatAppErrorMessage(appStatus.error);
 
@@ -432,6 +470,18 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
             ? control.getCupertinoTheme("dark_theme", context, Brightness.dark)
             : control.getCupertinoTheme("theme", context, Brightness.dark);
 
+    var materialTheme = themeMode == ThemeMode.dark ||
+            ((themeMode == null || themeMode == ThemeMode.system) &&
+                brightness == Brightness.dark)
+        ? darkTheme
+        : lightTheme;
+
+    Widget scaffoldMessengerBuilder(BuildContext context, Widget? child) {
+      return Theme(
+          data: materialTheme ?? lightTheme ?? ThemeData(),
+          child: ScaffoldMessenger(child: child ?? const SizedBox.shrink()));
+    }
+
     var showSemanticsDebugger =
         control.getBool("show_semantics_debugger", false)!;
 
@@ -442,6 +492,7 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
                 showSemanticsDebugger: showSemanticsDebugger,
                 title: windowTitle,
                 theme: cupertinoTheme,
+                builder: scaffoldMessengerBuilder,
                 supportedLocales: localeConfiguration.supportedLocales,
                 locale: localeConfiguration.locale,
                 localizationsDelegates: localizationsDelegates,
@@ -454,6 +505,7 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
                 routeInformationParser: _routeParser,
                 title: windowTitle,
                 theme: cupertinoTheme,
+                builder: scaffoldMessengerBuilder,
                 localizationsDelegates: localizationsDelegates,
                 supportedLocales: localeConfiguration.supportedLocales,
                 locale: localeConfiguration.locale,
@@ -503,14 +555,12 @@ class _PageControlState extends State<PageControl> with WidgetsBindingObserver {
 
     var backend = FletBackend.of(context);
     var showAppStartupScreen = backend.showAppStartupScreen ?? false;
-    var appStartupScreenMessage =
-        backend.appStartupScreenMessage ?? "";
+    var appStartupScreenMessage = backend.appStartupScreenMessage ?? "";
 
     var appStatus =
         context.select<FletBackend, ({bool isLoading, String error})>(
             (backend) => (isLoading: backend.isLoading, error: backend.error));
-    var formattedErrorMessage =
-        backend.formatAppErrorMessage(appStatus.error);
+    var formattedErrorMessage = backend.formatAppErrorMessage(appStatus.error);
 
     var views = widget.control.children("views");
     List<Page<dynamic>> pages = [];

packages/flet/lib/src/controls/semantics.dart

@@ -31,7 +31,7 @@ class SemanticsControl extends StatelessWidget {
       hint: control.getString("hint"),
       onTapHint: control.getString("on_tap_hint"),
       onLongPressHint: control.getString("on_long_press_hint"),
-      container: control.getBool("container")!,
+      container: control.getBool("container", false)!,
       liveRegion: control.getBool("live_region"),
       obscured: control.getBool("obscured"),
       multiline: control.getBool("multiline"),

packages/flet/lib/src/controls/shimmer.dart

@@ -0,0 +1,73 @@
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+import 'package:shimmer/shimmer.dart';
+
+import '../extensions/control.dart';
+import '../models/control.dart';
+import '../utils/colors.dart';
+import '../utils/gradient.dart';
+import '../utils/numbers.dart';
+import '../utils/time.dart';
+import '../widgets/error.dart';
+import 'base_controls.dart';
+
+class ShimmerControl extends StatelessWidget {
+  final Control control;
+
+  const ShimmerControl({super.key, required this.control});
+
+  @override
+  Widget build(BuildContext context) {
+    debugPrint("Shimmer build: ${control.id}");
+
+    final content = control.buildWidget("content");
+    if (content == null) {
+      return const ErrorControl("Shimmer.content must be specified");
+    }
+
+    final gradient = control.getGradient("gradient", Theme.of(context));
+    final baseColor = control.getColor("base_color", context);
+    final highlightColor = control.getColor("highlight_color", context);
+
+    if (gradient == null && (baseColor == null || highlightColor == null)) {
+      return const ErrorControl(
+          "Shimmer requires either gradient or base/highlight colors");
+    }
+
+    final direction = _parseDirection(control.getString("direction"));
+    final period =
+        control.getDuration("period", const Duration(milliseconds: 1500))!;
+    final loop = control.getInt("loop", 0)!;
+
+    final shimmerWidget = gradient != null
+        ? Shimmer(
+            gradient: gradient,
+            direction: direction,
+            period: period,
+            loop: loop,
+            enabled: !control.disabled,
+            child: content,
+          )
+        : Shimmer.fromColors(
+            baseColor: baseColor!,
+            highlightColor: highlightColor!,
+            direction: direction,
+            period: period,
+            loop: loop,
+            enabled: !control.disabled,
+            child: content,
+          );
+
+    return LayoutControl(control: control, child: shimmerWidget);
+  }
+}
+
+ShimmerDirection _parseDirection(String? value,
+    [ShimmerDirection defaultValue = ShimmerDirection.ltr]) {
+  if (value == null) {
+    return defaultValue;
+  }
+  return ShimmerDirection.values.firstWhereOrNull(
+          (dir) => dir.name.toLowerCase() == value.toLowerCase()) ??
+      defaultValue;
+}

packages/flet/lib/src/controls/view.dart

@@ -168,10 +168,6 @@ class _ViewControlState extends State<ViewControl> {
         overlayWidgets.add(PageMedia(view: widget.control.parent));
       }
 
-      var windowControl = control.parent?.get("window");
-      if (windowControl != null && isRootView && isDesktopPlatform()) {
-        overlayWidgets.add(ControlWidget(control: windowControl));
-      }
     }
 
     Widget body = Stack(children: [

packages/flet/lib/src/flet_backend.dart

@@ -192,6 +192,7 @@ class FletBackend extends ChangeNotifier {
   }
 
   _registerClient() {
+    debugPrint("Registering web client: $page");
     _send(
         Message(
             action: MessageAction.registerClient,
@@ -211,7 +212,7 @@ class FletBackend extends ChangeNotifier {
                   "width": page.get("width"),
                   "height": page.get("height"),
                   "platform": page.get("platform"),
-                  "window": page.child("window")!.toMap(),
+                  "window": page.child("window", visibleOnly: false)!.toMap(),
                   "media": page.get("media"),
                 }).toMap()),
         unbuffered: true);
@@ -333,7 +334,7 @@ class FletBackend extends ChangeNotifier {
     if (isDesktopPlatform()) {
       var windowState = await getWindowState();
       debugPrint("Window state updated: $windowState");
-      var window = page.child("window")!;
+      var window = page.child("window", visibleOnly: false)!;
       updateControl(window.id, windowState.toMap());
       triggerControlEvent(window, "event", {"type": "resized"});
     }
@@ -470,8 +471,7 @@ class FletBackend extends ChangeNotifier {
     var template = appErrorMessage ?? defaultAppErrorMessageTemplate;
     final lines = const LineSplitter().convert(rawError);
     final message = lines.isNotEmpty ? lines.first : "";
-    final details =
-        lines.length > 1 ? lines.sublist(1).join("\n") : "";
+    final details = lines.length > 1 ? lines.sublist(1).join("\n") : "";
     template = template.replaceAll("{message}", message);
     if (details.isEmpty) {
       template = template.replaceAll(RegExp(r'(\r?\n)*\{details\}'), "");