A very sexy Flutter UI template✨

Last update: Jun 20, 2022

Dashboard Reborn

Dashboard Reborn

Stars Forks Build Issues License

A very sexy app template with great focus on UI, design and animations. It is written entirely in Dart and built with Flutter, so it can be compiled to run (very smoothly) on Android, iOS and all other platforms supported by Flutter!

Note: I am not a UI designer by any means. All the animations, colors, layouts, etc. have been made according to what I thought looked "nice and cool" 🙃

Play Store

Screenshots

Dashboard Reborn Dashboard Reborn Dashboard Reborn Dashboard Reborn Dashboard Reborn

UI Demos

Dashboard Reborn Dashboard Reborn Dashboard Reborn

Building

To build and run the app on your device, do the following:

  • Install Flutter by following the instructions on their website.
  • Clone this repo to your local machine using git clone https://github.com/urmilshroff/dashboard_reborn.git.
  • Connect your device/emulator and run the app using flutter run in the root of the project directory.

Note: you can also run it in release mode using flutter run --release to experience the beautiful animations at their best.

Usage

There are three main pages in the app:

  • About Page: a clean, neutral cards layout mostly consisting of text.
  • Material++ Page: a lively, heavily animated page consisting of bold Material Design colors and animations.
  • Gradients Page: a beautiful paginated cards layout complete with a colorful gradients theme.

You can use these individual components or all of them together as a template or starting point in your own Flutter app. It's completely free - as in beer and speech!

That said, if you liked this project and found it helpful, kindly fork/star this repo to show your support, and check out some of my other projects. It really helps! 😁

Contributing

Found any bugs? Have any suggestions or code improvements? Submit an issue or fork and send a pull request with your changes. All contributions are more than welcome, and will be merged into master if satisfactory.

Credits

Huge shout out to all the amazing libraries and projects that I've used, without which this app wouldn't have been possible:

Special shout out to Arabi Ishaque for making that dope icon!

And of course, the Flutter framework by Google.

Take a look at the entire list of contributors to see who all have helped with the project directly.

License

This project is licensed under the MIT License - do anything you want with it! See the LICENSE file for details.

GitHub

https://github.com/urmilshroff/dashboard_reborn
Comments
  • 1. About Page scrolling broken

    Describe the bug Scrolling in the About Page is broken. It stays stuck, but the app isn't hung. I don't think I modified this section, so I'm not sure what broke it (used to work in earlier versions).

    Steps to reproduce

    1. Open the About Page
    2. Try to scroll through the content
    3. Nothing happens and it remains stuck

    Expected behavior It should scroll, duh.

    Reviewed by urmilshroff at 2019-09-07 15:18
  • 2. fix(gradle-build): fixes an issue where the android build fails if there is no keystore file

    I noticed the build was failing when trying to run this project in release mode for android as advised in the readme. I also noticed you had this same problem yourself (#7) and it was resolved when you restored your keystore file.

    I added a conditional statement that allows someone that's just cloned the project to be able to run it in release mode (using the default signingConfigs.debug) while still allowing you to use your signed version.

    Love the project by the way! Haven't had much of a chance to play with it yet, but I'd love to offer any help I can.

    Reviewed by stevenviar at 2019-10-19 20:59
  • 3. added hero animations for page titles navigating from home_page, potential fix for #4

    I saw you initially tried to have the titles for the tiles as Hero animations, but because the text is a child of the tile, it wouldn't work. I separated the text from the tile and put them both in a stack, and put the text in an equal size container that's transparent so the InkWell and navigation could be applied.

    My only problem with the way it is now is that the title flies through the tile when navigating back to the home page.

    Let me know your thoughts and if you have any ideas or improvements.

    Reviewed by stevenviar at 2019-11-01 01:25
  • 4. Fix for Hero Bugs

    This PR includes the fix for the yellow(debug esque) "Close" line and fix for the click me button breaking(for a millisecond) on Navigator.pop()

    Reviewed by preetjdp at 2019-10-01 13:47
  • 5. Improvements needed for Material++ page

    Describe the bug There are several bugs and potential improvements to the new Material++ page. For starters, the text has this weird yellow debug-like underline.

    Reviewed by urmilshroff at 2019-09-14 19:25
  • 6. Fix #2 & #3

    Fix #2 by matching the borderRadius property for InkWell with the same value for the Material parent widget. I initially tried to replace everything in builtTile with a simple RaisedButton widget. Which should make the code less cluttered and the render somewhat faster. (one widget instead of 3 !!) But it messed up the colors, white becomes grey, and black is rendered blue ! 😨 We might try using RaisedButton in the future if needed more performance 😅.

    Fix #3. back button should now Close bottom sheet if open, else it will return to home screen.

    Reviewed by ghaith96 at 2019-08-18 16:14
  • 7. Broken animation exiting Material++ view with expanded bottom sheet

    Expected behavior:

    When exiting the view while bottom sheet is expanded, either:

    • the whole view slides to the side (like Gradient Cards section)
    • the bottom sheet collapses and then the exit animation is played

    Alternatively, the back button could collapse the bottom sheet and then on second back, exit the view.

    Actual behavior:

    The card appears from below the bottom sheet, making it look really weird.

    My screen recorder glitched so I don't have the video 😢

    Steps to reproduce:

    1. Open "Material++" view
    2. Expand bottom sheet
    3. Hit back to exit the view.

    My device:

    OnePlus 3T, Android 9.0, Lineage OS 16, build 19.06.2019

    Reviewed by myfrom at 2019-06-21 21:28
  • 8. Ripple expands beyond cards (ignoring border radius)

    Expected behavior:

    Ripple effects get cropped to their parent element, including border radius.

    Actual behavior:

    Ripple effects expand beyond their parent in some cases, that is they ignore border radius of their parent

    Notice how ripple on "About" card has sharp corners:

    My device:

    OnePlus 3T, Android 9.0, Lineage OS 16, build 19.06.2019

    Reviewed by myfrom at 2019-06-21 21:22
  • 9. [ImgBot] Optimize images

    Beep boop. Your images are optimized!

    Your image file size has been reduced by 15% 🎉

    Details

    | File | Before | After | Percent reduction | |:--|:--|:--|:--| | /branding/screener/pixel-xl/1.png | 271.05kb | 215.18kb | 20.61% | | /branding/screener/pixel-xl/5.png | 286.33kb | 235.32kb | 17.82% | | /branding/screener/pixel-xl/4.png | 2,444.97kb | 2,070.26kb | 15.33% | | /branding/screener/pixel-xl/2.png | 197.22kb | 172.59kb | 12.49% | | /branding/screener/pixel-xl/3.png | 397.96kb | 351.28kb | 11.73% | | | | | | | Total : | 3,597.53kb | 3,044.64kb | 15.37% |


    📝docs | :octocat: repo | 🙋issues | 🏅swag | 🏪marketplace

    Reviewed by imgbot[bot] at 2019-12-12 13:32
  • 10. [ImgBot] Optimize images

    Beep boop. Your images are optimized!

    Your image file size has been reduced by 11% 🎉

    Details

    | File | Before | After | Percent reduction | |:--|:--|:--|:--| | /assets/icon/icon-ios.png | 103.76kb | 81.80kb | 21.16% | | /assets/icon/icon-adaptive.png | 75.45kb | 61.08kb | 19.04% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 12.20kb | 10.48kb | 14.10% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 10.81kb | 9.30kb | 13.99% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 9.32kb | 8.02kb | 13.95% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 8.62kb | 7.43kb | 13.81% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 6.49kb | 5.63kb | 13.14% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 6.49kb | 5.63kb | 13.14% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 5.95kb | 5.19kb | 12.79% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 4.10kb | 3.58kb | 12.57% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 4.95kb | 4.37kb | 11.81% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 3.49kb | 3.07kb | 11.80% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 3.66kb | 3.23kb | 11.64% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 3.13kb | 2.81kb | 10.12% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 2.42kb | 2.20kb | 8.81% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 2.55kb | 2.34kb | 8.15% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 218.69kb | 200.96kb | 8.11% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 2.38kb | 2.19kb | 7.89% | | /android/app/src/main/res/drawable-xhdpi/ic_launcher_foreground.png | 12.36kb | 11.61kb | 6.06% | | /android/app/src/main/res/mipmap-xxhdpi/launcher_icon.png | 12.54kb | 11.87kb | 5.34% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 1.94kb | 1.85kb | 4.87% | | /android/app/src/main/res/drawable-hdpi/ic_launcher_foreground.png | 7.85kb | 7.48kb | 4.78% | | /android/app/src/main/res/drawable-xxhdpi/ic_launcher_foreground.png | 27.61kb | 26.33kb | 4.64% | | /android/app/src/main/res/drawable-xxxhdpi/ic_launcher_foreground.png | 46.70kb | 44.58kb | 4.55% | | /android/app/src/main/res/mipmap-xxxhdpi/launcher_icon.png | 20.68kb | 19.84kb | 4.04% | | /android/app/src/main/res/mipmap-xhdpi/launcher_icon.png | 6.41kb | 6.17kb | 3.75% | | /android/app/src/main/res/drawable-mdpi/ic_launcher_foreground.png | 4.32kb | 4.19kb | 3.12% | | /android/app/src/main/res/mipmap-hdpi/launcher_icon.png | 4.34kb | 4.22kb | 2.66% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 1.51kb | 1.47kb | 2.58% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 1.51kb | 1.47kb | 2.58% | | | | | | | Total : | 632.21kb | 560.41kb | 11.36% |


    📝docs | :octocat: repo | 🙋issues | 🏅swag | 🏪marketplace

    Reviewed by imgbot[bot] at 2019-12-10 13:28
  • 11. [ImgBot] Optimize images

    Beep boop. Your images are optimized!

    Your image file size has been reduced by 15% 🎉

    Details

    | File | Before | After | Percent reduction | |:--|:--|:--|:--| | /branding/art/banner.png | 50.49kb | 30.90kb | 38.79% | | /assets/images/profile/urmil.png | 90.98kb | 61.27kb | 32.66% | | /branding/screener/screener_1561033293088.png | 278.09kb | 222.04kb | 20.16% | | /branding/other/google-play-badge.png | 13.63kb | 11.27kb | 17.32% | | /branding/screener/screener_1561033642367.png | 268.74kb | 223.20kb | 16.95% | | /branding/screener/screener_1561033572346.png | 1,895.45kb | 1,591.08kb | 16.06% | | /assets/images/icon/icon-ios.png | 107.04kb | 90.64kb | 15.32% | | /branding/screener/screener_1561033595285.png | 2,034.04kb | 1,724.10kb | 15.24% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 12.49kb | 10.62kb | 15.01% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 14.29kb | 12.17kb | 14.87% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 10.72kb | 9.26kb | 13.61% | | /branding/screener/screener_1561033372508.png | 189.24kb | 163.73kb | 13.48% | | /branding/screener/screener_1561033514495.png | 182.90kb | 158.41kb | 13.39% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 4.06kb | 3.55kb | 12.52% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 7.20kb | 6.31kb | 12.27% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 7.20kb | 6.31kb | 12.27% | | /branding/screener/screener_1561033399521.png | 158.60kb | 139.48kb | 12.05% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 4.71kb | 4.17kb | 11.35% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 3.90kb | 3.46kb | 11.31% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 2.71kb | 2.46kb | 9.33% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 2.81kb | 2.55kb | 9.28% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 232.20kb | 213.23kb | 8.17% | | /assets/images/music/album1.jpg | 90.15kb | 83.49kb | 7.39% | | /android/app/src/main/res/drawable-xxxhdpi/ic_launcher_foreground.png | 95.25kb | 89.45kb | 6.09% | | /android/app/src/main/res/drawable-xxhdpi/ic_launcher_foreground.png | 56.00kb | 52.76kb | 5.77% | | /android/app/src/main/res/mipmap-xxhdpi/launcher_icon.png | 12.54kb | 11.87kb | 5.34% | | /branding/art/icon.png | 123.69kb | 118.04kb | 4.57% | | /assets/images/icon/icon-android.png | 123.69kb | 118.04kb | 4.57% | | /android/app/src/main/res/drawable-hdpi/ic_launcher_foreground.png | 15.23kb | 14.61kb | 4.12% | | /android/app/src/main/res/mipmap-xxxhdpi/launcher_icon.png | 20.68kb | 19.84kb | 4.04% | | /android/app/src/main/res/drawable-xhdpi/ic_launcher_foreground.png | 25.63kb | 24.62kb | 3.94% | | /android/app/src/main/res/mipmap-xhdpi/launcher_icon.png | 6.41kb | 6.17kb | 3.75% | | /android/app/src/main/res/drawable-mdpi/ic_launcher_foreground.png | 7.74kb | 7.45kb | 3.65% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 1.70kb | 1.64kb | 3.45% | | /ios/Runner/Assets.xcassets/AppIcon.appiconset/[email protected] | 1.70kb | 1.64kb | 3.45% | | /android/app/src/main/res/mipmap-hdpi/launcher_icon.png | 4.34kb | 4.22kb | 2.66% | | | | | | | Total : | 6,156.23kb | 5,244.07kb | 14.82% |


    📝docs | :octocat: repo | 🙋issues | 🏅swag | 🏪marketplace

    Reviewed by imgbot[bot] at 2019-12-05 14:45
  • 12. Suggestion: fade card titles instead of blinking

    The text on cards/buttons from main menu changes to different content when each button is clicked (except Gradient Cards section). That transition however happens without any animation, the content just blinks between states. It makes the experience feel a lot less fluid.

    I'd suggest a small cross fade animation between the states, only of the content of the card. That shouldn't be too hard to add and would definitely smooth out the transition between views.

    My device: OnePlus 3T, Android 9.0, Lineage OS 16, build 19.06.2019

    Reviewed by myfrom at 2019-06-21 21:33

Related

A Very Good Flutter Federated Plugin created by the Very Good Ventures Team 🦄
A Very Good Flutter Federated Plugin created by the Very Good Ventures Team 🦄

Very Good Flutter Plugin Developed with ?? by Very Good Ventures ?? A Very Good Flutter Plugin created by the Very Good Ventures Team. Getting Started

Jun 3, 2022
Flutter getx template - A Flutter Template using GetX package for State management, routing and Dependency Injection
Flutter getx template - A Flutter Template using GetX package for State management, routing and Dependency Injection

Flutter GetX Template (GetX, Dio, MVVM) This Flutter Template using GetX package

May 9, 2022
May 22, 2022
HappyNewYearAnimation-using-Flutter - A very delightful Welcome to 2022 with Flutter 🎉🎊🎆

happynewyearapp A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Jan 1, 2022
A Gherkin parsers and runner for Dart and Flutter which is very similar to cucumber

flutter_gherkin A fully featured Gherkin parser and test runner. Works with Flutter and Dart 2. This implementation of the Gherkin tries to follow as

Jun 29, 2022
A very basic manga reader made using flutter and the Mangadex API

Fludex A very basic manga reader made using flutter and mangadex API. It uses the mangadex_library package. A few things to remember The app only supp

Mar 4, 2022
A simple screen that is shown when your app gets crashed instead of the normal crash dialog. It's very similar to the one in Flutter.
A simple screen that is shown when your app gets crashed instead of the normal crash dialog. It's very similar to the one in Flutter.

Red Screen Of Death What A simple screen that is shown when your app gets crashed instead of the normal crash dialog. It's very similar to the one in

May 31, 2022
A new flutter package project which contains lots of beautiful alert dialog that will help you lot to create beautiful awesome alert box very quickly and easily.
A new flutter package project which contains lots of beautiful alert dialog that will help you lot to create beautiful awesome alert box very quickly and easily.

A new flutter package project which contains lots of beautiful alert dialog that will help you lot to create beautiful awesome alert box very quickly and easily.

Jan 8, 2022
A very simple survey app with fluitter.

survey_app A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if th

Dec 13, 2021
With cupertino_setting_control you can create a settings page or a simple form very easy.
With cupertino_setting_control you can create a settings page or a simple form very easy.

Flutter Cupertino Setting Control With cupertino_setting_control you can create a settings page or a simple form very easy. Therefore, cupertino_setti

Mar 28, 2022
It's a very simple COVID-19 Tracker app.
It's a very simple COVID-19 Tracker app.

COVID19 Tracker App It's a dedication to my closest friend who has been tested positive for COVID. Please take care of yourself and your family. Stay

Jun 20, 2022
A very easy-to-use navigation tool/widget for having iOS 13 style stacks.

cupertino_stackview A very easy-to-use navigation tool/widget for having iOS 13 style stacks. It is highly recommended to read the documentation and r

Mar 14, 2022
Kc - A Simple App Solution for Calculation Fraction (Kali) size of a Lehenga. this is very useful for Fashion designers and tailors. Simple UI with best User Experience.

kc A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this is yo

Jan 8, 2022
A Very Flexible Widget that can Implement Material Sheets on all Directions, both modal and persistent, and consequently a Material Navigation Drawer

Flutter_MaterialSheetAndNavigationDrawer If this project helped you reduce developement time or you just want to help me continue making useful tools

Dec 4, 2021
An implementation of the behavioral composition pattern for Flame. Built by Very Good Ventures 🦄
An implementation of the behavioral composition pattern for Flame. Built by Very Good Ventures 🦄

Flame Behaviors Developed with ?? by Very Good Ventures ?? An implementation of the behavioral composition pattern for Flame. Installation ?? flutter

Jun 15, 2022
Flame behaviors used to organically manage the movement of an entity. Built by Very Good Ventures 🦄
Flame behaviors used to organically manage the movement of an entity. Built by Very Good Ventures 🦄

Steering Behaviors Developed with ?? by Very Good Ventures ?? An implementation of steering behaviors for Flame Behaviors. See Steering Behaviors For

Jun 23, 2022
WooCommerce App template that uses Flutter. Integrated to work with WooCommerce stores, connect and create an IOS and Android app from Flutter for IOS and Android
WooCommerce App template that uses Flutter. Integrated to work with WooCommerce stores, connect and create an IOS and Android app from Flutter for IOS and Android

WooCommerce App: Label StoreMax Label StoreMax - v5.3.1 Official WooSignal WooCommerce App About Label StoreMax Label StoreMax is an App Template for

Jun 21, 2022
Now UI Flutter is a fully coded app template built for Flutter which will allow you to create powerful and beautiful e-commerce mobile applications
Now UI Flutter is a fully coded app template built for Flutter which will allow you to create powerful and beautiful e-commerce mobile applications

Now UI Flutter is a fully coded app template built for Flutter which will allow you to create powerful and beautiful e-commerce mobile applications. We have redesigned all the usual components to make it look like our Now UI Design, minimalistic and easy to use.

Apr 27, 2022
Flutter Getx Template

This is source flutter template use getx for statemanagement ☕

May 10, 2022