DEV Community

Jake Young
Jake Young

Posted on

How to Build a Simple Dog Walking Timer App

How to Build a Simple Dog Walking Timer App

Your dog stares at you. It's 6 PM. You know you promised a walk, but how long has it been? Two hours? 20 minutes?

A dog walking timer app is simple, useful, and a perfect first project to learn iOS development. In this tutorial, we'll build a functional timer app in Swift using SwiftUI. No previous experience required—just curiosity and a Mac with Xcode.

What We're Building

A dog walking timer app that:

  1. Starts a timer when you begin your walk
  2. Displays elapsed time in a readable format
  3. Lets you pause and resume
  4. Tracks your longest walk
  5. Shows time in minutes and seconds

By the end, you'll have a working iOS app you can actually use with your dog.

Prerequisites

  • Mac with Xcode (free on the App Store)
  • Basic Swift understanding (or willingness to learn)
  • 30 minutes to follow along

Step 1: Create a New SwiftUI Project

  1. Open Xcode
  2. Select File → New → Project
  3. Choose iOS → App
  4. Set Product Name to DogWalkTimer
  5. Select SwiftUI for the interface
  6. Click Create

Step 2: Set Up the Data Model

Create a new file called WalkTimer.swift:

import Foundation

class WalkTimer: ObservableObject {
    @Published var elapsedTime: TimeInterval = 0
    @Published var isRunning = false
    @Published var longestWalk: TimeInterval = 0

    private var timer: Timer?

    func start() {
        guard !isRunning else { return }
        isRunning = true
        timer = Timer.scheduledTimer(withTimeInterval: 1, repeats: true) { _ in
            self.elapsedTime += 1
        }
    }

    func pause() {
        isRunning = false
        timer?.invalidate()
    }

    func stop() {
        pause()
        if elapsedTime > longestWalk {
            longestWalk = elapsedTime
        }
        elapsedTime = 0
    }

    func formattedTime(_ seconds: TimeInterval) -> String {
        let minutes = Int(seconds) / 60
        let secs = Int(seconds) % 60
        return String(format: "%02d:%02d", minutes, secs)
    }
}
Enter fullscreen mode Exit fullscreen mode

Step 3: Build the UI

Replace the contents of ContentView.swift:

import SwiftUI

struct ContentView: View {
    @StateObject var walkTimer = WalkTimer()

    var body: some View {
        ZStack {
            LinearGradient(
                gradient: Gradient(colors: [.blue, .cyan]),
                startPoint: .topLeading,
                endPoint: .bottomTrailing
            )
            .ignoresSafeArea()

            VStack(spacing: 30) {
                Text("Dog Walk Timer")
                    .font(.largeTitle)
                    .fontWeight(.bold)
                    .foregroundColor(.white)

                VStack(spacing: 20) {
                    Text(walkTimer.formattedTime(walkTimer.elapsedTime))
                        .font(.system(size: 72, weight: .bold, design: .monospaced))
                        .foregroundColor(.white)

                    HStack(spacing: 20) {
                        Button(action: {
                            walkTimer.start()
                        }) {
                            Text("Start")
                                .frame(maxWidth: .infinity)
                                .padding()
                                .background(Color.green)
                                .foregroundColor(.white)
                                .cornerRadius(10)
                        }
                        .disabled(walkTimer.isRunning)

                        Button(action: {
                            walkTimer.pause()
                        }) {
                            Text("Pause")
                                .frame(maxWidth: .infinity)
                                .padding()
                                .background(Color.orange)
                                .foregroundColor(.white)
                                .cornerRadius(10)
                        }
                        .disabled(!walkTimer.isRunning)
                    }

                    Button(action: {
                        walkTimer.stop()
                    }) {
                        Text("Stop & Save")
                            .frame(maxWidth: .infinity)
                            .padding()
                            .background(Color.red)
                            .foregroundColor(.white)
                            .cornerRadius(10)
                    }
                    .disabled(!walkTimer.isRunning && walkTimer.elapsedTime == 0)
                }
                .padding()
                .background(Color.white.opacity(0.2))
                .cornerRadius(15)

                VStack(spacing: 10) {
                    Text("Longest Walk")
                        .font(.headline)
                        .foregroundColor(.white)

                    Text(walkTimer.formattedTime(walkTimer.longestWalk))
                        .font(.system(size: 48, weight: .semibold, design: .monospaced))
                        .foregroundColor(.yellow)
                }
                .padding()
                .background(Color.white.opacity(0.1))
                .cornerRadius(15)

                Spacer()
            }
            .padding(20)
        }
    }
}
Enter fullscreen mode Exit fullscreen mode

Step 4: Test the App

  1. Press Cmd + R to run the app in the simulator
  2. Click Start → timer counts up
  3. Click Pause → timer stops
  4. Click Start again → timer resumes
  5. Click Stop & Save → time resets, updates longest walk

Accessories to Enhance Your Dog Walks

Need gear to make dog walks easier? Consider these:

Check price on Amazon

Check price on Amazon

Check price on Amazon

You now have a working iOS app.

Top comments (0)