Skip to content

Commit d9eca4c

Browse files
feat: Add Drawer widget support to Stac framework (#312)
* Cherry-pick: drawer changes from 8dbc8cf * docs: add Drawer widget documentation
1 parent 42e0bcb commit d9eca4c

File tree

10 files changed

+694
-0
lines changed

10 files changed

+694
-0
lines changed
Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
{
2+
"type": "scaffold",
3+
"appBar": {
4+
"type": "appBar",
5+
"title": {
6+
"type": "text",
7+
"data": "Drawer Example",
8+
"style": {
9+
"color": "#ffffff",
10+
"fontSize": 21
11+
}
12+
},
13+
"backgroundColor": "#4D00E9"
14+
},
15+
"drawerEnableOpenDragGesture": true,
16+
"drawerEdgeDragWidth": 20.0,
17+
"drawer": {
18+
"type": "drawer",
19+
"backgroundColor": "#f5f5f5",
20+
"elevation": 16.0,
21+
"width": 280.0,
22+
"child": {
23+
"type": "column",
24+
"children": [
25+
{
26+
"type": "container",
27+
"height": 120,
28+
"color": "#4D00E9",
29+
"child": {
30+
"type": "center",
31+
"child": {
32+
"type": "text",
33+
"data": "Drawer Header",
34+
"style": {
35+
"color": "#ffffff",
36+
"fontSize": 20,
37+
"fontWeight": "bold"
38+
}
39+
}
40+
}
41+
},
42+
{
43+
"type": "expanded",
44+
"child": {
45+
"type": "listView",
46+
"children": [
47+
{
48+
"type": "listTile",
49+
"leading": {
50+
"type": "icon",
51+
"iconType": "material",
52+
"icon": "home",
53+
"size": 24
54+
},
55+
"title": {
56+
"type": "text",
57+
"data": "Home"
58+
},
59+
"onTap": {
60+
"actionType": "snackBar",
61+
"content": "Home tapped!"
62+
}
63+
},
64+
{
65+
"type": "listTile",
66+
"leading": {
67+
"type": "icon",
68+
"iconType": "material",
69+
"icon": "settings",
70+
"size": 24
71+
},
72+
"title": {
73+
"type": "text",
74+
"data": "Settings"
75+
},
76+
"onTap": {
77+
"actionType": "snackBar",
78+
"content": "Settings tapped!"
79+
}
80+
},
81+
{
82+
"type": "listTile",
83+
"leading": {
84+
"type": "icon",
85+
"iconType": "material",
86+
"icon": "info",
87+
"size": 24
88+
},
89+
"title": {
90+
"type": "text",
91+
"data": "About"
92+
},
93+
"onTap": {
94+
"actionType": "snackBar",
95+
"content": "About tapped!"
96+
}
97+
}
98+
]
99+
}
100+
}
101+
]
102+
}
103+
},
104+
"body": {
105+
"type": "center",
106+
"child": {
107+
"type": "column",
108+
"mainAxisAlignment": "center",
109+
"children": [
110+
{
111+
"type": "text",
112+
"data": "Welcome to Drawer Example",
113+
"style": {
114+
"fontSize": 24,
115+
"fontWeight": "bold"
116+
}
117+
},
118+
{
119+
"type": "sizedBox",
120+
"height": 16
121+
},
122+
{
123+
"type": "text",
124+
"data": "Swipe from left edge or tap the menu icon to open the drawer",
125+
"style": {
126+
"fontSize": 16,
127+
"color": "#666666"
128+
}
129+
}
130+
]
131+
}
132+
}
133+
}

examples/stac_gallery/assets/json/home_screen.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,29 @@
154154
}
155155
}
156156
},
157+
{
158+
"type": "listTile",
159+
"leading": {
160+
"type": "icon",
161+
"iconType": "material",
162+
"icon": "menu"
163+
},
164+
"title": {
165+
"type": "text",
166+
"data": "Stac Drawer"
167+
},
168+
"subtitle": {
169+
"type": "text",
170+
"data": "A Material Design panel that slides in horizontally from the edge of a Scaffold"
171+
},
172+
"onTap": {
173+
"actionType": "navigate",
174+
"widgetJson": {
175+
"type": "exampleScreen",
176+
"assetPath": "assets/json/drawer_example.json"
177+
}
178+
}
179+
},
157180
{
158181
"type": "listTile",
159182
"leading": {

packages/stac/lib/src/framework/stac.dart

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ class Stac {
8787
const StacCarouselViewParser(),
8888
const StacColoredBoxParser(),
8989
const StacDividerParser(),
90+
const StacDrawerParser(),
9091
const StacCircularProgressIndicatorParser(),
9192
const StacLinearProgressIndicatorParser(),
9293
const StacHeroParser(),
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:freezed_annotation/freezed_annotation.dart';
3+
import 'package:stac/src/parsers/widgets/stac_double/stac_double.dart';
4+
import 'package:stac/src/parsers/widgets/stac_shape_border/stac_shape_border.dart';
5+
6+
export 'stac_drawer_parser.dart';
7+
8+
part 'stac_drawer.freezed.dart';
9+
part 'stac_drawer.g.dart';
10+
11+
@freezed
12+
abstract class StacDrawer with _$StacDrawer {
13+
const factory StacDrawer({
14+
String? backgroundColor,
15+
StacDouble? elevation,
16+
String? shadowColor,
17+
String? surfaceTintColor,
18+
StacShapeBorder? shape,
19+
StacDouble? width,
20+
Map<String, dynamic>? child,
21+
String? semanticLabel,
22+
Clip? clipBehavior,
23+
}) = _StacDrawer;
24+
25+
factory StacDrawer.fromJson(Map<String, dynamic> json) =>
26+
_$StacDrawerFromJson(json);
27+
}

0 commit comments

Comments
 (0)