7 min workout app iOS Swift Tutorial Xcode App Design

UIViewController Autolayout and Timers in iOS for Workout app flow

In this post we will learn how to use UIViewController autolayout and Timers to create workflow for our workout app.

In previous post we learned about UITableview Datasource and Delegates

Create a new file called WorkoutViewController which subclasses UIViewController.swift. In the WorkoutViewcontroller we will cycle through a list of all the available workouts. The main components in the UIViewcontroller is MZTimerLabel which will tell how many seconds are left for this workout. IF you don’t want to use this method you could as well use the UILabel and NSTimer

In viewDidLoad we will set the timeFormat and also create multiple IBOutlet for the nextUp, workoutLabel, mainLabel and the timerLabel.

Also set the initial Count DownTimer for 10 second and update the nextUp workout. We will have a 10second rest after every workout which we can control using the index variable. When the index is even we show the rest message and when the index is odd we show the workout information.

MZTimerLabel also has a delegate method which will be called when the count down timer reaches 0. Lets reset the timer and increment the index.

//
//  WorkoutViewController.swift
//  SevenMinWorkOut
//
//  Created by Shrikar Archak on 4/18/15.
//  Copyright (c) 2015 Shrikar Archak. All rights reserved.
//

import UIKit

class WorkoutViewController: UIViewController, MZTimerLabelDelegate {

    @IBOutlet weak var nextUp: UILabel!
    @IBOutlet weak var workoutLabel: UILabel!
    @IBOutlet weak var mainLabel: UILabel!
    @IBOutlet weak var timerLabel: MZTimerLabel!

    let restTime = 11.0
    let workoutTime = 30.0
    var index = 5;
    let dataSource = WorkoutDataSource()
    var workouts: [Workout]!
    override func viewDidLoad() {
        super.viewDidLoad()
        timerLabel.delegate = self
        timerLabel.timerType = MZTimerLabelTypeTimer
        timerLabel.setCountDownTime(10)
        timerLabel.timeFormat = "ss"
        timerLabel.resetTimerAfterFinish = true
        timerLabel.start()
        workouts = dataSource.getWorkOuts()
        workoutLabel.text = workouts[0].title
        self.navigationController?.navigationBar.barTintColor = workouts[0].color
        self.navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
        
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
    
    func timerLabel(timerLabel: MZTimerLabel!, finshedCountDownTimerWithTime countTime: NSTimeInterval) {
        
        if index % 2 == 0 {
            let wk = workouts[index / 2]
            timerLabel.text = "\(workoutTime)"
            mainLabel.text = wk.title
            self.view.backgroundColor = wk.color
            timerLabel.setCountDownTime(workoutTime);
            workoutLabel.text = "Rest !!"
            self.navigationController?.navigationBar.barTintColor = wk.color
        } else {
            let wk = workouts[index / 2 + 1]
            timerLabel.text = "\(restTime)"
            mainLabel.text = "Rest !!"
            self.view.backgroundColor = wk.color
            timerLabel.setCountDownTime(restTime);
            workoutLabel.text = wk.title
            self.navigationController?.navigationBar.barTintColor = wk.color            
        }

        index++;
        if !((index / 2) > workouts.count) {
            timerLabel.start()
        } else {
            println("Workout done")
        }
    }
    
}


Last but not the least `CTRL+DRAG` from the start workout button on to the navigation controller embedding Workoutviewcontroller.swift and select Modal style.
7min24

Go ahead and run the application . Congratulation! you have build one of the heavily used iOS app in the app store.

About the author

Shrikar

Backend/Infrastructure Engineer by Day. iOS Developer for the rest of the time.

  • timbojill

    Where can I download a sample of this project for xCode 6.3 ?

    • https://shrikar.com shrikar

      Most of the code is compatible with Xcode 6.3 expect for converting as to as!

  • fbara

    Where did WorkoutViewController come from? It shows up in the last image of the storyboard but you don’t talk about it or describe it. Was that intentional? If so, it might be a good idea to mention it in the tutorial. I do appreciate you doing this for us but there’s a lot of steps left out and it took me quite a while to track everything down.

    • https://shrikar.com shrikar

      Hey sorry I tried to make the steps as detailed as possible.. But sometimes I do miss out.. Will fix it

      • fbara

        My last comment sounded angrier than I actually was, sorry about that. I didn’t mean to sound ungrateful. I know it’s difficult and time-consuming to put these things together and I really do appreciate you doing it.

        • https://shrikar.com shrikar

          Thats ok its fixed anyways now.. I forgot to add the line “Create a new file WorkoutviewController.swift”

  • trying7min

    Trying to get this code to work, but keep getting this error:

    -[UILabel setDelegate:]: unrecognized selector sent to instance

    Seems there is something wrong with this line: timerLabel.timerType = MZTimerLabelTypeTimer

    Is there a working copy of this code on github?

  • Dexterz

    Hello Shrikar, loved the tutorial, i have 2 problems after finishing the whole thing and reading through it more than 4 times. I cannot make the tableview cells clickable, how do i make it work? Also the part where you are supposed to pin the UIView to the bottom of the tableview, i cannot change anything to make it stick to the bottom, right now it just want to sit on the bottom of the list in the tableview. Should i reduce the size of the table view so that it can fit bellow the tableview instead? Thanks a lot for these tutorials really appreaciate your hard work! Best regards, Dexterz

  • Rusty

    great tutorial thank you. For some reason I cant finish it. The last line of code if !((index / 2) > workouts.count) gives me a expected separator error and I cant fix it. It’s probably something small but i have no clue. Thanks again

/* ]]> */