The Illumination Repairs App

I was inspired by the work/volunteering that I had been doing for Illumination Repairs C.I.C. to attempt to create a contact app and I decided to create it in Flutter so that eventually it would work on both Android and iOS without having to write the whole thing twice – there are pros and cons to this approach which I hope to cover in another post.

I opened up Android Studio on my Development Laptop and set to work….

I first of all I discovered how to create three tabs within the AppBar which would enable me to switch between three pages easily. They were “Home”, “Email” and “Website”. I used the artwork from the Illumination Repairs Instagram posts – cheeky I know but I was hoping that the company would benefit from my efforts so it was justified. The colour scheme that they had chosen was black and white so I felt that I had to keep it as it is part of their “brand” – I would have much rather used a more colourful palate.

The “Home Page”

Here you can clearly see the tabs (set on Home). The artwork is the first page of a video presentation which they created to “tell their story”. The next images are some of the “slides” in the video presentation.

It took me a while to work out how to have a mpg4 run in the app but I succeeded. I will leave a link to my GitHub Repo for this app at the end so you can see how I did it rather than explain here.

Next is the “Email” tab which leads to an email based enquiry form which sends an email to a designated address.

Finally, there is the “Website” tab which has a link to email (blank) but again to a designated email address. I later considered this surplus to requirements because the form on the email tab form was sufficient.

It also has a link to Illumination Repairs Facebook page and the Illumination Repairs website.

The biggest flaw with this app is that for all of the people who approach us for a repair it is a one-off contact – who would download an app just to get one or two things repaired, so it will never go into production in it’s current form. All is not lost – I know a little more about how to embed a video into a Flutter app, I have more of an idea about how to create an email enquiry form in Flutter, I can put links into buttons to webpages and email (the second email code works a bit different to the first) and the links to the webpages including Facebook/Meta can be done several ways – I tried the most common way (according to Stack Overflow) and it didn’t work as it was trying to parse ipv6 addresses and I think that that particular method was best suited to ipv4 addresses and so I found another method much better. I will use what I have learned in other apps and it has opened my horizons to the possibility of other apps.

That link to my GitHub Repository containing the code for this app:-

https://github.com/CullenDevelopment/illumination_repairs
Advertisement

Graduation!!!!

I graduated with Android Basics Nanodegree by Google and through Udacity on the 31st July 2018 – I think that the cut-off date was 20th August 2018 so I was only a few days ahead of schedule. Udacity extended the deadline by a few weeks because I think that there were still quite a few people who were going to miss it! After the extended deadline, the people who had still not completed were given a “preferential rate” in order to complete, which several people took advantage of.

My Certificate.

I was ever so proud as you might expect but then I started to think “now what do I do?” The tutors on the course suggested that we use our new found knowledge to adapt the projects that we had created throughout the course to fit the needs of local shops and businesses in our areas. For me it was a question of confidence and a search for ideas about how I was going to proceed. More about that next time….

The Inventory App.

This was the final project that I studied for and created on my Android Basics Nanodegree by Google and it was to be done in two parts. In the first part we were to focus on what happens behind the scenes – designing and implementing a simple database using SQLite; creating a table and then populating that table with new entries, modifying the entries and displaying the contents of the table to users. The practice app that we used in preparation for our project was an app to track pets in an animal centre in which we had to create a list of existing pets, and let the users add and edit the pets – names, weights, breed and so on. During the second part, the practice part was to build a user interface so that we could manipulate the database more easily.

The final project was to create our own Inventory app that would allow a store to keep track of it’s inventory. The brief was to:-

  • Be able to store information on a SQLite database
  • Integrate Android’s file system into that database
  • Present information from files and SQLite databases to users.
  • Be able to update information based on user input.
  • And create intents to other apps using stored information.
This is what the front page of the app looks like when the database is empty.

When the database is empty there is a message on the front of the app encouraging users to enter products into the database. On clicking the “kebab” menu in the top right hand corner there is an option to add sample data for testing but the usual way to add data to the database is to click on the green button on the bottom right of the page which takes you to:-

The “Add a product” page.

On the “Add a Product” page you can add relevant data about your product. On this page you can enter the product name, price, quantity with the additional function of making small adjustments with “+” and “-” buttons, the supplier name and the supplier telephone number which links via an intent to the telephoning intent. The app is based on the idea of a book, stationery and toy shop so there is a drop down list to select whether the product is a Book, a toy or a stationery item.

This is what the front page of the app looks like when the database is populated:-

The front page of the app when populated.

The type in bold shows the product name, below that is the price and below that is the number in stock. A sale is recorded by pressing the “Sale” button on the relevant item which reduces the stock number by one. If you click on the product instead, you can edit the details of the product in the case of inaccurate description, price or stock level. The “kebab” menu also allows a menu option to clear the whole database of entries. It was decided that we should only create a simple user interface because the emphasis was to create a usable database but I am sure that this app could be “prettied” and expanded to make it into of commercial value without much change to how it operates.

After I had submitted this project and tied up a few loose ends like making sure that I had been communicative enough on the Slack channels and Udacity blogs – they, quite rightly, put a lot of emphasis on community and communication – it had to wait for the verdict on my last project before graduation. We were also strongly encouraged to build our networks on LinkedIn and Facebook. I had been in LinkedIn and Facebook for some time before but my followers and the amount of people that I follow grew quite a bit as a result of this experience. I am a member of Udacity Graduate Alumni groups on LinkedIn, Facebook and Slack and it is useful to have people with a shared experience to converse with, support and receive support from.

Next time…. Graduation!!!

The Tour Guide App

We had started to create multi-page apps and now to build on that we were tasked with building a Tour Guide app. The brief was to make our own multi-screen Android app to share our knowledge about a city that we knew well. It was to include top attractions, restaurants, public places or events for the city. We were shown how to create proper data structures to store lists of information and then build layouts to display those lists of data. We were to navigate through those lists in Fragments using a ViewPager or Navigation Drawer; creating out own custom classes to do so and properly handling images and/or audio if applicable.

I chose to base my Tour App on the City of Nottingham and I included places to stay – mostly hotels, places to eat – restaurants and takeaways, places to explore like Theatres and castles, and finally, a section on Museums. Each item on each of the lists when clicked takes you to the venue’s website and navigating between lists is as easy as a swipe left or right.

Creation of this app introduced me to allowing permissions in the manifest (Internet) and making those Arrays of the data and image assets. It was also the first time that I had come across Fragments usefully. I had read about them in Stack Overflow posts but until this time they had remained some mystical far off land to be explored sometime in the future. We were also encouraged to up our game in terms of styling and polish of our app. I was very pleased with this app and I may well go back and add extra venues and categories to make it more complete and useful – once the Covid-19 pandemic is over and people can get out to visit these sorts of places.

When most people think of Nottingham they probably think “Robin Hood” who was probably not a real person but a couple of fun facts; D.H. Lawrence lived and wrote just outside of Nottingham in Eastwood and William Booth founded the Salvation Army in Nottingham and there is a museum to him and the Salvation Army in Nottingham centre. It is in my app just a bit lower on the museums page.

The Nanodegree Proper and the Musical Structure App

I had been accepted onto the Android Basics Nanodegree full scholarship and after wondering would I make the grade, I was finally relieved and excited.

The course continued with us going through the creation of “The Miwok App” – an app that was written to educate people about the language of the Miwok people – a group of native American people. The next project was to design an app to achieve a certain goal or purpose. We were going to create new activities, use explicit intents to link between activities in the app, use onClickListeners – written in Java this time – to add behaviour to to buttons, create our own custom class, looping through an ArrayList and populating a ListView or GridView with an ArrayAdapter.

The Miwok app “held our hand” through production of such an app and gave us the basis to create our own “masterpiece”. In addition to what was required with our project, the Miwok app also played .wav files of pronunciation of the Miwok words but that wasn’t required for our project.

I decided to create a Music Player App with a front page with a picture and several buttons leading to other activities – each was a genre of music – Rock, Pop, Classical, Disco and Country. Each activity had lists of music from that genre which was created from a list using ListView. Each other activity had buttons to move within the app to each other activity and to the home plus another button which displayed a “Playing Now” page. The purpose of the app was to practice Intents, ListView, Arrays(which made up the lists) and ArrayAdapter. The app didn’t actually play any music; that would be for another lesson some time in the future.

I was really quite pleased with the way that it turned out but to be honest, I look forward to a time when I can style an app to be a bit more visually appealing. I may well add some functionality to it at a later date too – such as actually linking the buttons to real music and actually getting my list/array form an API which is constantly updated. Maybe, some day….

The Quiz App.

The next project after the score app was to build a quiz app. Given my medical/healthcare background, I decided to produce a Medical Quiz.

The app preparation and creation included plans with drawings, spider grams, lists, pseudocode and a variety of other planning tools before writing any code. Taking those drawings and creating an xml layout (single page) by creating, positioning and styling views then creating interactivity through button clicks and Java code – commenting and documenting the code as you went.

My six question quiz incorporated questions with radio buttons (one choice from four or five possible only), check boxes (as many possible choices as there are questions) which were used when multiple right answers were required and one EditText where the person completing the quiz would type in the correct answer – hopefully. After each question had been answered the submit answers would be pressed. When the “Submit Answers” button was pressed a pop-up message would tell how many points had been achieved with two points awarded for each correct answer, even if there were two or three correct answers per question. If all of the answers were answered correctly, a different pop-up would be seen saying “You have scored a maximum of fourteen points!” The pop-up messages are officially called “toast messages” because they pop-up – neat!

There was a problem; I gave it to my son to play with and he pointed out a problem very quickly – it has to be said that my son was in his late twenties and was already a software coding god! He had earned his living as a senior software developer for several years at that point. He said, “If I fill all of the check boxes, I can get full marks even if I have also checked the wrong answers”. I learned how to put the check boxes for a particular question into a group and then limit how many check boxes were allowed to be checked in that group. Sorting out the scores was largely about a whole load of if(namedButton.isChecked) flow control statements with the instruction to add two points to the variable “score” if it was true (the condition had been met – boolean). I submitted the project and that was the final project for the “Google Developer Challenge” part of my journey. There was a lot of speculation and activity surrounding who would be accepted onto the full Nanodegree scholarship. There had been 20,000 people chosen for the Android Basics Track and only 2,000 would go forward to the next part. They were looking for those who were able to progress with the work but they also stipulated that those most supportive, communicative and active on the various forums that they had provided. I mentioned in an earlier post about the Udacity based forums but there was also two Slack channels; one was a general Udacity Student support channel and the other was a channel for the track that we were on – so I was on the Android Basics channel. There was a lot of support on the various channels from other students, we were encouraged to support other students and there were a few mentors who helped out with queries too. In order to progress, we had to be seen to be active participants – there was a flurry of activity when we neared the end of the challenge.

Fortunately for me, I made the cut and I was invited to continue on to the next phase. There will be more about that next time…

The early days…

Hello again and welcome back.

I started my Nanodegree on the 6th of November 2017. The course was administered on-line as so many of these courses are and I was assigned a mentor.

I was first shown how to install Android Studio and then set about creating my first project – a birthday card. It was really an exercise in getting to grips with the user interface and XML. Android Studio created a Main Activity (Java) but I wasn’t expected to go anywhere near it at that stage. I was encouraged to play around and make a variety of designs of birthday cards/Christmas cards in XML using LinearLayout and Relative Layout. Very soon it was time to sent off my first project for “marking”:-

First project – a business card.

The first project was a single page “Business card” or similar using various styling instructions in .xml – margins, layouts, sizing of text, pictures and “views”. This was mine. The address is that of Udacity in Mountain View, the logo – Udacity and the photo; an appropriate one was found with a web search. Quite fetching, don’t you think? Unfortunately, it wasn’t interactive yet.

The next step was to learn how to get our designs to do something which meant getting into Java coding. I was guided through an app called Court Counter – a score keeping app and was encouraged to code “as you go”. In the end I had a score counter based on the the game of tennis to refer to before creating the next submitted project, but I’ll tell you all about that next time…