Howdy,

I just finished Day 44, and I thought that I would play around some. I'd like to make the ColorCyclingCircle so that it animates continuously and automatically, either on appear, or on some kind of Button toggle.

Does anyone have any suggestions?

I started going back through the lessons on animation, but after struggling over and over, I'm now not sure that Animation is the proper way to go...

struct ColorCyclingCircle: View {
    var amount = 0.0
    var steps = 100

    var body: some View {
        ZStack {
            ForEach(0..<steps) { value in
                Circle()
                    .inset(by: CGFloat(value))
                    //.strokeBorder(self.color(for: value, brightness: 1), lineWidth: 2)
                    .strokeBorder(LinearGradient(gradient: Gradient(colors: [self.color(for: value, brightness: 1), self.color(for: value, brightness: 0.1)]), startPoint: .top, endPoint: .bottom), lineWidth: 2)
            }
        }
        .drawingGroup()
    }

    func color(for value: Int, brightness: Double) -> Color {
        var targetHue = Double(value) / Double(self.steps) + self.amount

        if targetHue > 1 {
            targetHue -= 1
        }
        return Color(hue: targetHue, saturation: 1, brightness: brightness)
    }
}

struct ContentView: View {
    @State private var colorCycle = 0.0

    var body: some View {
        VStack {
            ColorCyclingCircle(amount: self.colorCycle)
                .frame(width: 300, height: 300)

            Slider(value: $colorCycle)    
        }
    }
}

OK, so I poked around some more and managed to find several instances of Timer being used for things like this.

I added the following code, which was derived from a HwS lesson that I've yet to work through (maybe it's in a future project):

let timer = Timer.publish(every: 0.1, on: .main, in: .common).autoconnect()

Text("Text(\(colorCycle))")
                .onReceive(timer) { input in
                    if self.colorCycle <= 1 {
                        self.colorCycle += 0.01
                    } else {
                        self.colorCycle = 0
                    }
                }
            Text("Text(String(\(String(colorCycle)))")

Also, I noticed the the value of colorCycle is frequently is off by a very, very, very small amount, but I don't know why that is. See below:

Pic

If anyone has any ideas about a better method to achieve this effect, I'd love to know. Thanks.