Как оживить градиент, перемещающийся на iOS

Я хочу подражать фону «iPhone» «Хочу», есть 3 цвета, которые я хочу, чтобы просмотреть цикл, скажем, красный, синий и зеленый.

Я хочу, чтобы там был градиент от красного до синего до зеленого, каждые 1/3 экрана, исчезли друг с другом (градиент), затем, я хочу, чтобы красный шел с экрана сверху и возвращался на дно. (См. Фотографии ниже …)

Анимация должна двигаться вверх, я хочу, чтобы градиент поднялся и изменился в нижней части экрана и поднялся вверх.

Я попытался использовать CAGradientLayer и анимировать свойство «colors», но это выглядит просто как все исчезает друг в друге, а не обязательно покидает экран.

Созерцание с использованием OpenGL, но не хочу идти так низко для чего-то, что кажется довольно простым. Любые примеры справки / кода были бы высоко оценены. Мне в основном нужна помощь по анимации градиента с использованием CoreAnimation / CoreGraphics.

Заранее спасибо!

введите описание изображения здесь

введите описание изображения здесь

введите описание изображения здесь

Анимация свойства colors CAGradientLayer приведет к исчезновению, как вы обнаружили. Однако я думаю, что градиентный слой – это путь. Вы должны посмотреть на следующие варианты:

  • анимация свойства positions а также / вместо colors .
  • создание более высокого уровня градиента, который содержит полный цикл анимации и анимацию его положения

Второй вариант, вероятно, даст наилучшую производительность, так как градиент не нужно будет пересчитывать.

Вы должны подклассифицировать UIView для создания класса GradientView. Добавьте массив для хранения цветов, которые вы перемещаете. Выбор важен, и я написал статью, объясняющую почему. Переопределите метод drawRect (rect: CGRect) и выполните интерполяцию между компонентами цветов:

 override func drawRect(rect: CGRect) { let context = UIGraphicsGetCurrentContext(); CGContextSaveGState(context); let c1 = colors[index == 0 ? (colors.count - 1) : index - 1] // previous let c2 = colors[index] // current let c3 = colors[index == (colors.count - 1) ? 0 : index + 1] // next var c1Comp = CGColorGetComponents(c1.CGColor) var c2Comp = CGColorGetComponents(c2.CGColor) var c3Comp = CGColorGetComponents(c3.CGColor) var colorComponents = [ c1Comp[0] * (1 - factor) + c2Comp[0] * factor, // color 1 and 2 c1Comp[1] * (1 - factor) + c2Comp[1] * factor, c1Comp[2] * (1 - factor) + c2Comp[2] * factor, c1Comp[3] * (1 - factor) + c2Comp[3] * factor, c2Comp[0] * (1 - factor) + c3Comp[0] * factor, // color 2 and 3 c2Comp[1] * (1 - factor) + c3Comp[1] * factor, c2Comp[2] * (1 - factor) + c3Comp[2] * factor, c2Comp[3] * (1 - factor) + c3Comp[3] * factor ] let gradient = CGGradientCreateWithColorComponents(CGColorSpaceCreateDeviceRGB(), &colorComponents, [0.0, 1.0], 2) let startPoint = CGPoint(x: 0.0, y: 0.0) let endPoint = CGPoint(x: rect.size.width, y: rect.size.height) CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, CGGradientDrawingOptions.DrawsAfterEndLocation) CGContextRestoreGState(context); } 

Индексная переменная начинается с 0 и обтекает массив цветов, а коэффициент между 0.0 и 1.0 и анимируется через таймер:

 var index: Int = 0 var factor: CGFloat = 1.0 var timer: NSTimer? func animateToNextGradient() { index = (index + 1) % colors.count self.setNeedsDisplay() self.factor = 0.0 self.timer = NSTimer.scheduledTimerWithTimeInterval(1.0/60.0, target: self, selector: "animate:", userInfo: nil, repeats: true) } func animate(timer: NSTimer) { self.factor += 0.02 if(self.factor > 1.0) { self.timer?.invalidate() } self.setNeedsDisplay() } 
  • Неявное преобразование из типа перечисления 'enum CGImageAlphaInfo' в другой тип перечисления 'CGBitmapinfo' (aka) 'enum CGBitmapInfo')
  • Рисование искаженного текста на iOS
  • Анимация заполнения кругового индикатора выполнения с использованием маски изображения в iOS
  • 3D-эффект текста в iOS
  • Рисование CIImage слишком медленное
  • Как вставлять метаданные exif в изображение без копирования изображения?
  • Как нарисовать форму сердца в UIView (iOS)?
  • Проблемы с цветовой точностью, обеспечивающие рендеринг PDF-файлов для изображения с использованием Core Graphics на iOS
  • UIGraphicsBeginImageContext vs CGBitmapContextCreate на iOS
  • Как дать разделение зигзагообразного слоя между двумя изображениями
  • Текст Core Graphics намного быстрее, чем Core Text - я чувствую, что мне что-то не хватает
  • Давайте будем гением компьютера.