Add documentation for how to use annotated region (#24989)

packages/flutter/lib/src/services/system_chrome.dart

@@ -333,6 +333,60 @@ class SystemChrome {
   ///   return /* ... */;
   /// }
   /// ```
+  ///
+  /// For more complex control of the system overlay styles, consider using
+  /// an [AnnotatedRegion] widget instead of calling [setSystemUiOverlayStyle]
+  /// directly. This widget places a value directly into the layer tree where
+  /// it can be hit-tested by the framework. On every frame, the framework will
+  /// hit-test and select the annotated region it finds under the status and
+  /// navigation bar and synthesize them into a single style. This can be used
+  /// to configure the system styles when an app bar is not used.
+  ///
+  /// {@tool snippet --template=stateful_widget}
+  /// The following example creates a widget that changes the status bar color
+  /// to a random value on Android.
+  ///
+  /// ```dart imports
+  ///    import 'package:flutter/services.dart';
+  ///    import 'dart:math' as math;
+  /// ```
+  ///
+  /// ```dart
+  ///    final _random = math.Random();
+  ///    SystemUiOverlayStyle _currentStyle = SystemUiOverlayStyle.light;
+  ///
+  ///    void _changeColor() {
+  ///      final color = Color.fromRGBO(
+  ///        _random.nextInt(255),
+  ///        _random.nextInt(255),
+  ///        _random.nextInt(255),
+  ///        1.0,
+  ///      );
+  ///      setState(() {
+  ///        _currentStyle = SystemUiOverlayStyle.dark.copyWith(
+  ///          statusBarColor: color,
+  ///        );
+  ///      });
+  ///    }
+  ///
+  ///    @override
+  ///    Widget build(BuildContext context) {
+  ///      return Scaffold(
+  ///        body: AnnotatedRegion(
+  ///          value: _currentStyle,
+  ///           child: Center(
+  ///             child: RaisedButton(
+  ///               child: const Text('Change Color'),
+  ///               onPressed: _changeColor,
+  ///             ),
+  ///           ),
+  ///         ),
+  ///       );
+  ///     }
+  /// {@end-tool}
+  ///
+  /// See also:
+  ///   * [AnnotatedRegion], the widget used to place data into the layer tree.
   static void setSystemUIOverlayStyle(SystemUiOverlayStyle style) {
     assert(style != null);
     if (_pendingStyle != null) {