Making an animation to slide and hide/show an UIView(swift 5) - ios

Question

I want to add animation to these two views.
Red UIView
Green UIView
My storyboard look like this
From the picture I want to add an animation when click on these two views.
First start with hide red UIView.
Action : 1
when i click on green view i want green uiview silde to the right side until it disappear
and the red UIView will slide out from the right side immediately.
red uiview slide from right side
and stopp when it is at that point in the storyboard and hide green UIView.
Action : 2
and when i click on red view i want it to slide right until it disappears. Show green UIView and comes out from the right corner as well and hide red UIView.
red UIView slide out
My Code
import UIKit
class TestViewCell: UICollectionViewCell {
#IBOutlet weak var bgView: UIView!
#IBOutlet weak var bgAlertView: UIView!
#IBOutlet weak var imgAlert: UIImageView!
#IBOutlet weak var bgAlreadyAlertView: UIView!
#IBOutlet weak var imgAlreadyAlert: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
//Make an action when tap on bgAlertView
let actionBgAlert : Selector = #selector(self.actionBgAlert)
let viewPostsViewGesture = UITapGestureRecognizer(target: self, action: actionBgAlert)
bgAlertView.isUserInteractionEnabled = true
bgAlertView.addGestureRecognizer(viewPostsViewGesture)
//Make an action when tap on bgAlreadyAlertView
let actionBgAlreadyAlert : Selector = #selector(self.actionBgAlreadyAlert)
let viewAlreadyViewGesture = UITapGestureRecognizer(target: self, action: actionBgAlreadyAlert)
bgAlreadyAlertView.isUserInteractionEnabled = true
bgAlreadyAlertView.addGestureRecognizer(viewAlreadyViewGesture)
}
//action1
#objc func actionBgAlert(sender: UITapGestureRecognizer){
if imgAlert.image == #imageLiteral(resourceName: "alarm") {
self.bgAlertView.isHidden = true
self.bgAlreadyAlertView.isHidden = false
}
//action2
#objc func actionBgAlreadyAlert(sender: UITapGestureRecognizer){
if imgAlreadyAlert.image == #imageLiteral(resourceName: "alarmedMain") {
self.bgAlertView.isHidden = false
self.bgAlreadyAlertView.isHidden = true
}
}

Answer 1

In the storyboard set constraints on the size of the views. Set constraints from the right side of the red view and green view from the right side of the superview they share. Define some constants for the values needed for both positions for both views.
Then something like this:
#IBOutlet weak var greenConstraint : NSLayoutConstraint
#IBOutlet weak var redConstraint : NSLayoutConstraint
let greenSlideOutValue = -2000.0 // big enough to get green view offscreen
let redSlideInValue = 0.0 // aligns red view right edge to superview
let greenSlideInValue = 100.0 // puts green view onscreen offset from right edge
let redSlideOutValue = -2500.0 // big enough to get red view offscreen.
UIView.animate(withDuration: 0.75, delay: 1.0, options: .curveEaseOut, animations: {
greenConstraint.constant = greenSlideOutValue
redConstraint.constant = redSlideInValue
self.view.layoutIfNeeded()
}, completion: { finished in
print(“slide green out, red in”)
})
Do this in the event handler for say a tap or gesture recognizer associated with the views. Do similar for the red view event(s)
Code isn’t compiled and is just typed in but should get you started.