Add "State" Pattern as Shape Manipulator example.

CHANGELOG.md

@@ -1,3 +1,6 @@
+## 0.24.0
+- Add state pattern: State Manipulator.
+
 ## 0.23.14
 - Replace web renderer html to canvakit (deploy_flutter_demo.dart).
 

README.md

@@ -17,7 +17,7 @@ It contains **Dart** examples for all classic **GoF** design patterns.
     - [ ] **Mediator**
     - [x] **Memento** - [[Conceptual](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/memento/conceptual)] [[Memento Editor](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/memento/memento_editor)] 
     - [x] **Observer** - [[Open-Close Editor Events](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/observer/open_close_editor_events)] [[AppObserver](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/observer/app_observer)] [[Subscriber Flutter Widget](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/observer/subscriber_flutter_widget)]
-    - [ ] **State**
+    - [x] **State** - [[State Manipulator](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/state/manipulator_state)]
     - [ ] **Template Method**
     - [X] **Visitor**  [[Shape XML Exporter](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/visitor/shapes_exporter)]
     - [X] **Strategy** [[Reservation Cargo Spaces](https://github.com/RefactoringGuru/design-patterns-dart/tree/main/patterns/strategy/reservation_cargo_spaces)]
@@ -32,8 +32,8 @@ It contains **Dart** examples for all classic **GoF** design patterns.
 
 ## Requirements
 
-The examples were written in **Dart 2.15**.
-Some complex examples require **Flutter 2.12**.
+The examples were written in **Dart 2.17**.
+Some complex examples require **Flutter 3.0.0**.
 
 ## Contributor's Guide
 

analysis_options.yaml

@@ -15,10 +15,9 @@ include: package:lints/recommended.yaml
 
 # Uncomment the following section to specify additional rules.
 
-# linter:
-#   rules:
-#     - camel_case_types
-
+linter:
+  rules:
+    library_private_types_in_public_api: false
 # analyzer:
 #   exclude:
 #     - path/to/excluded/files/**

bin/deploy_flutter_demos.dart

@@ -20,9 +20,9 @@ void main() async {
   clear();
 }
 
-late final tmpDir = Directory.systemTemp.createTempSync();
-late final projectDir = thisPath(r'..\');
-late final webBuildDir = Directory(projectDir.uri.toFilePath() + r'build\web');
+ final tmpDir = Directory.systemTemp.createTempSync();
+ final projectDir = thisPath(r'..\');
+ final webBuildDir = Directory(projectDir.uri.toFilePath() + r'build\web');
 late final String originUrl;
 
 Future<void> init() async {

bin/main.dart

@@ -3,6 +3,7 @@ import '../patterns/abstract_factory/tool_panel_factory/main.dart';
 import '../patterns/observer/subscriber_flutter_widget/main.dart';
 import '../patterns/adapter/flutter_adapter/main.dart';
 import '../patterns/memento/memento_editor/main.dart';
+import '../patterns/state/manipulator_state/main.dart';
 
 void main() {
   runApp(MyApp());
@@ -13,13 +14,20 @@ class MyApp extends StatelessWidget {
   Widget build(BuildContext context) {
     return MaterialApp(
       title: 'Refactoring Guru: Flutter launcher',
-      theme: ThemeData(primarySwatch: Colors.pink),
-      initialRoute: '/abstract_factory/tool_panel_factory',
+      theme: ThemeData(
+        primarySwatch: Colors.pink,
+        iconTheme: IconThemeData(
+          size: 32,
+          color: Colors.white,
+        ),
+      ),
+      initialRoute: '/state/manipulator_state',
       routes: {
         '/observer/subscriber_flutter_widget': (_) => SubscriberFlutterApp(),
         '/adapter/flutter_adapter': (_) => FlutterAdapterApp(),
         '/memento/flutter_memento_editor': (_) => FlutterMementoEditorApp(),
         '/abstract_factory/tool_panel_factory': (_) => ToolPanelFactoryApp(),
+        '/state/manipulator_state': (_) => ManipulatorStateApp(),
       },
     );
   }

patterns/abstract_factory/tool_panel_factory/widgets/independent/panel.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 
 class Panel extends StatelessWidget {
   static const thicknessWidth = 64.0;
-  static const thicknessHeight = 48.0;
+  final double thicknessHeight;
 
   final Axis direction;
   final Widget child;
@@ -11,6 +11,7 @@ class Panel extends StatelessWidget {
     Key? key,
     required this.direction,
     required this.child,
+    this.thicknessHeight = 48.0,
   }) : super(key: key);
 
   @override

patterns/abstract_factory/tool_panel_factory/widgets/independent/tool_button.dart

@@ -10,7 +10,7 @@ class ToolButton extends StatelessWidget {
   const ToolButton({
     Key? key,
     required this.onTap,
-    required this.active,
+    this.active = false,
     required this.icon,
   }) : super(key: key);
 

patterns/abstract_factory/tool_panel_factory/widgets/property_widgets/primitive/filed_label.dart

@@ -15,7 +15,7 @@ class FieldLabel extends StatelessWidget {
     return Row(
       children: [
         SizedBox(width: 10),
-        Text(text + ':'),
+        Text('$text:'),
         SizedBox(width: 10),
         child,
         SizedBox(width: 20),

patterns/builder/cars/main.dart

@@ -34,5 +34,5 @@ void main() {
   // RU: Директор может знать больше одного рецепта строительства
   director.constructSportsCar(manualBuilder);
   final carManual = manualBuilder.getResult();
-  print("Car manual built:\n" + carManual.print());
+  print("Car manual built:\n${carManual.print()}");
 }

patterns/command/text_editor/main.dart

@@ -32,5 +32,5 @@ void log({
 }) {
   final addOrUndo = isUndo ? 'Undo_' : '[➕] ';
   final description = '$addOrUndo$command';
-  print(description.padRight(72, '_') + '"$editorText"');
+  print('${description.padRight(72, '_')}"$editorText"');
 }

patterns/composite/products_and_boxes/products/box.dart

@@ -9,8 +9,8 @@ class Box implements Product {
   @override
   String get content {
     final places = size > 1 ? "places: $size, " : "";
-    final _price = size > 1 ? "price: $price\$" : "$price\$";
-    return 'Box($places$_price)';
+    final localPrice = size > 1 ? "price: $price\$" : "$price\$";
+    return 'Box($places$localPrice)';
   }
 
   @override

patterns/state/manipulator_state/README.md

@@ -0,0 +1,76 @@
+# State Pattern
+State is a behavioral design pattern that lets an object alter its behavior when its internal state 
+changes. It appears as if the object changed its class.
+
+Tutorial: [here](https://refactoring.guru/design-patterns/state).
+
+### Online demo:
+Click on the picture to see the [demo](https://RefactoringGuru.github.io/design-patterns-dart/#/state/manipulator_state).
+
+[![image](https://user-images.githubusercontent.com/8049534/171070341-1decb58f-033b-4eb5-89d4-355aafa6b680.png)](https://refactoringguru.github.io/design-patterns-dart/#/state/manipulator_state)
+
+### Video
+https://user-images.githubusercontent.com/8049534/171499203-1400c3ae-d5cd-4e48-a0b6-0252f4345d19.mp4
+
+### Diagram:
+![image](https://user-images.githubusercontent.com/8049534/171740942-659d3ec9-8355-4078-a7d6-b4a338b41187.png)
+
+## Client code:
+### Change FreeState to MoveState:
+```dart
+class FreeState extends ManipulationState {
+  @override
+  void mouseDown(double x, double y) {
+    tryToSelectAndStartMovingShape(x, y);
+  }
+
+  bool tryToSelectAndStartMovingShape(double x, double y) {
+    final selectedShape = context.shapes.findShapeByCoordinates(x, y);
+
+    context.changeState(
+      MoveState(
+        startX: x,
+        startY: y,
+        selectedShape: selectedShape,
+      ),
+    );
+
+    return true;
+  }
+}
+```
+
+### Change MoveState to ResizableState:
+```dart
+class MoveState extends SelectionState {
+  @override
+  void mouseMove(double x, double y) {
+    selectedShape.move(x, y);
+    context.update();
+  }
+
+  @override
+  void mouseUp() {
+    context.changeState(
+      selectedShape.createSelectionState(),
+    );
+  }
+}
+```
+
+### Each shape has its own state manipulator:
+```dart
+class RectangleShape extends BaseShape {
+  @override
+  SelectionState createSelectionState() {
+    return ResizableState(selectedShape: this);
+  }
+}
+
+class CircleShape extends BaseShape {
+  @override
+  SelectionState createSelectionState() {
+    return InnerRadiusState(selectedShape: this);
+  }
+}
+```

patterns/state/manipulator_state/app/app.dart

@@ -0,0 +1,15 @@
+import '../pattern/manipulator.dart';
+import 'shapes.dart';
+import 'tool.dart';
+
+class App {
+  final Shapes shapes;
+  final Manipulator manipulator;
+  final List<Tool> tools;
+
+  App({
+    required this.shapes,
+    required this.manipulator,
+    required this.tools,
+  });
+}

patterns/state/manipulator_state/app/base_manipulation.dart

@@ -0,0 +1,87 @@
+part of manipulator;
+
+class BaseManipulator implements Manipulator {
+  BaseManipulator({
+    required this.shapes,
+    required ManipulationState initState,
+    required this.paintStyle,
+  }) : _state = initState {
+    _state._context = this;
+  }
+
+  @override
+  ManipulationState get state => _state;
+
+  @override
+  final Shapes shapes;
+
+  @override
+  final onStateChange = Event();
+
+  @override
+  final onUpdate = Event();
+
+  @override
+  var cursor = MouseCursor.defer;
+
+  @override
+  final PaintStyle paintStyle;
+
+  @override
+  void changeState(ManipulationState newState) {
+    if (_state == newState) {
+      return;
+    }
+
+    _state = newState;
+    _state._context = this;
+    _state.init();
+    onStateChange._emit();
+  }
+
+  @override
+  void update() {
+    onUpdate._emit();
+  }
+
+  @override
+  void mouseMove(double x, double y) {
+    _state.mouseMove(x, y);
+  }
+
+  @override
+  void mouseDown(double x, double y) {
+    _state.mouseDown(x, y);
+  }
+
+  @override
+  void mouseUp() {
+    _state.mouseUp();
+  }
+
+  @override
+  void mouseDoubleClick(double x, double y) {
+    _state.mouseDoubleClick(x, y);
+  }
+
+  @override
+  void keyDown(KeyEvent keyEvent) {
+    _state.keyDown(keyEvent);
+  }
+
+  @override
+  void paint(Canvas canvas) {
+    _state.paint(canvas);
+  }
+
+  @override
+  String toString() {
+    return _state.toString();
+  }
+
+  ManipulationState _state;
+}
+
+class Event extends ChangeNotifier {
+  void _emit() => notifyListeners();
+}

patterns/state/manipulator_state/app/shapes.dart

@@ -0,0 +1,36 @@
+import 'dart:collection';
+import 'dart:ui';
+
+import 'package:flutter/foundation.dart';
+
+import '../shapes/shape.dart';
+
+class Shapes with IterableMixin<Shape> {
+  final List<Shape> _shapes;
+
+  Shapes(List<Shape> shapes) : _shapes = shapes;
+
+  void add(Shape shape) {
+    _shapes.add(shape);
+    onChange._emit();
+  }
+
+  @override
+  Iterator<Shape> get iterator => _shapes.iterator;
+
+  final onChange = Event();
+
+  Shape? findShapeByCoordinates(x, y) {
+    for (final shape in _shapes.reversed) {
+      if (shape.rect.contains(Offset(x, y))) {
+        return shape;
+      }
+    }
+
+    return null;
+  }
+}
+
+class Event extends ChangeNotifier {
+  void _emit() => notifyListeners();
+}

patterns/state/manipulator_state/app/tool.dart

@@ -0,0 +1,13 @@
+import 'package:flutter/widgets.dart';
+
+import '../pattern/manipulator.dart';
+
+class Tool {
+  final Icon icon;
+  final ManipulationState state;
+
+  Tool({
+    required this.icon,
+    required this.state,
+  });
+}