App 3 - Timer App
This week we each worked on timer apps. My timer can go up to 60 minutes and 60 seconds. The dark blue circles represent minutes and the light purple circles represent seconds. You can add 10 minutes at a time by pressing the blue circle in the middle or 5 seconds at a tie by pressing the light purple circle in the middle. Use the “start” button to begin the timer and the “reset” button to start the timer over.
import SwiftUI struct ContentView: View { @State var countSecs = 50 @State var countMins = 30 @State var timerIsRunning = false let timerSecs = Timer.publish(every: 1, on: .main, in: .common).autoconnect() // let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect() let timerMins = Timer.publish(every: 30, on: .main, in: .common).autoconnect() func isCircleEnabled(index: Int) -> Bool { return self.countSecs <= index } func isCircleEnabledMins(index: Int) -> Bool { return self.countMins <= index } var body: some View { VStack { Spacer() //Mins VStack { ForEach((0..<6).indices) { rowIndex in HStack { ForEach((0..<10).indices) { columnIndex in Circle() .fill(self.isCircleEnabledMins(index: rowIndex * 10 + columnIndex) ? Color.gray .opacity(0.25) : Color(red: 0/255, green: 51/255, blue: 204/255)) .frame(width: 25, height: 25) } } } } .padding() // .background(Color.black) Spacer() HStack{ Button(action: { self.countMins += 10 }) { // Text("Set Time Mins: \(countMins)") Circle () .fill(Color(red: 0/255, green: 51/255, blue: 204/255)) .frame(width: 75) //.padding() .foregroundColor(Color.white) .padding() } Button(action: { self.countSecs += 5 }) { //Text("Set Time Secs: \(countSecs)") Circle () .fill(Color(red: 153/255, green: 153/255, blue: 255/255)) .frame(width: 75) //.padding() // .foregroundColor(Color.white) .padding() } } HStack{ Button(action: { self.countSecs -= 1 self.timerIsRunning.toggle() }) { Text("Start") .fontWeight(.bold) .frame(width: 100) .padding() .foregroundColor(Color.black) .background(Color(red: 240/255, green: 240/255, blue: 245/255)) .padding() } Button(action: { self.countSecs = 50 self.countMins = 30 self.timerIsRunning.toggle() }) { Text("Reset") .fontWeight(.bold) .frame(width: 100) .padding() .foregroundColor(Color.black) .background(Color(red: 240/255, green: 240/255, blue: 245/255)) .padding() } } Spacer() //Secs VStack { ForEach((0..<6).indices) { rowIndex in HStack { ForEach((0..<10).indices) { columnIndex in Circle() .fill(self.isCircleEnabled(index: rowIndex * 10 + columnIndex) ? Color.gray .opacity(0.25) : Color(red: 153/255, green: 153/255, blue: 255/255)) .frame(width: 25, height: 25) } } } } .padding() // .background(Color.white) Spacer() } .onReceive(timerMins) { _ in // Block gets called when timer updates. // If timeRemaining and timer is running, count down. if self.countMins > 0 && self.timerIsRunning { self.countMins -= 1 print("Time Remaining:", self.countMins) } } .onReceive(timerSecs) { _ in // Block gets called when timer updates. // If timeRemaining and timer is running, count down. if self.countSecs > 0 && self.timerIsRunning { self.countSecs -= 1 print("Time Remaining:", self.countSecs) } } } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } }