In-class assignment

The two screen captures shown below depict a path generated arc just like the ones you learned to make in chapter 8 of your textbook. As you can see, however, each arc has a different size and color. That’s because the size of the arc is controlled by the slider and the colors change each time one of the arrow buttons are clicked by iterating through an array of colors.  Your job is to create an app with the same functionality and design. A few points.

  1. The arrows are generated from system SF fonts. You don’t have to use arrows spefically, but I do expect you to use SF fonts.
  2. You can learn how to make a slider from this lesson.  Be sure and set YOUR slider variable to CGFloat instead of Double in order for it to work properly when you use it to control the size of the arc.
  3. Because the arc ranges from 0 to 360 degrees, the upper value of the slider should be set to 360 instead of 100.
  4. The text field should display the value from the slider.
  5. Needless to say (but I’ll say it just in case :), you will need to use @State variables in order for their values to change.
  6. Your color array should have at least 4 colors. You will iterate through the array by incrementing and decrementing an integer variable. When value of the integer decrements to zero, it should reset to a value so that the last color in the array appears. The reverse should happen when the integer increments enough to display the last color in the array, and its value should reset so that the first color in the array appears.
    (hint:)

Have fun!