QuizApp - A quiz app with decent questions, minimalistic UI and a dash of tangy randomness

Overview

QuizApp

  • A quiz app with Decent questions, Minimalistic UI and a dash of Tangy Randomness ;D

Foreword

  • This is my First Flutter project that I made for my CS50x Final Project. Spending just about 12hrs and being able to make a full-fledged app that works on Android and IOS is a possibility that I still stand astonished by, all thanks to the immense potential of Flutter that empowered me to do so!

  • The app in itself is Fairly Simple, yet it has an element of randomness to it that intrigues the user, giving them something new to always look forward to ;D

Why I chose Flutter

Honestly, because it makes coding for Apps so simple!

  • We don't need to know Objective C/Swift for IOS, or Java for Android!
  • Just one single app that can run on both the platforms!
  • It is managed by Google so no scope for worry!
  • Because I wish to Digitalize my father's business by gifting him an app, hence my journey as an App developer! :D

What Inspired Me to make a QuizApp.

  • The Udemy course that I am following to learn Dart & Flutter by Maximilian Schwarzmüller.
  • I highly recommend this course for anyone willing to make efficient apps with relative ease! :D
  • Link to the Course

My Experience

  • It's been a Smooth Ride as I followed parts of the course tutorial to increase my knowledge about Flutter, however parts like the FloatingActionButton at the bottom were something that I had to look for myself ;p
  • Despite the time and efforts it took to implement these features, they are what make our QuizApp stand out and offer something unique to our user!
  • Now even tho the Flutter Docs are super aesthetic, it was quite hard to wrap my mind around the multi-child layout widgets as I looked for something to be the base for the UI 😅
  • Alas I did manage to work my way around with a Stack Widget, similar to how 'sticking around the barber's shop long enough does get one the haircut' ;p

About The App

  • The Main files in quiz_app/lib are as follows:

main.dart

  • The main executable file that contains the head QuizApp class, a stateful widget, responsible for rendering the main UI for the app.
  • I have used the MaterialApp library provided by Flutter to source the Base structure and added my special touch to it! :D
  • It has the _questions list of maps with all the questions and their answers (another list ;p) being the individual map entries.
  • It also holds the _changeQuestion() and _reset() functions that do as their name suggests ;p
  • Also Responsible for the FloatingActionButton at the bottom-right corner :D

It's always better to have More Widgets, than less, for they make it easier to manage and look at the Code!

quiz.dart

  • Holds the Quiz widget, a stateless one; meaning it doesn't update with the screen but is rather static after instantiation.
  • It takes in two named arguments:
    1. the data, with the questionText and list of answers; and.
    2. the callback function
  • It uses two other widgets I made - Question and Answer, to then render the specific Trivia! :D

question.dart

  • Holds the stateless widget, Question.
  • It takes in the questionText, i.e., the Question.
  • This simply outputs a Container widget holding a Text widget with the questionText and some Trivial Styling ;p

answer.dart

  • Holds the stateless widget, Answer.
  • It takes the answerText and the callBack function handleAnswer.
  • Generates and returns a custom-styled ElevatedButton Widget as an Answer choice! :D

result.dart

  • Holds the Result widget (Stateless), that is rendered by main.dart upon completion of the Quiz.
  • Takes in the score parameter and the function callBack reset.
  • Responsible for the Play Again widget (ElevatedButton) and linking it to reset.
  • Returns a Container widget with the ElevatedButton and the Text widgets showing the result and the score.
  • Also returns a FloatingActionButton widget with a random color to reward the Player for completion ;)

Testing Status

  • The app has been tested only on android for I don't have a Mac unfortunately! 😅
  • It only supports vertical orientation for now, however I plan to make it responsive by changing the base Widget to a ListView soon! :)
  • It has been tested on Android versions 8+, it should work smoothly on prior versions too, unless there's a significant cut out in memory.

How to Try it out

Android

  • Install and Run the app-debug.apk in quiz_app/build/app/outputs/apk/debug/app-debug.apk

IOS

With courage in our hearts and ambition in our thought, we can do anything!

  • Import the project into X-code.
  • Run the app on a VM if you wish OR connect you IOS device and run it on it! :D

Ideas that may be implemented for Improvement

  • Incorporate User-Input and show the user their Name with the result, etc.
  • Use an Online source to get Fresh Questions; increase the number and broaden the variety of Questions.
  • Utilize storage to store liked color codes, high score, etc.
  • Allow the User to Share their Score or Color via native sharing options.

I would love to collaborate with fellow Developers willing to improve their App Development Skills and Learn together! <3 ;D

Final Words

  • A Huge Thanks to CS50 for giving me this opportunity to learn practical Computer Science from one of the best faculties in the world! <3 :)
  • And, as David J Malan would say, this was CS50!
You might also like...

This is a mobile application that goals to build a quiz about programming subjects writter with Flutter.

This is a mobile application that goals to build a quiz about programming subjects writter with Flutter.

❓ DevQuiz A mobile application being built with NLW5 (an event from Rockeatseat - https://app.rocketseat.com.br/). This application goals to build a q

Dec 23, 2022

This is a shop-app you can see the products and With prices and knowing if there are discounts and adding your favorite products to the favorite products page

This is a shop-app you can see the products and With prices and knowing if there are discounts and adding your favorite products to the favorite products page, you can search for a specific product and also modify personal information from the settings , I made it using REST APIs by using (Dio packedge) , (shared Preference) and state management (Bloc/cubit

Oct 27, 2022

A flutter app for a wordpress websites with clean and elegant design. This app is available in free and pro version. You can choose to use the one you need.

A flutter app for a wordpress websites with clean and elegant design. This app is available in free and pro version. You can choose to use the one you need.

📌 Get Flutter for Wordpress Flutter for wordpress is currently available in free and pro version: Flutter for Wordpress Flutter for Wordpress Pro Bea

Dec 13, 2022

Chat-App - A Chat App with flutter and Firebase and Video Calling using WebRTC

chat_app A chat app with flutter and firebase with image message support and vid

Nov 23, 2022

FileManager is a wonderful widget that allows you to manage files and folders, pick files and folders, and do a lot more. Designed to feel like part of the Flutter framework.

FileManager is a wonderful widget that allows you to manage files and folders, pick files and folders, and do a lot more. Designed to feel like part of the Flutter framework.

File Manager FileManager is a wonderful widget that allows you to manage files and folders, pick files and folders, and do a lot more. Designed to fee

Dec 30, 2022

Flutter ShopApp, you can see products and their prices, categories and their products, search for a product, add to favorite, add to cart, sign in and sign up.

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

Aug 7, 2022

A mobile image uploader in which you can upload image to your personal gallery from either your camera or mobile gallery and it can detect your current geographic location and address using firebase firestore and storage.

Image Uploader In Flutter About It is an Image Uploader gallery which tracks your address from which you're uploading using Flutter and Image picker.

Dec 20, 2022
Owner
null
QuizApp Built with Flutter & Firebase

QuizApp Generated by the Very Good CLI ?? Getting Started ?? This project contains 2 flavors: development production To run the desired flavor either

Fireship 72 Dec 16, 2022
A minimalistic chat app.

unitext 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

M. K. Bashar 1 Feb 22, 2022
A fast, minimalistic backend framework for Dart 🎯

A fast, minimalistic backend framework for Dart ?? Developed with ?? by Very Good Ventures ?? Experimental ?? Dart Frog is an experimental project und

Very Good Open Source 1.1k Jan 6, 2023
Flutter interview questions with answers

FIQ - Flutter interview questions with answers How to use this project? This project contains questions and answers to most frequent questions asked i

Jelena Lecic 12 Nov 18, 2021
This repo contains a list of helpful Flutter related questions you can use to interview potential candidates.

Flutter Interview Questions This file contains a number of Flutter interview questions. Note: Keep in mind that many of these questions are open-ended

Whatsupcoders 325 Dec 2, 2022
Dot-Net-Inverview-Bot - Dot net interview questions answering by bot built with flutter

Dot Net Interview question Answering Bot Dot net interview questions answering b

Maddi Mahesh 5 Feb 2, 2022
Quiz App is cross-platform mobile app, that allows you to test your knowledge on various technologies through quizzes. It's built with Flutter & Dart

Quiz App is cross-platform mobile app, that allows you to test your knowledge on various technologies through quizzes. It's built with Flutter & Dart

Régis 6 Sep 19, 2022
A quiz app built using Flutter

Quiz-App A quiz app built using Flutter. It currently covers programming topics such as (i.e. TypeScript, Angular, Firebase...) and others. Although t

Akash Dubey 63 Dec 18, 2022
Repository for flutter app of Apti-Che ( quiz conducting platform ) for AICHE NIT Rourkela

DSC NIT Rourkela Project developed and maintained by DSC NIT Rourkela Contributing Our Slack Community: Slack Invite Contributions are welcome ???? Pl

DSC NIT Rourkela 10 Nov 8, 2022
Quiz App - A Flutter project to take exam from different subjects

A Flutter project to take exam from different subjects. You can assign date, time and duration of the exam.

Aryanka Pawar 1 Sep 23, 2022