DVG
DVG

Reputation: 17480

UITableViewCell Swipe for Drawer

This is really more of a curiosity than a hard coding question.

Both Facebook and Twitter both have a feature where swiping a UITableViewCell animates the cell off the side to reveal a drawer with more controls underneath. How is something like that accomplished?

Upvotes: 8

Views: 8171

Answers (5)

Derrick Hathaway
Derrick Hathaway

Reputation: 1097

This is a problem I have tried a couple of different solutions to. I really liked the behavior of Mailbox (mailboxapp.com). So I set out to achieve this. In the end I ended up with what I believe is a very simple solution: use a UIScrollView inside your cell. I have blog post that discusses and a sample app that demonstrates this behavior.

Upvotes: 5

FrederickCook
FrederickCook

Reputation: 3258

Here is a great open-source method for doing exactly this, based on the behavior of the Twitter app:

https://github.com/thermogl/TISwipeableTableView

Upvotes: 6

Max Seelemann
Max Seelemann

Reputation: 9364

As a UITableViewCell is just a UIView, you can use this fact to basically do anything you like with it.

To solve your problem, I'd attach a UISwipeGestureRecognizer to detect the swipe and then animate the view to a different state.

For example, you could create a custom cell that has it's content view laying above the "actions view". Whenever there is a swipe, you use a UIView animation to move the content view aside and show the action view with a couple of buttons instead. In a custom UITableViewCell you could add a delegate protocol to have the pressed action and the cell being sent to the delegate, i.e. your controller. There you'd trigger what ever there is to trigger and then transition the cell out of the state.

Upvotes: 1

xhan
xhan

Reputation: 6287

2 ways to detect swipt action

  1. look at the willTransitionToState: method of UITableViewCell. this method will be invoked when you swipe at the cell.

  2. Custom swipe detection in a TableViewCell

and then you can change your cell view easily.

Upvotes: 3

kennytm
kennytm

Reputation: 523374

You could just implement -tableView:willBeginEditingRowAtIndexPath: in your table view delegate.

From the doc,

This method is called when the user swipes horizontally across a row; ... This method gives the delegate an opportunity to adjust the application's user interface to editing mode.

Upvotes: 1

Related Questions