Last active
June 24, 2024 18:22
-
-
Save saito-sv/af108545dec7e5cbf2612610d46c65c4 to your computer and use it in GitHub Desktop.
a simple shimmer view in swift
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Created by Marlon Monroy on 5/19/18. | |
// Copyright © 2018 Monroy.io All rights reserved. | |
// | |
import Foundation | |
import UIKit | |
protocol Shimmerable { | |
func start(count: Int) -> Void | |
func stop() -> Void | |
var lightColor: UIColor {get set} | |
var darkColor: UIColor {get set} | |
var isShimmering: Bool {get} | |
} | |
extension UIView: Shimmerable { | |
private struct ShimmerProperties { | |
static let shimmerKey:String = "io.monroy.shimmer.key" | |
static var lightColor:CGColor = UIColor.white.withAlphaComponent(0.1).cgColor | |
static var darkColor:CGColor = UIColor.black.withAlphaComponent(1).cgColor | |
static var isShimmering:Bool = false | |
static var gradient:CAGradientLayer = CAGradientLayer() | |
static var animation:CABasicAnimation = CABasicAnimation(keyPath: "locations") | |
} | |
var lightColor: UIColor { | |
get { | |
return UIColor(cgColor: ShimmerProperties.lightColor) | |
} | |
set { | |
ShimmerProperties.lightColor = newValue.cgColor | |
} | |
} | |
var darkColor: UIColor { | |
get { | |
return UIColor(cgColor: ShimmerProperties.darkColor) | |
} | |
set { | |
ShimmerProperties.darkColor = newValue.cgColor | |
} | |
} | |
var isShimmering: Bool { | |
get { | |
return ShimmerProperties.isShimmering | |
} | |
} | |
func stop() { | |
guard ShimmerProperties.isShimmering else {return} | |
self.layer.mask?.removeAnimation(forKey: ShimmerProperties.shimmerKey) | |
self.layer.mask = nil | |
ShimmerProperties.isShimmering = false | |
self.layer.setNeedsDisplay() | |
} | |
func start(count: Int = 3) { | |
guard !ShimmerProperties.isShimmering else {return} | |
CATransaction.begin() | |
CATransaction.setCompletionBlock({ | |
self.stop() | |
}) | |
ShimmerProperties.isShimmering = true | |
ShimmerProperties.gradient.colors = [ShimmerProperties.darkColor, ShimmerProperties.lightColor, ShimmerProperties.darkColor]; | |
ShimmerProperties.gradient.frame = CGRect(x: CGFloat(-2*self.bounds.size.width), y: CGFloat(0.0), width: CGFloat(4*self.bounds.size.width), height: CGFloat(self.bounds.size.height)) | |
ShimmerProperties.gradient.startPoint = CGPoint(x: Double(0.0), y: Double(0.5)); | |
ShimmerProperties.gradient.endPoint = CGPoint(x: Double(1.0), y: Double(0.5)); | |
ShimmerProperties.gradient.locations = [0.4, 0.5, 0.6]; | |
ShimmerProperties.animation.duration = 1.0 | |
ShimmerProperties.animation.repeatCount = (count > 0) ? Float(count) : .infinity | |
ShimmerProperties.animation.fromValue = [0.0, 0.12, 0.3] | |
ShimmerProperties.animation.toValue = [0.6, 0.86, 1.0] | |
ShimmerProperties.gradient.add(ShimmerProperties.animation, forKey: ShimmerProperties.shimmerKey) | |
self.layer.mask = ShimmerProperties.gradient; | |
CATransaction.commit() | |
} | |
} |
I use this at my collection view cell, but why only my first cell that start shimmering?
umm, will need to look at it again, its been a while
Did you find a solution for this?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
umm, will need to look at it again, its been a while