/flutter-snippets

Flutter Snippets is a collection of mostly used Widgets and Classes for Flutter developers.

MIT LicenseMIT

Flutter Snippets

Supercharge Your Flutter Dev: The Must-Have VS Code Flutter Snippet Extension.

Demo

Flutter Snippets demo gif

Top 10 features of Flutter Snippets

  1. Shortcuts for importing packages: This feature saves you time by automatically importing commonly used packages.

  2. Class creation shortcuts: This feature helps you quickly create new Flutter classes with the boilerplate code already filled in.

  3. Builder shortcuts: This feature provides shortcuts for creating different types of builders, such as StateBuilders and StreamBuilders.

  4. Scroll view shortcuts: This feature allows you to easily create different types of scroll views, such as ListViews and SingleChildScrollViews.

  5. Widget shortcuts: This feature provides shortcuts for creating a variety of widgets, such as Text, RaisedButton, and FloatingActionButton.

  6. Function and method shortcuts: This feature includes shortcuts for commonly used functions and methods, such as setState and initState.

  7. Common height and width snippets: This feature provides pre-defined snippets for setting common heights and widths in your Flutter code.

  8. Code formatting: This feature automatically formats your code according to the Flutter style guide.

  9. Live templates: This feature allows you to create your own custom snippets for frequently used code patterns.

  10. Integration with other extensions: This feature allows you to use Flutter Snippets with other popular VS Code extensions, such as Dart and Flutter.

Shortcuts

Import Package

Key press Meaning
importM Material Package
importC Cupertino Package

Class

Key press Meaning
resClass Responsive Class Code

Builders

Key press Meaning
listViewB ListView. Builder
ListViewS ListView. Separated
gridViewB GridView. Builder
gridViewC GridView. Count
gridViewE GridView. Extent
streamB Stream Builder
layoutB Layout Builder
oriB Orientation Builder
futureB Future Builder
futureBLV Future Builder ListView
futureBLVModel Future Builder with ListView Model

Scroll Views

Key press Meaning
customSV Custom ScrollView
singleChildSV Single Child ScrollView

Widgets

Key press Meaning
stlW Stateless Widget
stfW Stateful Widget

Functions

Key press Meaning
debugP Debug Print

Methods

Key press Meaning
buildM Build Method
initS Init State Method
dis Dispose Method
alertDialog Alert Dialog Method

Common Height

Key press Meaning
smallHeight const SizedBox(height: 8.0)
mediumHeight const SizedBox(height: 16.0)
largeHeight const SizedBox(height: 24.0)
largerHeight const SizedBox(height: 32.0)
largestHeight const SizedBox(height: 40.0)

Common Width

Key press Meaning
smallWidth const SizedBox(width: 8.0)
mediumWidth const SizedBox(width: 16.0)
largeWidth const SizedBox(width: 24.0)
largerWidth const SizedBox(width: 32.0)
largestWidth const SizedBox(width: 40.0)

Height

  • 1xHeight : 10 logical pixel Height.
Key press Meaning
1xHeight const SizedBox(height: 10.0)
2xHeight const SizedBox(height: 20.0)
3xHeight const SizedBox(height: 30.0)
4xHeight const SizedBox(height: 40.0)
5xHeight const SizedBox(height: 50.0)
6xHeight const SizedBox(height: 60.0)
7xHeight const SizedBox(height: 70.0)
8xHeight const SizedBox(height: 80.0)
9xHeight const SizedBox(height: 90.0)
10xHeight const SizedBox(height: 100.0)
11xHeight const SizedBox(height: 110.0)
12xHeight const SizedBox(height: 120.0)
13xHeight const SizedBox(height: 130.0)
14xHeight const SizedBox(height: 140.0)
15xHeight const SizedBox(height: 150.0)
16xHeight const SizedBox(height: 160.0)
17xHeight const SizedBox(height: 170.0)
18xHeight const SizedBox(height: 180.0)
19xHeight const SizedBox(height: 190.0)
20xHeight const SizedBox(height: 200.0)

Width

  • 1xWidth : 10 logical pixel Width.
Key press Meaning
1xWidth const SizedBox(width: 10.0)
2xWidth const SizedBox(width: 20.0)
3xWidth const SizedBox(width: 30.0)
4xWidth const SizedBox(width: 40.0)
5xWidth const SizedBox(width: 50.0)
6xWidth const SizedBox(width: 60.0)
7xWidth const SizedBox(width: 70.0)
8xWidth const SizedBox(width: 80.0)
9xWidth const SizedBox(width: 90.0)
10xWidth const SizedBox(width: 100.0)
11xWidth const SizedBox(width: 110.0)
12xWidth const SizedBox(width: 120.0)
13xWidth const SizedBox(width: 130.0)
14xWidth const SizedBox(width: 140.0)
15xWidth const SizedBox(width: 150.0)
16xWidth const SizedBox(width: 160.0)
17xWidth const SizedBox(width: 170.0)
18xWidth const SizedBox(width: 180.0)
19xWidth const SizedBox(width: 190.0)
20xWidth const SizedBox(width: 200.0)

Provider Package Utils

Key press Meaning
importProvider Import Provider Package
changeNotiPro Change changeNotifier Provider
consumerProBuild Provider Consumer Builder
proContext Provider.of(context)
multiProMaApp Multi Provider Material App
proControllerClass Provider Controller Class

License

MIT License

Release Notes

0.0.14

  • Update App Description 🚀

0.0.13

  • Added Provider Package Utils 🚀
  • Update documentation ✅

0.0.12

  • futureBLV for Future Builder ListView 🚀
  • futureBLVModel for Future Builder with ListView Model 🚀

0.0.10

  • demo gif url changed🐛

0.0.9

  • dispM to dis, orientationB to oriB ✅
  • Layout Builder, Orientation Builder, Future Builder and GridView Builder Code updated.✅
  • Physics and shrinkWrap added on all Scrollable View.✅

0.0.8

  • showDialog to alertDialog ✅
  • Responsive Class Code Added. 🚀

0.0.7

  • demo video added in Readme.md 🚀

0.0.6

  • changed shortcut keys of Height and Width ✅

0.0.5

  • Common Height & Width 🚀
  • X logical Pixel Height & Width 🚀
  • Readme Docs improved ✅

0.0.4

  • Snippets improved 🐛

0.0.3

  • Readme Docs Improved. 🐛
  • keywords added in package.json 🚀

0.0.2

  • Readme Docs Improved. 🐛

0.0.1

  • Initial release of Flutter Snippets.