forked from GDSC-BSIOTR/Flutter-Widgets
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.json
246 lines (241 loc) · 13.5 KB
/
index.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
[
{
"id":11,
"name":"SafeArea",
"description":"A widget that insets its child by sufficient padding to avoid intrusions by the operating system.\nFor example, this will indent the child by enough to avoid the status bar at the top of the screen.\nIt will also indent the child by the amount necessary to avoid The Notch on the iPhone X, or other similar creative physical features of the display.",
"youtube link":"https://www.youtube.com/watch?v=lkF0TQJO0bA&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=2",
"documentation page":"https://api.flutter.dev/flutter/widgets/SafeArea-class.html"
},
{
"id":12,
"name":"Expanded",
"description":"A widget that expands a child of a Row, Column, or Flex so that the child fills the available space. \nUsing an Expanded widget makes a child of a Row, Column, or Flex expand to fill the available space along the main axis (e.g., horizontally for a Row or vertically for a Column). \nIf multiple children are expanded, the available space is divided among them according to the flex factor.",
"youtube link":"https://www.youtube.com/watch?v=_rnZaagadyo&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=3",
"documentation page":"https://api.flutter.dev/flutter/widgets/Expanded-class.html"
},
{
"id":13,
"name":"Hero ",
"description":"Hero transitions are a common UI pattern. They let the user know that they changed screens, while keeping the focus of the interaction front and center. Flutter’s Hero widget will automatically create a hero transition between two navigator routes.",
"youtube link":"https://youtu.be/Be9UH1kXFDw",
"documentation page":"https://api.flutter.dev/flutter/widgets/Hero.html"
},
{
"id":14,
"name":"AnimatedContainer",
"description":"Animated version of Container that gradually changes its values over a period of time. \nThe AnimatedContainer will automatically animate between the old and new values of properties when they change using the provided curve and duration. \nProperties that are null are not animated. Its child and descendants are not animated.",
"youtube link":"https://www.youtube.com/watch?v=yI-8QHpGIP4&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=5",
"documentation page":"https://api.flutter.dev/flutter/widgets/AnimatedContainer-class.html"
},
{
"id":15,
"name":"Opacity",
"description":"A widget that makes its child partially transparent. \nThis class paints its child into an intermediate buffer and then blends the child back into the scene partially transparent.",
"youtube link":"https://www.youtube.com/watch?v=9hltevOHQBw&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=6",
"documentation page":"https://api.flutter.dev/flutter/widgets/Opacity-class.html"
},
{
"id":16,
"name":"Center",
"description":"A widget to center all its child elements",
"youtube link":"https://www.youtube.com/watch?v=c726pWTtxqI",
"documentation page":"https://api.flutter.dev/flutter/widgets/Center-class.html"
},
{
"id":17,
"name":"FlutterLogo",
"description":"The Flutter logo, in widget form.",
"youtube link":"https://www.youtube.com/watch?v=aAmP-WcI6dg",
"documentation page":"https://api.flutter.dev/flutter/material/FlutterLogo-class.html"
},
{
"id":18,
"name":"HeroMode",
"description":"Enables or disables Heroes in the widget subtree.",
"youtube link":"https://www.youtube.com/watch?v=AaIASk2u1C0",
"documentation page":"https://api.flutter.dev/flutter/widgets/HeroMode-class.html",
},
{
"id":19,
"name":"SingleChildScrollView",
"description":"Allows user to scroll the flutter page.",
"youtube link":"https://www.youtube.com/watch?v=UL-Hvrz-7AQ",
"documentation page":"https://api.flutter.dev/flutter/widgets/SingleChildScrollView-class.html",
},
{
"id":20,
"name":"AnimatedPhysicalModel",
"description":"The color is animated if the animateColor property is set; otherwise, the color changes immediately at the start of the animation for the other two properties. This allows the color to be animated independently (e.g. because it is being driven by an AnimatedTheme).",
"youtube link":"https://www.youtube.com/watch?v=UL-Hvrz-7AQ",
"documentation page":"https://api.flutter.dev/flutter/widgets/AnimatedPhysicalModel-class.html"
},
{
"id":21,
"name":"CupertinoPopupSurface class,
"description":"Rounded rectangle surface that looks like an iOS popup surface, e.g., alert dialog and action sheet.",
"youtube link":"https://www.youtube.com/watch?v=2_y5YYkZoWM",
"documentation page":"https://api.flutter.dev/flutter/cupertino/CupertinoPopupSurface-class.html"
},
{
"id":22,
"name":"AnimatedList",
"description":"Use AnimatedList to make your lists more dynamic. You can use it to animate your lists when inserting or removing items.",
"youtube link":"https://www.youtube.com/watch?v=ZtfItHwFlZ8&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=33&ab_channel=Flutter",
"documentation page":"https://api.flutter.dev/flutter/widgets/AnimatedList-class.html"
},
{
"id":23,
"name":"Wrap",
"description":"The Wrap widget lays out its children like a row or column, but when it runs out of room, it wraps to the next line. Direction, alignment, and spacing properties can help you get the exact look you need.",
"youtube link":"https://www.youtube.com/watch?v=z5iw2SeFx2M&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=4&ab_channel=GoogleDevelopers",
"documentation page":"https://api.flutter.dev/flutter/widgets/Wrap-class.html"
},
{
"id":24,
"name":"ClipOval",
"description":"By default, inscribes an axis-aligned oval into its layout dimensions and prevents its child from painting outside that oval, but the size and location of the clip oval can be customized using a custom clipper.",
"youtube link":"https://youtu.be/vzWWDO6whIM",
"documentation page":"https://api.flutter.dev/flutter/widgets/ClipOval-class.html"
},
{
"id":25,
"name":"Table",
"description":"A table allows the user to arrange the data in rows and columns. It is used to store and display our data in a structured format, which helps us to compare the pairs of related values easily.",
"youtube link":"https://youtu.be/_lbE0wsVZSw",
"documentation page":"https://api.flutter.dev/flutter/widgets/Table-class.html"
},
{
"id":26,
"name":"ConstrainedBox",
"description":"A widget that imposes additional constraints on its child.",
"youtube link":"https://youtu.be/o2KveVr7adg",
"documentation page":"https://api.flutter.dev/flutter/widgets/ConstrainedBox-class.html"
},
{
"id":27,
"name":"SnackBar ",
"description":"SnackBar lets you pop up a message for a few seconds at the bottom of your app.",
"youtube link":"https://youtu.be/zpO6n_oZWw0?list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&t=10",
"documentation page":"https://api.flutter.dev/flutter/material/SnackBar-class.html"
},
{
"id":28,
"name":"AboutDialog",
"description":"An about box. This is a dialog box with the application's icon, name, version number, and copyright, plus a button to show licenses for software used by the application.",
"youtube link":"https://www.youtube.com/watch?v=YFCSODyFxbE",
"documentation page":"https://api.flutter.dev/flutter/material/AboutDialog-class.html"
},
{
"id":29,
"name":"BackdropFilter",
"description":"A widget that applies a filter to the existing painted content and then paints child.",
"youtube link":"https://www.youtube.com/watch?v=dYRs7Q1vfYI",
"documentation page":"https://api.flutter.dev/flutter/widgets/BackdropFilter-class.html"
},
{
"id":30,
"name":"Text",
"description":"The Text widget displays a string of text with single style.",
"youtube link":"https://www.youtube.com/watch?v=WYbXv9WtVwE",
"documentation page":"https://api.flutter.dev/flutter/widgets/Text-class.html"
},
{
"id":31,
"name":"Layout",
"description":"This bundle of widgets helps in placing the other widgets on the screen as needed",
"youtube link":"https://www.youtube.com/watch?v=uisLoOmtISk",
"documentation page":"https://api.flutter.dev/flutter/material/AboutDialog-class.html"
},
{
"id":32,
"name":"AssetImage",
"description":"Fetches an image from an AssetBundle, having determined the exact image to use based on the context.",
"youtube link":"https://www.youtube.com/watch?v=Hxh6nNHSUjo",
"documentation page":"https://api.flutter.dev/flutter/painting/AssetImage-class.html"
},
{
"id":33,
"name":"RefreshIndicator",
"description":"A widget that supports the Material "swipe to refresh" idiom.",
"youtube link":"https://www.youtube.com/watch?v=ORApMlzwMdM&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=108",
"documentation page":"https://api.flutter.dev/flutter/material/RefreshIndicator-class.html"
},
{
"id":22,
"name":"RichText Class",
"description":"A paragraph of rich text.",
"youtube link":"https://youtu.be/rykDVh-QFfw",
"documentation page":"https://api.flutter.dev/flutter/widgets/RichText-class.html"
},
{
"id":23,
"name":"AppBar",
"description":"Topmost component of the app",
"youtube link":"https://www.youtube.com/watch?v=dHBF4IJZvHk&ab_channel=JohannesMilke",
"documentation page":"https://api.flutter.dev/flutter/material/AppBar-class.html"
},
{
"id":24
"name":"Paint class",
"description":" style to use when drawing on a Canvas",
"youtube link":"https://youtu.be/vvI_NUXK00s",
"documentation page":"https://api.flutter.dev/flutter/dart-ui/Paint-class.html"
},
{
"id":25,
"name":"Padding",
"description":"Topmost component of the app",
"youtube link":"https://www.youtube.com/watch?v=dHBF4IJZvHk&ab_channel=JohannesMilke",
"documentation page":"https://api.flutter.dev/flutter/material/AppBar-class.html"
},
{
"id":26,
"name":"Flow",
"description":"The Flow widget that sizes and positions children efficiently.",
"youtube link":"https://youtu.be/NG6pvXpnIso",
"documentation page":"https://api.flutter.dev/flutter/widgets/Flow-class.html"
},
{
"id":27,
"name":"margin",
"description":"Margin has multiple meanings. In business, margin is the profit generated after accounting for costs, which is expressed as a percentage.",
"youtube link":"https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbXZnZzFaWnZlSHlGX21veTZQX2ZrS2Q5OFByUXxBQ3Jtc0tuS05QcXlBQXF4X2N5ZksxU2dHMFJ1OHRnT3RnZm1yU1IyeVo1OGtJN1FIUXRacmdaN1U2cVV0M1ZQbTBMZ25vcmk3emVxZWw1X2NCS0NwTTVkZkdTZzJCQWFlTUF0eUlMWWs1UlYwRkNGbDNwOW1oTQ&q=https%3A%2F%2Fwww.patreon.com%2Finvestorsgrow&v=lzMg04UKuj4&html_redirect=1"
",
"documentation page":"https://support.microsoft.com/en-us/office/change-the-margins-in-your-word-document-c95c1ea1-70b1-4dde-a1da-f5aa2042c829#:~:text=Create%20a%20custom%20margin,Select%20OK%20when%20done."
},
{
"id":28",
"name":"Mediaquery",
"description":"Establishes a subtree in which media queries resolve to the given data.",
"youtube link":"https://www.youtube.com/watch?v=pxFPA8wdwKE",
"documentation page":"https://api.flutter.dev/flutter/widgets/MediaQuery-class.html"
},
{
"id":29",
"name":"BottomSheet",
"description":"A Material Design bottom sheet.The BottomSheet widget itself is rarely used directly. Instead, prefer to create a persistent bottom sheet with ScaffoldState.showBottomSheet or Scaffold.bottomSheet, and a modal bottom sheet with showModalBottomSheet.",
"youtube link":"https://www.youtube.com/watch?v=_y40_iamKAc",
"documentation page":"https://api.flutter.dev/flutter/material/BottomSheet-class.html"
},
{
"id"30,
"name":"pratiksha",
"description":"A widget that insets its child by sufficient padding to avoid intrusions by the operating system.\nFor example, this will indent the child by enough to avoid the status bar at the top of the screen.\nIt will also indent the child by the amount necessary to avoid The Notch on the iPhone X, or other similar creative physical features of the display.",
"youtube link":"https://www.youtube.com/watch?v=lkF0TQJO0bA&list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG&index=2",
"documentation page":"https://api.flutter.dev/flutter/widgets/SafeArea-class.html"
},
{
"id":31,
"name":"RichText",
"description":"The RichText widget displays text that uses multiple different styles.",
"youtube link":"https://youtu.be/rykDVh-QFfw",
"documentation page":"https://api.flutter.dev/flutter/widgets/RichText-class.html"
},
{
"id":32",
"name":"async",
"description":"async patterns to your flutter application.",
"youtube link":"https://youtu.be/SmTCmDMi4BY",
"documentation":"https://docs.flutter.dev/development/ui/widgets/async",
}
]