Building An Android Studio App For QR Code Collecting
TAGS: software; Android Studio; Android; smartphone; Google Firebase; Open Street Maps; GitHub
Why I Did This
Some of my engineering courses taught me about some fundamental concepts of software
engineering (through an object-oriented style using the Java language); In doing this, I was
also guided on how to use Android Studio, a standard application for developing Android
based apps using the Java language.
Here I will go over the application my team and I built called QR Hunter, an app for
translating any QR or bar codes you find with your smartphone camera.
Our app has five main features:
camera code capture; map navigation; code library
review; scoreboard review; and profile review.
Design Walkthrough
Parts: Android Studio; Google Firebase; Open Street Maps; GitHub; Android smartphone
For our course objectives we were tasked with building an app that basically acts a code
collection game where you can camera scan any QR/bar code to get uniquely generated
‘monsters’ with unique names, pictures, and point values (kind of like Pokemon Go); you can
compare/compete against other players to find the most QR codes, points, or highest code
values.
When building the app our software requirements were to build functions that that allows a
user to:
- create personal profiles (that I can autologin and log out);
- see my profile and other’s profiles;
- add QR and bar codes to that profile via camera;
- see uniquely generated names, pictures, and points from adding those codes (they are
determined via inspecting the SHA-256 hash generated from the code’s text values);
- see pins of other sighted codes on a graphic map (we used Open Street Maps API);
- comment on yours and other’s codes;
- search profile codes based on keywords and/or regions;
- see the score rankings of mine and other’s codes;
…add other functionality features!
(If you want to see all the requirements, you can navigate to the GitHub wiki ‘User
Stories’:
https://github.com/CMPUT301W23T03/IHuntWithJavalins/wiki/User-Stories
and to the ‘Storyboard’:
https://github.com/CMPUT301W23T03/IHuntWithJavalins/wiki/User-Interface-Mockups-and-Storyboard-Sequences#storyboard-use-case-sequence-diagrams
)
Here's an example item with a bar code.
The app can use the phone camera to scan the barcode
(I dont have it focused on
the bar code because it would have automatically switched the app view).
The is the generated monster with name, picture, and point value.
A view of the Open Street Map to see nearby codes registered by others.
A view of a user's code library with all they have collected.
A user can make comment's on their codes (for others, who have the same code, to see).
We can view everyone's scores/placings and the codes they collected.
The user has a dedicated profile page where they can view their own score placings.
Lessons Learned and Future Changes
Android Studio is pretty cool. I remember about a year before building this that I tried to make an app with Android Studio (not knowing anything about Java) and it was too complicated for me. Now, it’s actually quite a handy tool to use (and I find the Java language very appetizing compared to the other main ones).Google Firebase works great with Java! This project was my introduction to using firebase as a database (for the profiles and saving any pictures). It is quite handy to use as the documentation for setting up push and pull functions are very straightforward. If you know very little about database and are going to do something with Java, then I recommend you try it.
Open Street Maps is a free alternative to Google’s. Since we were on a team testing an app that could (if programmed incorrectly) make the mistake of constantly pulling map data, we didn’t want to risk setting up a paid Google Maps account that would accidently run out of credits over a short time. Instead, we used a free map API called Open Street Maps; that was slightly more difficult to setup (because of the small amount of documentation) but it worked out in the end; use this service if you have the same fear of cost.
It needs graphics that pop. Even though I’m a fan of the app’s yellow and black color scheme of the app, it needs some more pop with the colors; it could be updated to be more like Pokemon Go’s color palette (for example).
The layout of our firebase database's document hierarchy.
An example view of Pokemon Go's color palette.
This is an fantastic 'advertisement' video that my other teams members made to present to our teacher.
References
GitHub project: https://github.com/CMPUT301W23T03/IHuntWithJavalins
Android Studio: https://developer.android.com/studio
Google Firebase: https://firebase.google.com/
Open Street Maps for Android Studio: https://github.com/osmdroid/osmdroid
GitHub wiki ‘User Stories’:
https://github.com/CMPUT301W23T03/IHuntWithJavalins/wiki/User-Stories
GitHub wiki ‘Storyboard’:
https://github.com/CMPUT301W23T03/IHuntWithJavalins/wiki/User-Interface-Mockups-and-Storyboard-Sequences#storyboard-use-case-sequence-diagrams
Pokemon Go: https://pokemongolive.com/