Adding AspectRatio And FittedBox Widget example

StacDev · Jan 17, 2025 · 3726d1a · 3726d1a
1 parent aae312a
commit 3726d1a
Show file tree

Hide file tree

Showing 3 changed files with 148 additions and 0 deletions.
diff --git a/examples/mirai_gallery/assets/json/aspect_ratio_example.json b/examples/mirai_gallery/assets/json/aspect_ratio_example.json
@@ -0,0 +1,39 @@
+{
+  "type": "scaffold",
+  "appBar": {
+    "type": "appBar",
+    "title": {
+      "type": "text",
+      "data": "AspectRatio"
+    }
+  },
+  "body": {
+    "type": "padding",
+    "padding": {
+      "top": 12,
+      "left": 12,
+      "right": 12
+    },
+    "child": {
+      "type": "column",
+      "mainAxisAlignment": "start",
+      "crossAxisAlignment": "start",
+      "children": [
+        {
+          "type": "sizedBox",
+          "height": 12
+        },
+        {
+          "type": "aspectRatio",
+          "aspectRatio": 1.33,
+          "child": {
+            "type": "container",
+            "color": "#FF5733",
+            "width": 100,
+            "height": 100
+          }
+        }
+      ]
+    }
+  }
+}
diff --git a/examples/mirai_gallery/assets/json/fitted_box_example.json b/examples/mirai_gallery/assets/json/fitted_box_example.json
@@ -0,0 +1,42 @@
+{
+  "type": "scaffold",
+  "appBar": {
+    "type": "appBar",
+    "title": {
+      "type": "text",
+      "data": "FittedBox"
+    }
+  },
+  "body": {
+    "type": "padding",
+    "padding": {
+      "top": 12,
+      "left": 12,
+      "right": 12
+    },
+    "child": {
+      "type": "column",
+      "mainAxisAlignment": "start",
+      "crossAxisAlignment": "start",
+      "children": [
+        {
+          "type": "sizedBox",
+          "height": 12
+        },
+        {
+          "type": "fittedBox",
+          "fit": "contain",
+          "alignment": "center",
+          "child": {
+            "type": "text",
+            "data": "Hello, World!",
+            "style": {
+              "fontSize": 20,
+              "color": "#000000"
+            }
+          }
+        }
+      ]
+    }
+  }
+}
diff --git a/examples/mirai_gallery/assets/json/home_screen.json b/examples/mirai_gallery/assets/json/home_screen.json
@@ -1629,6 +1629,73 @@
       "behavior": "floating"
     }
   },
+
+  {
+    "type": "listTile",
+    "leading": {
+      "type": "icon",
+      "iconType": "material",
+      "icon": "apartment"
+    },
+
+    "title": {
+      "type": "text",
+      "data": "AspectRatio",
+      "style": {
+        "fontSize": 21
+      }
+    },
+    "subtitle": {
+      "type": "text",
+      "data": "A Material Design Mirai AspectRatio widget",
+      "style": {
+        "fontSize": 12
+      }
+    },
+    "isThreeLine": true,
+    "onTap": {
+      "actionType": "navigate",
+      "navigationStyle": "push",
+      "widgetJson": {
+        "type": "exampleScreen",
+        "assetPath": "assets/json/aspect_ratio_example.json"
+      }
+    }
+  },
+
+  {
+    "type": "listTile",
+    "leading": {
+      "type": "icon",
+      "iconType": "material",
+      "icon": "apartment"
+    },
+
+    "title": {
+      "type": "text",
+      "data": "FittedBox",
+      "style": {
+        "fontSize": 21
+      }
+    },
+    "subtitle": {
+      "type": "text",
+      "data": "A Material Design Mirai FittedBox widget",
+      "style": {
+        "fontSize": 12
+      }
+    },
+    "isThreeLine": true,
+    "onTap": {
+      "actionType": "navigate",
+      "navigationStyle": "push",
+      "widgetJson": {
+        "type": "exampleScreen",
+        "assetPath": "assets/json/fitted_box_example.json"
+      }
+    }
+  },
+
   {
     "type": "sizedBox",
     "height": 24.0