End-to-end mobile app templates that other developers can use during their Flutter development journey.

Last update: Aug 6, 2022

Flutter UI Templates

Welcome Contributors πŸ‘‹

The Robotics Forum always encourages new ideas.

Open Source Love svg1 PRs Welcome Visitors GitHub forks GitHub Repo stars GitHub last commit

GitHub issues GitHub closed issues GitHub pull requests GitHub closed pull requests

Aim 🎯

Main aim of this repository is to make things faster and convenient for all the flutter developers who just want to save their time in their flutter development. This repository consists of all the development widgets that are being commonly used while coding end to end mobile screens in flutter. The goal is to save your time by providing the complete code snippet which follows standard dart conventions with a fully responsive and interactive design of all the components that you may use in your development journey. At the later stage, the project is planned to be converted into a library and packages so that the components created can directly be used by importing and calling through classes.

Objectives πŸ’‘

  • Creating end-to-end mobile app templates.
  • Refinement of pre-existing UI.
  • Work on interactions and effects/animations.

Contact Us βœ‰οΈ

Feel free to get in touch with us and join our discussion for updates.

Project Maintainers πŸ˜ƒ


Pavan Bhadane



Siddhant Pawar


Contributing Guidelines πŸ“‹

Click here

Organization

image

Open Source Program πŸ“Œ

This project is a part of following Open Source Programs

logo

GitHub

https://github.com/The-Robotics-Forum/flutter-ui-templates
Comments
  • 1. Success Screen

    Create a success screen that has

    • Background colour code: 454545
    • Login button colour code: 20BCDE

    Folder Structure: projects/ev_stations/lib/screens/users/success.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-21 19:51
  • 2. Registration Screen

    Create a Registration screen

    • Use geolocator package for fetching the coordinates
    • Background colour code: E5E5E5
    • button colour code: 20BCDE

    Folder Structure: projects/vegetable_app/lib/screens/register.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-29 17:31
  • 3. Charging Station Screen

    Create a charging station screen

    • Background colour code: 454545
    • button colour code: 20BCDE

    Folder Structure: projects/ev_stations/lib/screens/users/charging.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-21 19:31
  • 4. Splash screen

    Create an attractive splash screen with the following features:

    • Organization logo and name
    • Screen duration: 3 sec

    Follow the Guidelines and code of conduct when your push changes.

    Folder Structure: packages/splash_screen/

    Reviewed by Pavan49719 at 2022-07-14 16:55
  • 5. Login Screen

    Create a Login screen

    • Background colour code: EEEEEE
    • button colour code: 20BCDE

    Folder Structure: projects/vegetable_app/lib/screens/login.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-29 17:27
  • 6. #75 resolved

    I have updated the readme by adding the badges , also added a table for project maintainers, a contributors section and some emojis that will catch reader eyes. Tried to solved #75 issue. Hope you like the changes and any kind of remarks or changes are welcomed. also your repo is not having MIT license so kindly add it otherwise the badge of ""License" will stay showing not specified.

    Reviewed by khushimarothi at 2022-07-28 12:48
  • 7. Charging Screen

    Create a charging screen

    • Circular progress bar should be updated dynamically
    • Background colour code: 7D7D7D
    • Login button colour code: 20BCDE

    Folder Structure: projects/ev_stations/lib/screens/users/charging.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-21 19:48
  • 8. Vegetable Information Screen

    Create a Vegetable information screen

    • Background colour code: EEEEEE
    • button colour code: 20BCDE

    Folder Structure: projects/vegetable_app/lib/screens/vege_info.dart

    Follow the Guidelines and code of conduct when you push changes.

    Figma template (must follow)

    Reviewed by Pavan49719 at 2022-07-29 17:50
  • 9. Registration Screen

    Reviewed by Pavan49719 at 2022-07-28 18:23
  • 10. Onboarding Screen

    Create an onboarding screen

    • 3 sub-screens should be there before the login screen
    • Add them after the Splash screen
    • Add an attractive animation/transitions between each screen

    Follow the Guidelines and code of conduct when you push changes.

    Folder Structure: packages/onboarding/ (Create this folder)

    Reviewed by Pavan49719 at 2022-07-17 14:53
  • 11. Registration Screen

    Registration Screen


    Closes: #84

    • [x] HSoC Participant
    • [x] Contributor

    Changes I made

    Added Registration Screen for vegetable app

    Type of change

    What sort of change have you made:

    • [ ] Bug fix (non-breaking change which fixes an issue)
    • [x] New feature (non-breaking change which adds functionality)
    • [x] Code style update (formatting, local variables)
    • [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
    • [ ] This change requires a documentation update

    Testing?

    I have enclosed the Screenshot of the template.

    Screenshot_1659181638

    Checklist:

    • [x] My code follows the guidelines of this project.
    • [x] I have performed a self-review of my own code.
    • [x] I have commented my code, particularly wherever it was hard to understand.
    • [ ] I have made corresponding changes to the documentation.
    • [ ] My changes generate no new warnings.
    • [ ] I have added tests that prove my fix is effective or that my feature works.
    • [x] Any dependent changes have been merged and published in downstream modules.
    Reviewed by Shreyas-Waghchaure at 2022-07-30 11:53
  • 12. Side Drawer

    Side Drawer


    Closes: #101

    • [x] HSoC Participant
    • [x] Contributor

    Changes I made

    Added Side Drawer Screen

    Type of change

    What sort of change have you made:

    • [ ] Bug fix (non-breaking change which fixes an issue)
    • [x] New feature (non-breaking change which adds functionality)
    • [x] Code style update (formatting, local variables)
    • [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
    • [ ] This change requires a documentation update

    Testing?

    I have enclosed the Screenshot of the template. Screenshot_1660198197

    Checklist:

    • [x] My code follows the guidelines of this project.
    • [x] I have performed a self-review of my own code.
    • [x] I have commented my code, particularly wherever it was hard to understand.
    • [ ] I have made corresponding changes to the documentation.
    • [ ] My changes generate no new warnings.
    • [ ] I have added tests that prove my fix is effective or that my feature works.
    • [x] Any dependent changes have been merged and published in downstream modules.
    Reviewed by Shreyas-Waghchaure at 2022-08-11 06:19
  • 13. Cluster Graph

    Cluster Graph


    Closes: #97

    • [x] HSoC Participant
    • [x] Contributor

    Changes I made

    Added Cluster Graph Screen

    Type of change

    What sort of change have you made:

    • [ ] Bug fix (non-breaking change which fixes an issue)
    • [x] New feature (non-breaking change which adds functionality)
    • [x] Code style update (formatting, local variables)
    • [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
    • [ ] This change requires a documentation update

    Testing?

    I have enclosed the Screenshot of the template. Screenshot_1660140846

    Checklist:

    • [x] My code follows the guidelines of this project.
    • [x] I have performed a self-review of my own code.
    • [x] I have commented my code, particularly wherever it was hard to understand.
    • [ ] I have made corresponding changes to the documentation.
    • [ ] My changes generate no new warnings.
    • [ ] I have added tests that prove my fix is effective or that my feature works.
    • [x] Any dependent changes have been merged and published in downstream modules.
    Reviewed by Shreyas-Waghchaure at 2022-08-10 14:17
  • 14. Dealer Screen 2

    Reviewed by Pavan49719 at 2022-08-06 19:06
  • 15. Side Drawer

    Reviewed by Pavan49719 at 2022-08-06 18:53
  • 16. Cluster Graph

    Create a Cluster screen

    • Background color code: EEEEEE
    • Hardcode numbers for a cluster No need to do exactly like a UI given. Just create a map screen with a cluster(density) .

    Folder Structure: projects/vegetable_app/lib/screens/

    Follow the Guidelines and code of conduct when you push changes.

    Figma template

    Reviewed by Pavan49719 at 2022-08-06 18:34
  • 17. Null check in login page

    Add a null check condition for email and password

    • If the email or password is null then pop up a snack bar with the proper message
    • If email and password are not null, then only the login button should be visible.

    Follow the Guidelines and code of conduct when you push changes.

    Folder Structure: projects/templates/lib/packages/login_screen/

    Reviewed by Pavan49719 at 2022-07-19 20:26

Related

Academic master is E-learning app where students can share their doubts wiith their peers they can chat and also they can find their notes
Academic master is E-learning app where students can share their doubts wiith their peers they can chat and also they can find their notes

Academic Master is E-learning App. Features:- 1) You can post real Post query in Images and video formates. 2) We will Provide notes,books and previou

Jun 30, 2022
Appwrite is a secure end-to-end backend server for Web, Mobile, and Flutter developers that is packaged as a set of Docker containers for easy deployment πŸš€
Appwrite is a secure end-to-end backend server for Web, Mobile, and Flutter developers that is packaged as a set of Docker containers for easy deployment πŸš€

A complete backend solution for your [Flutter / Vue / Angular / React / iOS / Android / *ANY OTHER*] app Appwrite 0.12 has been released! Learn what's

Aug 17, 2022
Nebula makes your Flutter development journey easier by providing helper widgets, utilities and abstractions.

Nebula makes your Flutter development journey easier by providing helper widgets, utilities and abstractions.

Apr 21, 2022
continue to my flutter journey here's the comeback repo , lets see what i will end up making

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

May 19, 2021
Breathe is a mental health blogging app where users can join communities of doctors and other users from around the world and both share their problems as well as lend a ear to and help others
Breathe is a mental health blogging app where users can join communities of doctors and other users from around the world and both share their problems as well as lend a ear to and help others

?????????????? ?????????????? In a condensed, suffocating society you can feel closed off, when you can't process your emotions and are going through

May 16, 2022
Code Snippets of highly interactive Flutter Templates that can be implemented in a Native Flutter App.
Code Snippets of highly interactive Flutter Templates that can be implemented in a Native Flutter App.

Native Frontend Flutter About the Repository We are on a mission to make things easy and convenient for all the users who just want to save their time

Aug 14, 2022
A TabBarController that is easy to use for flutter developers. πŸ₯° It supports various styles of page navigation, and you can also use it to customize your favorite styles. 🍻🍻
A TabBarController that is easy to use for flutter developers. πŸ₯° It supports various styles of page navigation, and you can also use it to customize your favorite styles. 🍻🍻

easy_tab_controller A user-friendly TabBarController widget for flutter developer. Getting Started This project is a starting point for a Flutter plug

May 26, 2022
Fake Firebase Performance for use during Flutter unit & widget tests.

Fake Firebase Performance Fakes to write unit tests for apps using Firebase Performance monitoring. Instantiate a FakeFirebasePerformance, then pass i

Apr 16, 2022
Production-grade project developed during the Reso Coder Academy Flutter Bootcamp: It's a mobile Github repository viewer

RepoStar - GitHub Starred Repository Manager Production-grade project developed during the Reso Coder Academy Flutter Bootcamp. It's a mobile Github s

Aug 3, 2022
Collection of cool Layouts built with Flutter to Inspire Other UI developers and explore the possibilities of Flutter.
Collection of cool Layouts built with Flutter to Inspire Other UI developers and explore the possibilities of Flutter.

Awesome_Flutter_Layouts Would you like to Contribute your Designs? Please refer the Contribution guidelines before you dive In Need help? or Looks Som

Aug 4, 2022
DEVS: Developer Board and Jobs Listing | For Developers, By Developers
DEVS: Developer Board and Jobs Listing | For Developers, By Developers

devs Setup Currently, this DEVS project is using the master channel of the Flutter SDK. TODO: Migrate to beta Clone the project git clone https://gith

Apr 16, 2022
A Huge Collection of Flutter App templates
A Huge Collection of Flutter App templates

Awesome Flutter Templates A Collection of Flutter Application templates. Flutter is Google’s UI toolkit for building beautiful, natively compiled appl

Aug 6, 2022
Flutter Multi-platform allows developers to unleash their app to run on the wide variety of different platforms with little or no change.
Flutter Multi-platform allows developers to unleash their app to run on the wide variety of different platforms with little or no change.

Flutter Multi-platform sample Flutter Multi-platform allows developers to unleash their app to run on the wide variety of different platforms with lit

Apr 26, 2022
Flutter Developers may add themselves to this app for the purpose of showcasing their work
Flutter Developers may add themselves to this app for the purpose of showcasing their work

Flutter Developers may add themselves to this app for the purpose of showcasing their work

Jun 14, 2022
Useful Flutter UI Templates
Useful Flutter UI Templates

Flutter UI Templates Useful Flutter UI Templates App Main Page Sign In Sign Up Splash Screen Template Type Status Sign In OK Sign Up OK Splash Screen

Oct 20, 2021