UIView Transition in table view

Question

I want to do transition of a view inside a table view cell. More precisely, when user clicks on a button in UITableViewCell a view should slide in from the right side of the cell and this view should slide back to its original position when user clicks on a button in the slided view. I could do all of this except the animation of sending the slided view back to its original position.

To accomplish this what I have done so far is, created a xib file for the table view cell which contains two views side by side, let it be view1 and view2. When the tableview is loaded to screen, only view1 is visible to the user. And set auto layout constraint for view1.trailingedge and view2.leadingedge as 0, the constraint is connected to cell.swift and named leftConstraint. Now when a button in view1 is clicked view2 slides in from the right side of the cell using the following code :-

self.view2.transform = CGAffineTransformMakeTranslation(UIScreen.mainScreen().bounds.width, 0)
UIView.animateWithDuration(0.4, animations: { () -> Void in
    self.view2.transform = CGAffineTransformIdentity
    self.leftConstraint.constant -= UIScreen.mainScreen().bounds.width
})

When tried to send back view2 to its old position (this should happen on the click of a button in view2) ie. right side of the cell animation is not working, all the elements in view2 just disappears. Using the following code for sending view to the right side of the cell:-

self.view2.transform = CGAffineTransformMakeTranslation(UIScreen.mainScreen().bounds.width, 0)
UIView.animateWithDuration(0.4, animations: { () -> Void in
   self.view2.transform = CGAffineTransformIdentity
   self.leftConstraint.constant += UIScreen.mainScreen().bounds.width
})

Thanks in Advance for any help. And special Thanks to @MarkHim for helping.

MarkHim MarkHim · Accepted Answer · 2015-10-28T08:39:12

Since you need the transformation for the rightOut position twice, first for the in-animation and later for the out animation, you could save it in a variable like rightOutTransform. Try:

CGAffineTransform rightOutTransform = CGAffineTransformMakeTranslation(self.view.fame.size.width, 0);
// assuming view2 is currently in the cell
UIView.animateWithDuration(0.4, animations: {
   self.view2.transform = rightOutTransform //
})

You might want to think about removing views you don't need anymore from the view hierarchy like this when the animation completed

view2.removeFromSuperview();

UIView Transition in table view

1 Answers