First IOS Project
HOW I STARTED
My first story in medium was about machine learning field. And it was 10 months ago. During this time, i had a new enthusiasm. IOS Development. It all starts with i bought a new Iphone 6s. I liked the design and the community of Apple system. And i decided to develop something in this community.
I had a Dell 5110 notebook which is 9 years old. It still works fine of course with SSD support. I deploy a Virtual MacOs enviroment to install XCode and start IOS Development. But the results were not good. Evertime i press CTRL+R to compile and run the code, computer stuck for 5 minutes and then it shows the result. That was the time that i decided to buy a new MacBook.
I like to learn something new. And internet is a huge platform to find tutorials and other thing if know where to look. That is what i did. I search on the web to find where to learn IOS development. I had an experience on different programming languages. And i thought i would be easy for me to learn a new one. When i met with Swift, i swallowed every piece of my words before. It is completely a new type of language for me. Protocols, Optionals, Closures, etc. They are all new to me. Also mobile app development IDE (XCode in my situation) is different from Python or Matlab IDEs.
Then i found https://www.hackingwithswift.com/ website. It has some different learning programs and they are free. There is also some advanced courses and materials that you can buy. I chose “100 day of Swift Challenge” program which you promise to code every single day till the end.
LET’S HEAT THINGS UP!
After Introduction to Swift part there some projects that aim to teach you how to use Swift and XCode to make apps.
First Project is about creating a Tableview with photo names inside it. When the user click on a photo name a new page is open and the photo with this name will be shown to user.
Second Project is about programming a simple game. There are three buttons with national flag of some countries, and the user is asked for to find the flag of one country. If the user’s answer is correct an alert will pop up says “Correct” and says “Wrong” if the answer is wrong. Also user will get 1 point if the answer is correct and lose 1 if the answer is wrong.
LET’S MIX EVERTHING
After I finished two project i decided to mix my learnings in a new app. The name of my app is “Flag Game”. As on the Project 2 user will try to find countries flag.
I add two options in the begining of the game. User can play “1 Shot Challenge” or “2 Shot Challenge” game. I know the names are not so good. But i still try to learn :) “1 Shot Challenge” is the same as Project2. User has only one chance to find correct answer. “2 Shot Challenge” game gives user 2 chance to find the correct answer. If you user select wrong answer in the first guess. The wrong button will be disabled. This the general description of the app that i made. I will try to explain important part of the code below.
You can see the ViewController.swift file below.
This the code of first screen that User will see. When you first create a Single View app on XCode, XCode is automatically create ViewController.swift file for you. Originally, ViewController class inherits from UIViewController class, but i want to show user a TableView Controller in the begining so i change UIViewController -> UITableViewController.
The other important part of this file is where we describe the properties of TableView.
First we tell how many rows there will be on the TableView.
Then we tell what will be on these rows.
This code is a bit complex. There is a constant named “cell”. This is refer for the row element of our TableView. There is a function named dequeueReusableCell. I try to explain it the way i understand. If you think that i was wrong please leave a comment. Apple use this function to improve CPU usage efficiency. Phone screen can only show rows that fit the screen. When you scroll up or down program needs to create the other rows. This function makes the app to reuse old cell instead of creating new ones. Which is good for CPU and RAM usage.
The other lines are just add text to the cell and make an alignment setting. and that all we have our TableView. Our table shows the User what kind of game they want to play.
I know this scene doesn’t seem fancy :( I hope in the future i will write a new article to show my design talents progress over years.
When user make the selection a new Scene will be open. This scene is identical, except the title of the game, for both choice. But the gameplay will be different.
The code behind this screen is below.
There is a huge block of “countries” variable decleration on the code. I guess this is not the best way to this. May be we need to read it from a JSON file or something. But for this app and according to my limited knowledge, also the way that has been explained on tutorial, i will do this as it was on the code.
The code above is createing the new question for user. I plan to ask 10 question and then show the performance of the user in the end. And there is an alert object that will be pop-up in the end with the result.
The way to code an alert object is; first you give a title to it then you will write your message and you decide the style of the object.
Also you need to add an action element to your alert object. Which user will use it for close the alert window. In my app i named my action button as “Play Again”. When the user click “Play Again” button app will be start again which is guaranteed with the askQuestion function itself. The that you use alert action is defined on the handler parameter. I plan to add “Cancel” button in the future which will bring user tot he beginning screen that is not designed yet.
The code above is the way that we understand user choice(selecting the flag) and we show user if the selected choice is correct or not. There is also a “flag” variable. I used this variable in “2 Shot Challenge” game. Every time user make a wrong selection this variable is increase 1 and the selected button will be disabled. User make the second selection. If the selection is wrong again, we decrease the score and ask a new question, if selection is correct we increase the score and as k the new question. It is a simple if-else block. If you know a better way to this please let me know on comments. The part that we create alert object is identical with the askQuestion function part.
The other important part of this code is, the part that we understand which button has been clicked. Actually Swift make this job for us. You can find sender parameter in our buttonTapped function. This is the parameter that make our life easier. Before this we need to assign different tag number in our MainBoard.storboard as you can find below.
The last part of our code is updateGame function.
This function is used for updating the Score and Question part on the game screen.
And this is it. I have a working app. This is a simple, working (i hope you will find some bugs. Because fixing the bugs is the way of learning.) app. I try to explain every step of my coding process. I know it will be so boring and unnecessary for experienced develeoper. But i hope to reach the people that started app developing. Because i know they will some similarities with their status. I am leaving the Github link of this app. I am appreciate to hear some bad coded points from you :)
GitHub link : https://github.com/volkansahn/Flag-Game