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

Last update: Dec 18, 2022

Overview

Flutter UI Templates

Welcome Contributors 👋

The Robotics Forum always encourages new ideas.

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

Open Source Program 📌

This project is a part of following Open Source Programs

Comments

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)
HSOC22 HSOC22-Level-2
opened by Pavan49719 20
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)
HSOC22 HSOC22-Level-3
opened by Pavan49719 6
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)
HSOC22 HSOC22-Level-3
opened by Pavan49719 6
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/
good first issue HSOC22-Level-1 HSOC22
opened by Pavan49719 6
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)
HSOC22 HSOC22-Level-2
opened by Pavan49719 5
#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.
HSOC22 HSOC22-Level-2

opened by khushimarothi 5
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)
HSOC22 HSOC22-Level-2
opened by Pavan49719 5
Registration Page - II

Create registration page - II with the following features:

Folder Structure: flutter-ui-templates/projects/canteen_app/lib/

Figma Template Link: https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=56%3A240 (iPhone 13 / 13 Pro - 10) https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=56%3A305 (iPhone 13 / 13 Pro - 11)
HSOC22 HSOC22-Level-3

opened by SiddhantPawar03 4
Dealer Screen 2
Create a Dealer screen

Background color code: EEEEEE

Folder Structure: projects/vegetable_app/lib/screens/

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

Figma template
HSOC22 HSOC22-Level-2
opened by Pavan49719 4
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)
HSOC22 HSOC22-Level-2
opened by Pavan49719 4
Registration Screen
Create a Registration screen

Can use this package

Location should be in coordinates format

Folder Structure: projects/ev_stations/lib/screens/registration/registration.dart

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

Figma template (must follow)
HSOC22 HSOC22-Level-3
opened by Pavan49719 4
Menu Screen

Create a menu screen with the following features:

Folder Structure: flutter-ui-templates/projects/canteen_app/lib/

Figma Template Link: https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=60%3A25 (iPhone 13 / 13 Pro - 18)
HSOC22 HSOC22-Level-3

opened by SiddhantPawar03 2
Order Notification

Create an ordered confirmed with the following features:

Folder Structure: flutter-ui-templates/projects/canteen_app/lib/

Figma Template Link: https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=57%3A3138 (iPhone 13 / 13 Pro - 17) https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=62%3A1837 (iPhone 13 / 13 Pro - 21)
HSOC22 HSOC22-Level-2

opened by SiddhantPawar03 2
Success Page

Create a success screen with the following features:

Folder Structure: flutter-ui-templates/projects/canteen_app/lib/

Figma Template Link: https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=56%3A744 (iPhone 13 / 13 Pro - 13)
HSOC22-Level-1 HSOC22

opened by SiddhantPawar03 0
Splash Screen

Create an attractive splash screen with the following features:

Folder Structure: flutter-ui-templates/projects/canteen_app/lib/

Figma Template Link: https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=14%3A493 (iPhone 13 / 13 Pro - 3) https://www.figma.com/file/4lgs6uG2ZI0e7g2I0uCPuE/Student-Mess-Management-System-(Copy)?node-id=14%3A691 (iPhone 13 / 13 Pro - 4)
HSOC22 HSOC22-Level-2

opened by SiddhantPawar03 2
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/
good first issue HSOC22 HSOC22-Level-2
opened by Pavan49719 5

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

Related tags

Overview

Flutter UI Templates

Welcome Contributors 👋

Aim 🎯

Objectives 💡

Contact Us ✉️

Project Maintainers 😃

Pavan Bhadane

Siddhant Pawar

Contributing Guidelines 📋

Organization

Open Source Program 📌

This project is a part of following Open Source Programs

Comments

Owner

The Robotics Forum, VIT Pune

A platform for car sharing where users can book any car that suits their needs and wants for their intended journey, from the closest hosts in the community.

Dictionary Flutter Application is made with Flutter and Supabase which allows user to search words and fetch the meaning. End users can save use the app as guest for every single session or they can authenticate with the app and can save the words for later use.

Atlas is a Blogging app made using Flutter and Firebase. Users can register on the app, start creating blog posts about almost anything that comes to their mind. Users can also search for other people present on the app, and the content that they have posted.

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 blogging application where users can publish their blogs and articles and can connect with other authors, developed using Flutter and Firebase.

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

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

Encode App-Dev is a open source project which contains different projects of Application development, Android development, IOS development, Flutter, Kotlin, Dart, Java, Swift etc.

This is a project done for Current Trends in Software Engineering (CTSE) module. The developed mobile application is a Battery state management application which monitors and controls how other applications consumes battery. Flutter and Dart are used for mobile application development.

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

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. 🍻🍻

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

It is a Mobile Application built with Flutter to help Instructors reach their students with the material needed for their course (Videos, PDFs, Exams)

Fake Firebase Performance for use during Flutter unit & widget tests.

A Flutter app developed during classroom lessons in the Mobile & Gaming 2021/2023 course

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

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

This is a simple mobile application which calculates the person expenses during each week and tracks up where he spend his money!

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