Merge pull request #114 from loud-at-heart/feature/feat_Add_flutter_Stack_support_in_Mirai

feat: Add `Stack` and `positioned` widget support

Author: divyanshub024

examples/mirai_gallery/assets/json/home_screen.json

@@ -201,6 +201,38 @@
                         }
                     }
                 },
+                {
+                    "type": "listTile",
+                    "leading": {
+                        "type": "icon",
+                        "iconType": "material",
+                        "icon": "layers"
+                    },
+                    "title": {
+                        "type": "text",
+                        "data": "Mirai Stack",
+                        "style": {
+                            "fontSize": 21
+                        }
+                    },
+                    "subtitle": {
+                        "type": "text",
+                        "data": "This is a mirai stack widget.",
+                        "style": {
+                            "fontSize": 12
+                        }
+                    },
+                    "isThreeLine": true,
+                    "onTap": {
+                        "actionType": "navigate",
+                        "navigationStyle": "push",
+                        "navigationType": "screen",
+                        "widgetJson": {
+                            "type": "exampleScreen",
+                            "assetPath": "assets/json/stack_example.json"
+                        }
+                    }
+                },
                 {
                     "type": "listTile",
                     "leading": {

examples/mirai_gallery/assets/json/stack_example.json

@@ -0,0 +1,84 @@
+{
+    "type": "scaffold",
+    "appBar": {
+        "type": "appBar",
+        "title": {
+            "type": "text",
+            "data": "Stack"
+        }
+    },
+    "body": {
+        "type": "stack",
+        "alignment": "center",
+        "clipBehavior": "antiAlias",
+        "children": [
+            {
+                "type": "positioned",
+                "top": 30,
+                "left": 30,
+                "height": 150,
+                "width": 150,
+                "child": {
+                    "type": "container",
+                    "width": 75,
+                    "height": 75,
+                    "color": "#81C784",
+                    "child": {
+                        "type": "text",
+                        "data": "Green",
+                        "align": "center",
+                        "style": {
+                            "fontSize": 20,
+                            "color": "#FFFFFF"
+                        }
+                    }
+                }
+            },
+            {
+                "type": "positioned",
+                "top": 70,
+                "left": 60,
+                "height": 150,
+                "width": 150,
+                "child": {
+                    "type": "container",
+                    "width": 75,
+                    "height": 75,
+                    "color": "#EF5350",
+                    "child": {
+                        "type": "text",
+                        "data": "Red",
+                        "align": "center",
+                        "style": {
+                            "fontSize": 20,
+                            "color": "#FFFFFF"
+                        }
+                    }
+                }
+            },
+            {
+                "type": "positioned",
+                "positionedType": "fill",
+                "top": 130,
+                "left": 90,
+                "height": 150,
+                "width": 150,
+                "child": {
+                    "type": "container",
+                    "width": 75,
+                    "height": 75,
+                    "color": "#BA68C8",
+                    "child": {
+                        "type": "text",
+                        "data": "Purple",
+                        "align": "center",
+                        "style": {
+                            "fontSize": 20,
+                            "color": "#FFFFFF"
+                        }
+                    }
+                }
+            }
+        ]
+    }
+}

packages/mirai/lib/src/framework/mirai.dart

@@ -31,6 +31,8 @@ class Mirai {
     const MiraiCenterParser(),
     const MiraiRowParser(),
     const MiraiColumnParser(),
+    const MiraiStackParser(),
+    const MiraiPositionedParser(),
     const MiraiIconButtonParser(),
     const MiraiFloatingActionButtonParser(),
     const MiraiOutlinedButtonParser(),

packages/mirai/lib/src/parsers/mirai_alignment/mirai_alignment.dart

@@ -31,6 +31,8 @@ enum MiraiAlignment {
         return Alignment.bottomCenter;
       case MiraiAlignment.bottomRight:
         return Alignment.bottomRight;
+      default:
+        return Alignment.topLeft;
     }
   }
 }

packages/mirai/lib/src/parsers/mirai_alignment_directional/mirai_alignment_directional.dart

@@ -0,0 +1,38 @@
+import 'package:flutter/cupertino.dart';
+
+enum MiraiAlignmentDirectional {
+  topStart,
+  topCenter,
+  topEnd,
+  centerStart,
+  center,
+  centerEnd,
+  bottomStart,
+  bottomCenter,
+  bottomEnd;
+
+  AlignmentDirectional get value {
+    switch (this) {
+      case MiraiAlignmentDirectional.topStart:
+        return AlignmentDirectional.topStart;
+      case MiraiAlignmentDirectional.topCenter:
+        return AlignmentDirectional.topCenter;
+      case MiraiAlignmentDirectional.topEnd:
+        return AlignmentDirectional.topEnd;
+      case MiraiAlignmentDirectional.centerStart:
+        return AlignmentDirectional.centerStart;
+      case MiraiAlignmentDirectional.center:
+        return AlignmentDirectional.center;
+      case MiraiAlignmentDirectional.centerEnd:
+        return AlignmentDirectional.centerEnd;
+      case MiraiAlignmentDirectional.bottomStart:
+        return AlignmentDirectional.bottomStart;
+      case MiraiAlignmentDirectional.bottomCenter:
+        return AlignmentDirectional.bottomCenter;
+      case MiraiAlignmentDirectional.bottomEnd:
+        return AlignmentDirectional.bottomEnd;
+      default:
+        return AlignmentDirectional.topStart;
+    }
+  }
+}

packages/mirai/lib/src/parsers/mirai_gradient/mirai_gradient.dart

@@ -1,4 +1,5 @@
 import 'dart:math' as math;
+
 import 'package:flutter/material.dart';
 import 'package:freezed_annotation/freezed_annotation.dart';
 import 'package:mirai/src/parsers/parsers.dart';

packages/mirai/lib/src/parsers/mirai_positioned/mirai_positioned.dart

@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:mirai/src/parsers/mirai_rect/mirai_rect.dart';
+
+export 'package:mirai/src/parsers/mirai_positioned/mirai_positioned_parser.dart';
+
+part 'mirai_positioned.freezed.dart';
+part 'mirai_positioned.g.dart';
+
+/*
+* TODO :: Add support for fromRelativeRect
+*  enum MiraiPositionedType { directional, fill, fromRect, fromRelativeRect}
+*/
+
+enum MiraiPositionedType { directional, fill, fromRect }
+
+@freezed
+class MiraiPositioned with _$MiraiPositioned {
+  const factory MiraiPositioned({
+    MiraiPositionedType? positionedType,
+    double? left,
+    double? top,
+    double? right,
+    double? bottom,
+    double? width,
+    double? height,
+    double? start,
+    double? end,
+    @Default(TextDirection.ltr) TextDirection textDirection,
+    MiraiRect? rect,
+    Map<String, dynamic>? child,
+  }) = _MiraiPositioned;
+
+  factory MiraiPositioned.fromJson(Map<String, dynamic> json) =>
+      _$MiraiPositionedFromJson(json);
+}