Home

Awesome

Whatsupcoders-flutter

An Awesome list of all the Flutter video Tutorials from Whatsupcoders Channel

<img src="https://user-images.githubusercontent.com/46075509/58399350-85e07f00-801d-11e9-86ae-7552cf975760.png" align="center" width="850" height="300">

Whatsupcoders offers you tons of free tutorials related to Flutter and helps you build real Flutter projects. Join me on my adventures!!

If you appreciate the content 📖, support projects visibility, give 👍| ⭐| 👏

Flutter NestedTabs

<a href="https://github.com/whatsupcoders/Flutter-Nested-Tabs"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58398646-5597e100-801b-11e9-8a69-eba6bb68c7bc.png" width="200"/> </td> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58398647-56307780-801b-11e9-9543-67cb2ccac96e.png" width="200"/> </td> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58398649-5761a480-801b-11e9-8a2b-d020f919ea42.png" width="200" /> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Nested-Tabs/blob/master/assets/nestedtabs.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter FlipCard

<a href="https://github.com/whatsupcoders/FLutterFlipCard"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FLutterFlipCard/blob/master/assets/Screenshot_1560464138.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FLutterFlipCard/blob/master/assets/Screenshot_1560464142.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FLutterFlipCard/blob/master/assets/flipgif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Web(Flutter EuroRail Example)

<a href="https://github.com/whatsupcoders/Flutter-EuroRail"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-EuroRail/blob/master/flutter_euro_rail_web/assets/Flutter_web_gif.gif" width="1000" heigth="600"/> </td> </tr> </table> </div> </a>

Flutter GoogleMaps

<a href="https://github.com/whatsupcoders/Flutter-GoogleMaps"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-GoogleMaps/blob/master/assets/Screenshot_1560716142.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-GoogleMaps/blob/master/assets/Screenshot_1560716160.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-GoogleMaps/blob/master/assets/googlemaps.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Charts

<a href="https://github.com/whatsupcoders/FlutterCharts"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterCharts/blob/master/assets/Screenshot_1559877889.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterCharts/blob/master/assets/Screenshot_1559877891.png" width="200"/> </td> </tr> </table> </div> </a>

Flutter Themes

<a href="https://github.com/whatsupcoders/FlutterThemes"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FetchTaxiAPP/blob/master/assets/Screenshot_1559848734.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FetchTaxiAPP/blob/master/assets/Screenshot_1559850163.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FetchTaxiAPP/blob/master/assets/Screenshot_1559850180.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FetchTaxiAPP/blob/master/assets/theme.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter SliversAppBar

<a href="https://github.com/whatsupcoders/Flutter-SliversApp"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-SliversApp/blob/master/assets/Screenshot_1563737594.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-SliversApp/blob/master/assets/Screenshot_1563737602.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-SliversApp/blob/master/assets/sliversApp_gif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Backdropfilter Widget

<a href="https://github.com/whatsupcoders/Flutter-BackdropFilter-Widget"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-BackdropFilter-Widget/blob/master/assets/Screenshot_1546993846.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-BackdropFilter-Widget/blob/master/assets/Screenshot_1546994073.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-BackdropFilter-Widget/blob/master/assets/Screenshot_1547008344.png" width="200" /> </td> </tr> </table> </div> </a>

Flutter Gradient

<a href="https://github.com/whatsupcoders/Flutter-Gradient"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Gradient/blob/master/assets/Screenshot_1563855812.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Gradient/blob/master/assets/Screenshot_1563855840.png" width="200"/> </td> </tr> </table> </div> </a>

Flutter PageView

<a href="https://github.com/whatsupcoders/Flutter-PageView"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-PageView/blob/master/assets/Screenshot_1561519501.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-PageView/blob/master/assets/Screenshot_1561519503.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-PageView/blob/master/assets/flutter_pageview.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Tables

<a href="https://github.com/whatsupcoders/Flutter-Tables"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Tables/blob/master/assets/Screenshot_1566245013.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Tables/blob/master/assets/Screenshot_1566245018.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Tables/blob/master/assets/Screenshot_1566245021.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Tables/blob/master/assets/table.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter GestureDetect and Inkwell

<a href="https://github.com/whatsupcoders/Flutter-Gesturedetect-inkwell"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Gesturedetect-inkwell/blob/master/assets/Gesturedetect.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Gesturedetect-inkwell/blob/master/assets/Screenshot_1570753657.png" width="200"/> </td> </tr> </table> </div> </a>

Flutter Slider Widget

<a href="https://github.com/whatsupcoders/Flutter-Slider-Widget"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Slider-Widget/blob/master/assets/slider_money_gif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Slider-Widget/blob/master/assets/slider_smiley_gif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Slider-Widget/blob/master/assets/slider_star_gif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter GoogleSign

<a href="https://github.com/whatsupcoders/GoogleSignin"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58397022-c7b8f780-8014-11e9-8a23-47d2e14a43e3.png" width="200"/> </td> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58397023-c8ea2480-8014-11e9-8156-32ebe2e86d36.png" width="200"/> </td> <td style="text-align: center"> <img src="https://user-images.githubusercontent.com/46075509/58397024-ca1b5180-8014-11e9-8ace-5546e65372a9.png" width="200" /> </td> </tr> </table> </div> </a>

Flutter FittedBox

<a href="https://github.com/whatsupcoders/Flutter-FittedBox"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FittedBox/blob/master/assets/Screenshot_1566251870.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FittedBox/blob/master/assets/Screenshot_1566251872.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FittedBox/blob/master/assets/fittedbox.gif" width="200" /> </td> </tr> </table> </div> </a>

Flutter Hero Widget

<a href="https://github.com/whatsupcoders/Flutter-Hero-Widget"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Hero-Widget/blob/master/assets/Screenshot_1561594973.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Hero-Widget/blob/master/assets/Screenshot_1561594975.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Hero-Widget/blob/master/assets/Flutter_hero_widget.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Chart+Firestore

<a href="https://github.com/whatsupcoders/flutter-chart-firestore"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/flutter-chart-firestore/blob/master/assets/Screenshot_1563054924.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/flutter-chart-firestore/blob/master/assets/Screenshot_1563057447.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/flutter-chart-firestore/blob/master/assets/chart_task_gif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/flutter-chart-firestore/blob/master/assets/charts_sales_gif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Drop Down

<a href="https://github.com/whatsupcoders/FlutterDropDown" > <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterDropDown/blob/master/assests/dropdowngif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterDropDown/blob/master/assests/Screenshot_1559088707.png" width="200"/></td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterDropDown/blob/master/assests/Screenshot_1559088697.png" width="200" /> </td> </tr> </table> </div> </a>

Flutter Chip Widget

<a href="https://github.com/whatsupcoders/Flutter-Chip-Widget" > <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Chip-Widget/blob/master/assets/action_gif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Chip-Widget/blob/master/assets/Screenshot_1562205033.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Chip-Widget/blob/master/assets/choice_gif.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Chip-Widget/blob/master/assets/filter_gif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Firestore Curd

<a href="https://github.com/whatsupcoders/Flutter-Firestore-CRUD" > <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Firestore-CRUD/blob/master/assets/Screenshot_1555008954.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Firestore-CRUD/blob/master/assets/Screenshot_1555008994.png" width="200"/> </td> </tr> </table> </div> </a>

Flutter FutureBuilder

<a href="https://github.com/whatsupcoders/Flutter-FutureBuilder" > <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FutureBuilder/blob/master/assets/Screenshot_1561598511.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FutureBuilder/blob/master/assets/Screenshot_1561598520.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-FutureBuilder/blob/master/assets/flutter_json_gif.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter CustomPaint Widget

<a href="https://github.com/whatsupcoders/FlutterCustompaintWidget"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterCustompaintWidget/blob/master/assets/Screenshot_1559101852.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterCustompaintWidget/blob/master/assets/Screenshot_1559101868.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterCustompaintWidget/blob/master/assets/custompaint.gif" width="200" /> </td> </tr> </table> </div> </a>

Flutter Keys

<a href="https://github.com/whatsupcoders/FlutterKeys"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterKeys/blob/master/assets/Dismissible.gif" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterKeys/blob/master/assets/Screenshot_1559080544.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterKeys/blob/master/assets/word.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter AnimatedCharts

<a href="https://github.com/whatsupcoders/FlutterAnimatedCharts"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterAnimatedCharts/blob/master/assets/Screenshot_1559363591.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterAnimatedCharts/blob/master/assets/Screenshot_1559363135.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterAnimatedCharts/blob/master/assets/Screenshot_1559363122.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterAnimatedCharts/blob/master/assets/animatedcharts.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Inherited Widget

<a href="https://github.com/whatsupcoders/FlutterInheritedWidget"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterInheritedWidget/blob/master/assets/Screenshot_1559623026.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterInheritedWidget/blob/master/assets/Screenshot_1559623021.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterInheritedWidget/blob/master/assets/Screenshot_1559623033.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/FlutterInheritedWidget/blob/master/assets/inherited.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Wrap Widget

<a href="https://github.com/whatsupcoders/Flutter-Wrap"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Wrap/blob/master/assets/Flutter%20Wrap.png" width="600"/> </td> </tr> </table> </div> </a>

Flutter ImageUpload

<a href="https://github.com/whatsupcoders/Flutter-ImageUpload"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-ImageUpload/blob/master/assets/Screenshot_1560141615.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-ImageUpload/blob/master/assets/Screenshot_1560142436.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-ImageUpload/blob/master/assets/imageupload.gif" width="200"/> </td> </tr> </table> </div> </a>

Flutter Staggered Grid View

<a href="https://github.com/whatsupcoders/Flutter-Staggered-GridView"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Staggered-GridView/blob/master/assets/Screenshot_1561153266.png" width="200"/> </td> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Staggered-GridView/blob/master/assets/Screenshot_1561153288.png" width="200"/> </td> </tr> </table> </div> </a>

flutter_bezier_app

<a href="https://github.com/whatsupcoders/Flutter-Bezier-App"> <div style="text-align: center"> <table> <tr> <td style="text-align: center"> <img src="https://github.com/whatsupcoders/Flutter-Bezier-App/blob/master/assets/Flutter%20Bezier.png" width="600"/> </td> </tr> </table> </div> </a>

Contributors

Whatsupcoder <br>

<!-- Please don't remove this: Grab your social icons from https://github.com/carlsednaoui/gitsocial -->

FOLLOW ME HERE: </br> watch <a href="https://www.youtube.com/c/whatsupcoders"> Whatsupcoders</a> </br> facebook <a href="https://www.facebook.com/whatsupcoders">  Whatsupcoders</a></br> Twitter Follow </br>

Getting Started

For help getting started with Flutter, view our online documentation.