How to write an app – fitness tracker IOS version – introduction

Welcome to this guide on building a fitness tracker app for iOS. This guide is really designed for people who are trying to get into coding apps. If you’re an experienced developer, there’s probably not going to be much for you here unless you want to laugh at my code. There is already a lot of material out there on building apps, but personally I’ve found when trying to follow along, a lot of the code is glossed over in terms of what’s actually happening and I find myself getting lost. Maybe I’m just dumb! But for this reason, I am going to attempt to make sure every line of code in this guide is explained!

I’m designing this for the complete beginner, so even if you think you’re not ready, give it a shot. For any code that is more advanced than I care to delve into, I will point out along the way what you can read up on so that with a 5-10 minute investment you’ll understand what is going on.

So the app we are going to be building is a fitness tracker, you can download a finished version of the app from the Apple app store called “wright step fitness tracker”. I would definitely encourage you to get a copy of it, its free, and have a play and see what kind of functionality you’re going to be building. It’s quite a simple app but if, when you open it up, it seems like it will be too complicated, then calm yourself down because this course will be split into very simple chunks and everything will be explained. And even though the app is quite simple, there’s a lot that can be learned from developing it.

So, if you haven’t downloaded the app, go get it now and I will explain the features we are going to build…

appscreenshot

 

So the opening screen is a blank calendar with a logo at the top of the screen, and a month selection below that. At the bottom of the screen is an Instagram icon and below that an advert. You can change the month you are looking at by using the left and right arrows located next to the month name, and you should notice that the number of days in the calendar automatically changes depending on the month.

If you click the Instagram icon, the app takes a screenshot and opens a sharing option where you can choose to share the screenshot to instagram. This is good for sharing your fitness routine to all your followers.

For each day of the month is a small plus icon, if you click any of these icons for any day, you are taken to the next screen.

IMG-20180909-WA0003

In this screen you should see a small message asking you to “choose your activity” and below that, 8 icons with different activities and then below that a “cancel” option. Go ahead and click on the cyclist activity…

Notice a few things. The day you selected when you pressed the plus icon now has a cyclist icon in. Now change the month and then come back to the month you are currently on. Notice how the cyclist is still there…

sherlock

Now, close the app down on your phone completely and re-open it. You should see the cyclist is still there. None of this happens by accident, it all needs to be coded and we will go through all of it.

One last thing. Click another day, and this time select the activity of the little weight lifting man (supposed to represent going to the gym). You’ll see in this case you’re not taken back to the main screen but instead you’re taken to a third screen where you can get a little more specific about what you did in the gym that day. If you select any of these options you should see that you’re taken back to the main screen again but the day you chosen has a little weightlifting man in with a description of your workout that day.

The last thing worth mentioning is if you click a day that already has an activity in it, you can replace it with something else, or if you select cancel, you can remove the activity altogether.

So, that’s the app we are going to build. You can feel free to change the icons when it comes to it, and put your own logo in there and release the app onto the store if you want. We’ll even go over putting some ads in so you can potentially make some ad revenue.

So when you’re ready, click the link below to go to the first lesson, placing our first object within our app. Nice and simple to start!…How to write an app – fitness tracker IOS version – Our first view.

Advertisements

2 thoughts on “How to write an app – fitness tracker IOS version – introduction

  1. Pingback: How to write an app – fitness tracker IOS version –icons and constraints | high intensity coding

  2. Pingback: How to write an app – Fitness tracker IOS version – building a custom calendar | high intensity coding

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s