ContraFlutterKit

Contra Flutter Kit

Flutter application built on top of contra wireframe kit. Thorough this project i will be developing all the screens in flutter and sharing in couple of series post.

<p align="center"> <img src = "screenshots/welcome_screen.png" > </p>

Run and Build

To run the app with few dependencies not having null safety use below command

• flutter run --no-sound-null-safety

To run the web with few dependencies not having null safety use below command

• flutter run -d chrome --no-sound-null-safety

To take apk of the app with few dependencies not having null safety use below command

• flutter build apk --no-sound-null-safety

To take build for the web with few dependencies not having null safety use below command

• flutter build web --no-sound-null-safety

Kits

Contra flutter kit will be having screens developed in all the categories.

• Onboarding
• Login Forms
• Menus
• Dialogs
• Toast
• Chat Screens
• Shopping screens
• Blogs
• Payment Screens
• Alarm, Clock, Weather Screens
• Data Charts
• Map and Location
• Content, Text Details
• Menu And Settings

Screenshots

• Onboarding and Splash screens

<img src = "screenshots/onboard_type_1.jpg" width=220><img src = "screenshots/onboard_type_2.jpg" width=220><img src = "screenshots/onboard_type_3.jpg" width=220> <img src = "screenshots/onboard_type_4.jpg" width=220>

• Login, Verification, Contact Us Forms

<img src = "screenshots/login_type_1.jpg" width=220><img src = "screenshots/login_type_2.jpg" width=220><img src = "screenshots/login_type_3.jpg" width=220><img src = "screenshots/login_type_4.jpg" width=220> <img src = "screenshots/signup_type_1.jpg" width=220><img src = "screenshots/verification_type_1.jpg" width=220><img src = "screenshots/contact_us_type_1.jpg" width=220>

• Chat Screens

<img src = "screenshots/chat_home_page.jpg" width=220><img src = "screenshots/chat_message_page.jpg" width=220><img src = "screenshots/chat_search_page.jpg" width=220>

• Shopping Screen Types

<img src = "screenshots/shopping_screen_one.jpg" width=220><img src = "screenshots/shopping_screen_two.jpg" width=220><img src = "screenshots/shopping_screen_three.jpg" width=220> <img src = "screenshots/shopping_screen_four.jpg" width=220><img src = "screenshots/shopping_screen_five.jpg" width=220><img src = "screenshots/shopping_screen_six.jpg" width=220>

• Blog Screen Types

<img src = "screenshots/blog_type_one.jpg" width=220><img src = "screenshots/blog_type_two.jpg" width=220><img src = "screenshots/blog_type_three.jpg" width=220> <img src = "screenshots/blog_type_four.jpg" width=220><img src = "screenshots/blog_type_five.jpg" width=220>

• Payment Screen Types

<img src = "screenshots/payment_type_one.jpg" width=220><img src = "screenshots/payment_type_two.jpg" width=220><img src = "screenshots/payment_type_three.jpg" width=220> <img src = "screenshots/payment_type_four.jpg" width=220>

• Alarm, Clock, Weather Screens

<img src = "screenshots/alarm_list_page.jpg" width=220><img src = "screenshots/add_alarm_page.jpg" width=220><img src = "screenshots/clock_list_page.jpg" width=220> <img src = "screenshots/weather_list_page.jpg" width=220><img src = "screenshots/add_label_screen.jpg" width=220>

• Data Charts

<img src = "screenshots/bar_chart.jpg" width=220><img src = "screenshots/line_chart.jpg" width=220>

• Map and Location

<img src = "screenshots/location_list_page.jpg" width=220><img src = "screenshots/location_detail.jpg" width=220>

• Content, Text Details

<img src = "screenshots/content_text_one.jpg" width=220><img src = "screenshots/content_text_two.jpg" width=220><img src = "screenshots/content_text_three.jpg" width=220> <img src = "screenshots/content_text_four.jpg" width=220><img src = "screenshots/content_text_five.jpg" width=220><img src = "screenshots/content_text_six.jpg" width=220> <img src = "screenshots/content_text_seven.jpg" width=220><img src = "screenshots/content_text_eight.jpg" width=220><img src = "screenshots/content_text_nine.jpg" width=220> <img src = "screenshots/content_text_ten.jpg" width=220>

• Menu And Settings

<img src = "screenshots/menu_page_one.jpg" width=220><img src = "screenshots/menu_page_two.jpg" width=220><img src = "screenshots/settings_page_one.jpg" width=220> <img src = "screenshots/settings_page_two.jpg" width=220><img src = "screenshots/settings_page_three.jpg" width=220>

Project Created & Maintained By

Sabarinathan

Mobile and Backend Engineer (Android | Flutter | Rails)

<a href="https://play.google.com/store/apps/dev?id=6195209822970290998"><img src="https://github.com/aritraroy/social-icons/blob/master/play-store-icon.png?raw=true" width="60"></a> <a href="https://twitter.com/nathansdev"><img src="https://github.com/aritraroy/social-icons/blob/master/twitter-icon.png?raw=true" width="60"></a> <a href="https://www.linkedin.com/in/sabarinathan-in/"><img src="https://github.com/aritraroy/social-icons/blob/master/linkedin-icon.png?raw=true" width="60"></a> <a href="https://www.facebook.com/sabari.nathan.441"><img src="https://github.com/aritraroy/social-icons/blob/master/facebook-icon.png?raw=true" width="60"></a>

Mentions

• Special thanks to vijay verma for the awesome design kit.
• Link to the wireframe official page Contra wireframe kit

Visitors Count

<img align="left" src = "https://profile-counter.glitch.me/flutter_octo_job_search/count.svg" alt ="Loading">

License

Copyright 2020 Sabarinathan

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.