How do I use animationWithDuration and Chameleon Gradients? - ios

func fadeLightBar(){
UIView.animateWithDuration(fadeTime, delay: 0, options: UIViewAnimationOptions.AllowUserInteraction, animations: { [unowned self] () -> Void in
//self.lightBar.backgroundColor = RandomFlatColor()
self.lightBar.backgroundColor = GradientColor(UIGradientStyle.LeftToRight, self.lightBar.frame, [RandomFlatColor(), RandomFlatColor()])
}) { (stuff Bool) -> Void in
}
}
I want to fade a UIView from color to color. But, I want the UIView to be gradient color.
Doing the standard color-to-color works great. However, when I do the gradient, there is no fading at all. It just changes abruptly every X seconds.
I'm using this framework to generate gradients: https://github.com/ViccAlexander/Chameleon#gradient-colors-1

The framework works in its way, not simply change the color. I think it manipulate the layer by adding a CAGradientLayer on it. If so, it is impossible to animate adding a layer.
If you want to actualize the fading, you actually can do it yourself by adding a CAGradientLayer and animate its alpha

Related

Get a point's colour on a UIView that is animating

I can get the colour on a point of a view as proposed in https://stackoverflow.com/a/25956283/99214 by #jack-song . However when I animate the view
let scaledAndTranslatedTransform = imageViewShape.transform.translatedBy(x: -imageViewShape.bounds.width * 2 - 200, y: 0.0)
UIView.animate(withDuration: TimeInterval(duration), animations: {
self.imageViewShape.transform = scaledAndTranslatedTransform
}, completion: { _ in
})
I cannot get the colour of the point as the view moves.
How can I get the point when the view is moving?
Use presentationLayer property of view's layer because if we see in MVC pattern you will have model before animation and after animation as core animation classes are model in MVC pattern and so if you want to get the values in between animation use presentation layer

Animate WKInterfaceLabel with text change apple watch swift

I am working on an apple watch application. In the application, I have a view where the user may swipe left and right between 3 given results. I am using WKInterfaceLabel to show result information. On each swipe, labels are updated with new text.
View screenshot:
I want to animate the change of text on swipe. How can I do this?
Any help provided will be appreciated.
Thanks!
This is not very elegant, but it should work:
You can fade out the contents of a WKInterfaceLabel, and fade in another label in its place. So, place 2 WKInterfaceLabel objects at the same place. One of them is visible (alpha = 1.0) and the other invisible (alpha = 0.0).
When you swipe, determine the new value that should be shown, and set it to the invisible label.
Then, animate the transition using the function animate(withDuration:animations:) of the WKInterfaceController. In the animation block, change the alpha values as required, something like
animateWithDuration(1.0) {
self.visibleLabel.setAlpha(0.0)
self.invisibleLabel.setAlpha(1.0)
}
Hope this helps!
try:-
func labelimage(img: UIImageView) {
print(labelrate.hidden)
if (labelrate.hidden) {
UIView.animateWithDuration(0.5, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: {
self.labelrate.alpha = 1
}, completion: nil)
}
else {
UIView.animateWithDuration(0.5, delay: 0, options: UIViewAnimationOptions.CurveEaseInOut, animations: {
self.labelrate.alpha = 0
}, completion: nil)
}
self.labelrate.hidden = !self.labelrate.hidden
}

Show No Internet Connection Message Like Instagram

I was wondering how can i show a 'No Internet Connection' Just how like Instagram does it,
As an Example :
That see-through custom message animating to show under the navigationController . Would really love to get this to my project ,
thank you for you help
So here's a pic of the storyboard like this :-
"No internet connection" is a label, and the red view underneath is just to test the see through property of the label. If you are designing the UI in code, you can probably make a label similar to mine and place it to the top of the Navigation bar by using it's frame property.
The button here I'm using is just to show the label pop up on the scene (since it's just a demo answer). In your case, if the internet is not available, you will proceed to show the pop up.
So if you are making the UI in code, make sure to make the label in the viewDidLoad method. I have made an IBOutlet and the viewDidLoad now looks like this:-
override func viewDidLoad() {
super.viewDidLoad()
let transform = CGAffineTransform(translationX: 0, y: -label.frame.height)
label.alpha = 0
label.transform = transform
}
On the view loading, I'm moving the label behind the navigation bar, using CGAffineTransform. The distance, how much to move up is the label's height, since we don't want any part to be clipped on the scene.
Next step, is just a fix. I'm making alpha = 0, because navBar is translucent is nature and hence will change it's colour, since our label is behind it. So setting alpha to 0, takes care of it, and in third step apply the transform.
Now, if the internet connection is not available, we should pop out the label under the navBar. The code will look something like this:-
fun checkInternet() {
// called by some of your observer, which checks for changes in internet connection
if !isInternetAvailable {
UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0, options: .curveLinear, animations: {
self.label.alpha = 0.5
self.label.transform = .identity
}, completion: nil)
}
}
So here, I'll show the pop up with an animation using UIView.animate with some spring damping, so it has a nice bouncy effect to it. I'm setting the alpha to 0.5, since you mentioned you want a see through label, and I'm setting the label to a transform which will bring it back to it's original position when it was created, that's why I'm using .identity.
You can play around usingSpringWithDamping values and change options to have different effects.

ios: Animating UIControl with CoreGraphics

I'm following this tutorial and trying to make a slider.
I have a Slide class:
class YDSlider: UIControl {
var value = 0.0
...
And it has a sublayer with gradient to show the progress (just like a tutorial). I'd like to implement a func setValue(value: Double, animated: Bool) function, but I don't understand how to animate changes. My current approach is not working:
UIView.animateWithDuration(1, delay:1.0, options:UIViewAnimationOptions.LayoutSubviews, animations: { () -> Void in
self.value = value
}, completion: nil)
Without the source of your class, it will be difficult to help you but as far as I can see in the tutorial, the slider is designed with UIViews, CALayers and with the drawRect method.
So depending on the kind of elements of your slider you want to animate, you will have to use UIView animateions and for CoreAnimation.
If you need to animate parts designed with the drawRect method, this will be trickier and you will have to redraw manually the parts for each animation frame.

Difficulty allowing user interaction during UIView animation

I'm struggling to figure out how to allow user interaction with a view as it's being animated.
Here's the situation: I have a UIView cardView which holds card subviews. The cards are draggable tiles, similar to how the cards in Tinder are draggable/swipeable.
I am trying to fade out the card using animateWithDuration by animating to cardView.alpha = 0. Logically, this will also fade out all of the subviews (card objects). In this specific case, I am only targeting one card subview. However, during the animation, I am unable to drag/interact with the card.
Here is the code I'm using:
UIView.animateWithDuration(
duration,
delay: 0,
options: UIViewAnimationOptions.AllowUserInteraction,
animations: {self.cardView.alpha = 0}
) {
_ in
println("Card faded out")
card.removeFromSuperview()
}
Why doesn't this work? Any help will be appreciated. Thank you!!
I think you can find the answer in this previous post.
The interesting bit of the post is:
UIView's block animation by default blocks user interaction, and to get around it you need to pass UIViewAnimationOptionAllowUserInteraction as one of the options.
I fixed this problem by setting alpha to 0.1 instead of 0.0. I'm not sure if that will work in your case, but it shows that the event handling code thought that the view was not visible and disabled interaction even with the UIViewAnimationOptionAllowUserInteraction flag set. Oddly, setting the alpha to 0.01 did not work, so there is a threshold of visibility you have to stay above.
Swift 5
UIView.animateKeyframes(withDuration: 0.5, delay: 0, options: [.repeat, .autoreverse, .allowUserInteraction], animations: {
self.customButton.backgroundColor = .none
}, completion: nil)
The issue is with the Alpha value of 0. Alpha values of a certain proximity to Zero will remove the view from the view responder hierarchy. The fix here is to make the alpha setting to this:
self.cardView.alpha = 0.011
The view will still be invisible but not removed from the responder chain. From my testing the minimum amount is the following:
extension CGFloat {
static let minAlphaForTouchInput: CGFloat = 0.010000001
}

Resources