Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to implement UITableView`s swipe to delete for UICollectionView

Tags:

I just like to ask how can I implement the same behavior of UITableView`s swipe to delete in UICollectionView. I am trying to find a tutorial but I cannot find any.

Also, I am using PSTCollectionView wrapper to support iOS 5.

Thank you!

Edit: The swipe recognizer is already good. What I need now is the same functionality as UITableView's when cancelling the Delete mode, e.g. when user taps on a cell or on a blank space in the table view (that is, when user taps outside of the Delete button). UITapGestureRecognizer won't work, since it only detects taps on release of a touch. UITableView detects a touch on begin of the gesture (and not on release), and immediately cancels the Delete mode.

like image 416
MiuMiu Avatar asked Jan 11 '13 01:01

MiuMiu


People also ask

What is the difference between Uitableview and UICollectionView?

Tableiw is a simple list, which displays single-dimensional rows of data. It's smooth because of cell reuse and other magic. 2. UICollectionView is the model for displaying multidimensional data .

How do I remove an item from my collection view?

In the Collection Reusable View section set the Identifier to "Cell". Next, drag a Bar Button Item to the right side of the Navigation Bar. Select the Bar Button Item and go to the Attributes inspector. In the Bar Button Item section change the System Item to Trash.

How does UICollectionView work?

The collection view presents items onscreen using a cell, which is an instance of the UICollectionViewCell class that your data source configures and provides. In addition to its cells, a collection view can present data using other types of views.


1 Answers

There is a simpler solution to your problem that avoids using gesture recognizers. The solution is based on UIScrollView in combination with UIStackView.

  1. First, you need to create 2 container views - one for the visible part of the cell and one for the hidden part. You’ll add these views to a UIStackView. The stackView will act as a content view. Make sure that the views have equal widths with stackView.distribution = .fillEqually.

  2. You’ll embed the stackView inside a UIScrollView that has paging enabled. The scrollView should be constrained to the edges of the cell. Then you’ll set the stackView’s width to be 2 times the scrollView’s width so each of the container views will have the width of the cell.

With this simple implementation, you have created the base cell with a visible and hidden view. Use the visible view to add content to the cell and in the hidden view you can add a delete button. This way you can achieve this:

swipe to delete

I've set up an example project on GitHub. You can also read more about this solution here.
The biggest advantage of this solution is the simplicity and that you don't have to deal with constraints and gesture recognizers.

like image 191
Amer Hukic Avatar answered Sep 21 '22 13:09

Amer Hukic