Spotify style cell expansion

[mzgaljic]

Hi, i'm considering using this library since it offers so many features and it seems to be pretty rock solid!

Would it be possible to make the cell expansion similar to the way Spotify's app does it? They recently pushed out an update with really slick gestures. From what I can tell (I may very well be mistaken), it appears that out of the box this library only allows an MGSwipeButton to expand by moving the button along with the cells content view, in a right-justified manner (when expanding from left to right for example). That's the way it works in your Mail app demo as well. The Spotify app does two things which interest me:

1. the "button" if you will, is center justified throughout the expansion. It looks exactly the same at first to the way this library does the transition style "MGSwipeTransitionClipCenter". However if you look at the way Spotify has done it, it appears that after the button is clipped, their button does not "stick" to the right.
2. the expanded background color "changes" after the cell is activated/deactivated, so the user knows whether the gesture will take effect if the gesture is ended throughout the drag.
3. once the cell is released, the cell completely returns back to its regular position.

Is this supported out of the box in any way, and if not, do you think this would be possible using this library? I would very much be interested in this functionality. I have provided a gif in case you haven't used the Spotify app before:

Sorry for the big wall of text! :)

[kvnbautista]

1). https://github.com/jamztang/CSStickyHeaderFlowLayout

[mzgaljic]

Thanks for the link Bautistax, but I'm specifically interested in the way the tableview CELL is expanding in their app, NOT how the tableview header sticks in their app. Sorry I was confusing.

[MortimerGoro]

Hello mzgaljic,

I have implemented the 2 features needed to achieve Spotify cell expansion style: expansionLayout and expansionColor. I have uploded it to the develop branch. I want to test it a bit more before merging to master and pushing the new version to cocoapods.

I'll create a demo that mimics Spotify table, but for now you can test this style changing the expansionSettings in the MailAppDemo in the swipeButtonsForDirection delegate method, try with this values:

if (direction == MGSwipeDirectionLeftToRight) {

    expansionSettings.fillOnTrigger = NO;
    expansionSettings.threshold = 1;
    expansionSettings.expansionLayout = MGSwipeExpansionLayoutCenter;
    expansionSettings.expansionColor = [UIColor greenColor];
    swipeSettings.transition = MGSwipeTransitionClipCenter;
    swipeSettings.threshold = 9999;

Thanks for the idea. Give me some feedback if you test the new feature ;)

[mzgaljic]

Thank you so much! Really appreciate the response, and I will try this out tonight. Thanks again.

[mzgaljic]

I actually just tried it, it looks great! Nice work... I guess we can close this issue once the develop branch is merged with master?

[mzgaljic]

By the way, if you really do intend on imitating the Spotify look, you should have the color change a little bit later than it does now. The current implementation (on develop branch as you mentioned), changes the color almost immediately after the buttons UILabel becomes visible. Spotify's cell appears to change color slightly later... but otherwise it looks exactly the same to me!

UPDATE: never mind, this issue (in this comment) can be resolved by changing the padding argument for the method:

+(instancetype) buttonWithTitle:(NSString *) title backgroundColor:(UIColor *) color padding:(NSInteger) padding callback:(MGSwipeButtonCallback) callback

[MortimerGoro]

Yes, I will close the issue once I merge into master ;)

[mzgaljic]

By the way this is a very small issue but I discovered one nonetheless. I will post a gif in the next couple of days when i get the chance...

it is possible to expand the cell, release it, and have the expanded button NOT bounce all the way back off screen. It is a corner case and hard to reproduce, but it is definitely possible. However, I noticed that this issue only occurs if the cells padding is increased on the MGSwipeCell.

[kimmobrunfeldt]

I'm interested of this feature too

[MortimerGoro]

Merged in 1.4.1.

@mzgaljic Create a new issue with the gif ;)