From ecad3b98b9b7bea20106d3dceaf528aec603cd14 Mon Sep 17 00:00:00 2001 From: Felix Mau Date: Fri, 11 Mar 2022 14:08:56 +0100 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20::=20Allow=20offsetting=20?= =?UTF-8?q?the=20large=20circle=20in=20x=20and=20y=20direction?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../NotchGradientLoadingBarController.swift | 38 +++++++++---------- 1 file changed, 18 insertions(+), 20 deletions(-) diff --git a/GradientLoadingBar/Classes/NotchGradientLoadingBarController.swift b/GradientLoadingBar/Classes/NotchGradientLoadingBarController.swift index afb7286..eea6da4 100644 --- a/GradientLoadingBar/Classes/NotchGradientLoadingBarController.swift +++ b/GradientLoadingBar/Classes/NotchGradientLoadingBarController.swift @@ -20,10 +20,8 @@ private struct NotchConfig { /// The radius of the large circle on the inside of the notch. let largeCircleRadius: CGFloat - /// We're moving the the large-circles a bit up. - /// This prevents having a straight line between the circles. - /// See - let verticalOffsetForLargeCircle: CGFloat + /// Offset for the center-point of the large circle. + let largeCircleOffset: CGPoint /// The transform to be applied to the bezier path. let transform: CGAffineTransform @@ -112,20 +110,20 @@ open class NotchGradientLoadingBarController: GradientLoadingBarController { clockwise: true) // Draw the large circle right to the `leftNotchPoint`. - bezierPath.addArc(withCenter: CGPoint(x: leftNotchPoint + notchConfig.largeCircleRadius, - y: smallCircleDiameter + notchConfig.verticalOffsetForLargeCircle), + bezierPath.addArc(withCenter: CGPoint(x: leftNotchPoint + notchConfig.largeCircleRadius + notchConfig.largeCircleOffset.x, + y: smallCircleDiameter + notchConfig.largeCircleOffset.y), radius: notchConfig.largeCircleRadius, startAngle: CGFloat.pi, endAngle: CGFloat.pi / 2, clockwise: false) // Draw line to large-circle underneath and left to `rightNotchPoint`. - bezierPath.addLineTo(x: rightNotchPoint - notchConfig.largeCircleRadius, - y: smallCircleDiameter + notchConfig.largeCircleRadius + notchConfig.verticalOffsetForLargeCircle) + bezierPath.addLineTo(x: rightNotchPoint - notchConfig.largeCircleRadius - notchConfig.largeCircleOffset.x, + y: smallCircleDiameter + notchConfig.largeCircleRadius + notchConfig.largeCircleOffset.y) // Draw the large circle left to the `rightNotchPoint`. - bezierPath.addArc(withCenter: CGPoint(x: rightNotchPoint - notchConfig.largeCircleRadius, - y: smallCircleDiameter + notchConfig.verticalOffsetForLargeCircle), + bezierPath.addArc(withCenter: CGPoint(x: rightNotchPoint - notchConfig.largeCircleRadius - notchConfig.largeCircleOffset.x, + y: smallCircleDiameter + notchConfig.largeCircleOffset.y), radius: notchConfig.largeCircleRadius, startAngle: CGFloat.pi / 2, endAngle: 0, @@ -164,20 +162,20 @@ open class NotchGradientLoadingBarController: GradientLoadingBarController { clockwise: false) // Draw the large circle left to the `rightNotchPoint`. - bezierPath.addArc(withCenter: CGPoint(x: height + rightNotchPoint - notchConfig.largeCircleRadius, - y: height + smallCircleDiameter + notchConfig.verticalOffsetForLargeCircle), + bezierPath.addArc(withCenter: CGPoint(x: height + rightNotchPoint - notchConfig.largeCircleRadius - notchConfig.largeCircleOffset.x, + y: height + smallCircleDiameter + notchConfig.largeCircleOffset.y), radius: notchConfig.largeCircleRadius, startAngle: 0, endAngle: CGFloat.pi / 2, clockwise: true) // Draw line to large-circle underneath and right to `leftNotchPoint` - bezierPath.addLineTo(x: height + leftNotchPoint + notchConfig.largeCircleRadius, - y: height + smallCircleDiameter + notchConfig.largeCircleRadius + notchConfig.verticalOffsetForLargeCircle) + bezierPath.addLineTo(x: height + leftNotchPoint + notchConfig.largeCircleRadius - notchConfig.largeCircleOffset.x, + y: height + smallCircleDiameter + notchConfig.largeCircleRadius + notchConfig.largeCircleOffset.y) // Draw the large circle right to the `leftNotchPoint`. - bezierPath.addArc(withCenter: CGPoint(x: leftNotchPoint - height + notchConfig.largeCircleRadius, - y: height + smallCircleDiameter + notchConfig.verticalOffsetForLargeCircle), + bezierPath.addArc(withCenter: CGPoint(x: leftNotchPoint - height + notchConfig.largeCircleRadius + notchConfig.largeCircleOffset.x, + y: height + smallCircleDiameter + notchConfig.largeCircleOffset.y), radius: notchConfig.largeCircleRadius, startAngle: CGFloat.pi / 2, endAngle: CGFloat.pi, @@ -224,19 +222,19 @@ private extension NotchGradientLoadingBarViewModel.SafeAreaDevice { /// Values are based on . return NotchConfig(notchWidth: 208, largeCircleRadius: 22.5, - verticalOffsetForLargeCircle: -4.75, + largeCircleOffset: CGPoint(x: 0, y: -4.75), transform: CGAffineTransform(translationX: 0.33, y: 0)) case .iPhoneXR: return NotchConfig(notchWidth: 232, largeCircleRadius: 21, - verticalOffsetForLargeCircle: 0, + largeCircleOffset: .zero, transform: .identity) case .iPhone12: return NotchConfig(notchWidth: 209.5, largeCircleRadius: 21, - verticalOffsetForLargeCircle: -1.75, + largeCircleOffset: CGPoint(x: 0, y: -1.75), transform: .identity) case .iPhone13: @@ -244,7 +242,7 @@ private extension NotchGradientLoadingBarViewModel.SafeAreaDevice { // Source: . return NotchConfig(notchWidth: 161, largeCircleRadius: 22, - verticalOffsetForLargeCircle: -1, + largeCircleOffset: CGPoint(x: 0, y: -1), transform: .identity) } }