struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal, .green, .orange, .pink, .red] var body: some View { AngularGradient(colors: colors, center: .center) .edgesIgnoringSafeArea(.all) } }
struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal, .green, .orange, .pink, .red] var body: some View { AngularGradient(colors: colors, center: .topLeading) .edgesIgnoringSafeArea(.all) } }
struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal, .green, .orange, .pink, .red] let unitPoints = [UnitPoint.top, .topLeading, .center, .bottom, .bottomLeading, .bottomTrailing, .topTrailing, .trailing, .leading] @State private var centerLocation = UnitPoint.center let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect() var body: some View { AngularGradient(colors: colors, center: centerLocation) .edgesIgnoringSafeArea(.all) .animation(Animation.easeInOut.speed(0.5), value: centerLocation) .onReceive(timer) { input in centerLocation = unitPoints.randomElement() ?? .center } } }
struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal] let unitPoints = [UnitPoint.top, .topLeading, .center, .bottom, .bottomLeading, .bottomTrailing, .topTrailing, .trailing, .leading] @State private var centerLocation = UnitPoint.center let timer = Timer.publish(every: 2, on: .main, in: .common).autoconnect() var body: some View { ZStack { AngularGradient(colors: colors, center: centerLocation) .edgesIgnoringSafeArea(.all) .animation(Animation.easeInOut.speed(0.1), value: centerLocation) .onReceive(timer) { input in centerLocation = unitPoints.randomElement() ?? .center } VStack { Text("DevTechie") .font(.largeTitle) } .frame(maxWidth: .infinity, maxHeight: .infinity) .background(.thinMaterial) } } }
struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal] @State private var centerLocation = UnitPoint.center let timer = Timer.publish(every: 2, on: .main, in: .common).autoconnect() var body: some View { ZStack { AngularGradient(colors: colors, center: centerLocation) .edgesIgnoringSafeArea(.all) .animation(Animation.easeInOut.speed(0.1), value: centerLocation) .onReceive(timer) { input in centerLocation = UnitPoint(x: CGFloat.random(in: 0...1), y: CGFloat.random(in: 0...1)) } } } }
struct AngularGradientExample: View { let colors = [Color.blue, .purple, .cyan, .teal] @State private var centerLocation = UnitPoint.center @State private var startAngle = Angle(degrees: 90.0) @State private var endAngle = Angle(degrees: 360.0) let timer = Timer.publish(every: 2, on: .main, in: .common).autoconnect() var body: some View { ZStack { AngularGradient(colors: colors, center: centerLocation, startAngle: startAngle, endAngle: endAngle) .edgesIgnoringSafeArea(.all) .animation(Animation.easeInOut.speed(0.1), value: centerLocation) .onReceive(timer) { input in centerLocation = UnitPoint(x: CGFloat.random(in: 0...1), y: CGFloat.random(in: 0...1)) startAngle = Angle(degrees: Double.random(in: 1...180)) endAngle = Angle(degrees: Double.random(in: 0...360)) } } } }
struct AngularGradientExample: View { let colorStops = [Gradient.Stop(color: Color.blue, location: 0.0), Gradient.Stop(color: Color.purple, location: 0.1), Gradient.Stop(color: Color.cyan, location: 0.2), Gradient.Stop(color: Color.teal, location: 1.0)] @State private var centerLocation = UnitPoint.center @State private var startAngle = Angle(degrees: 90.0) @State private var endAngle = Angle(degrees: 360.0) let timer = Timer.publish(every: 2, on: .main, in: .common).autoconnect() var body: some View { ZStack { AngularGradient(stops: colorStops, center: centerLocation, startAngle: startAngle, endAngle: endAngle) .edgesIgnoringSafeArea(.all) .animation(Animation.easeInOut.speed(0.1), value: centerLocation) .onReceive(timer) { input in centerLocation = UnitPoint(x: CGFloat.random(in: 0...1), y: CGFloat.random(in: 0...1)) startAngle = Angle(degrees: Double.random(in: 1...180)) endAngle = Angle(degrees: Double.random(in: 0...360)) } } } }
With that we have reached the end of this article. Thank you once again for reading. Don’t forget to subscribe our weekly newsletter at