modocache / mdcswipetochoose Goto Github PK
View Code? Open in Web Editor NEWSwipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!
License: MIT License
Swipe to "like" or "dislike" any view, just like Tinder.app. Build a flashcard app, a photo viewer, and more, in minutes, not hours!
License: MIT License
Hi,
How do you get the backCard to animate from a smaller frame to a bigger frame when the frontCard is being swept away in either direction? Like the UX seen on Tinder where each card is a little smaller in width from the previous one but the width grows as the front card is being swept away.
Thanks,
Varun
Swift Demo is not compatible with Swift 1.2 and Xcode 6.3
I get about 9 Errors.
When I try typing pod install in the directory of example, I received many errors and do not install the pods folder
Thanks for the amazing work! I currently building an app that also requires facebook sdk. The facebook requires that I cant have the -objC linker flag which causes this library to break.
Is there a way to make this library work without the -objC linker flag?
The current animation performed when a card is chosen changes the frame of the card. This is not correct, because the frame won't be correctly changed since there is a transform applied to the card. UIView documentation says that only bounds and center should be changed when a transform is present.
There is a simple fix, though. Instead of changing the frame, just change the center to the center of the newly calculated frame.
You should add the social_media_url attribute to your podspec for extra internet win!
It's relatively useful right now, but should be much more useful soon with feeds.cocoapods.org and the upcoming search changes :)
In my application, I create the swipe to choose views before setting the frame. This causes some problems when swiping a view programmatically, because it does not update the originalCenter before swiping the view programmatically.
For instance, the center is incorrect so swipe is "cancelled" (because of mdc_directionOfExceededThreshold
which uses originalCenter to calculate if the view has exceeded the threshold) and animates back to the originalCenter, which is not where it was before. Maybe mdc_swipe:
should update the originalCenter before it 'swipes' the view?
Just a suggestion. I got around this by setting the frames when I create the views.
Thanks for this! It's very well written and saved me a lot of time.
Hey. I tried installing this component via pods to use it with Swift, but got an error which I cant figure out how to fix (as I know zero Objective-C). Maybe some1 could take a quick look ? Cheers in advance !
I created a new new project.
did pod init
inside.
added pod "MDCSwipeToChoose"
to Podfile.
ran pod install
Opened the newly created workspace.
created BridgingHeader.h
file.
Added #import <MDCSwipeToChoose/MDCSwipeToChoose.h>
Added BridgingHeader.h
path to apps target Swift Compiler - Code Generator section.
I'm trying to use a UIImageView as a custom view for the nope and liked views like so:
MDCSwipeToChooseView *view = [[MDCSwipeToChooseView alloc] initWithFrame:swipeFrame
options:options];
UIImageView *likedView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
[likedView setImage:[UIImage imageNamed:@"LikedImage"]];
view.likedView = likedView;
view.imageView.image = [UIImage imageNamed:@"ImageName"];
But nothing changes. Don't know why that should happen, considering view.imageView
is obviously mutable. I also tried using a custom label instead of an imageView for testing purposes to no avail.
I can't create custom UIView properly inside my view controller. What I want is four buttons (UNDO, DISLIKE, LIKE, INFO) in vertical side. But my UNDO and INFO button not appeared properly inside my view controller.
let ChoosePersonButtonHorizontalPadding:CGFloat = 40.0
let ChoosePersonButtonVerticalPadding:CGFloat = 20.0
func constructUndoButton() -> Void{
let button:UIButton = UIButton.buttonWithType(UIButtonType.System) as UIButton
let image:UIImage = UIImage(named:"undo")!
button.frame = CGRectMake(ChoosePersonButtonHorizontalPadding, CGRectGetMaxY(self.backCardView.frame) + ChoosePersonButtonVerticalPadding, image.size.width, image.size.height)
button.setImage(image, forState: UIControlState.Normal)
button.addTarget(self, action: "undoFrontCardView", forControlEvents: UIControlEvents.TouchUpInside)
self.view.addSubview(button)
}
func constructNopeButton() -> Void{
let button:UIButton = UIButton.buttonWithType(UIButtonType.System) as UIButton
let image:UIImage = UIImage(named:"nope")!
button.frame = CGRectMake(ChoosePersonButtonHorizontalPadding, CGRectGetMaxY(self.backCardView.frame) + ChoosePersonButtonVerticalPadding, image.size.width, image.size.height)
button.setImage(image, forState: UIControlState.Normal)
button.addTarget(self, action: "nopeFrontCardView", forControlEvents: UIControlEvents.TouchUpInside)
self.view.addSubview(button)
}
func constructLikedButton() -> Void{
let button:UIButton = UIButton.buttonWithType(UIButtonType.System) as UIButton
let image:UIImage = UIImage(named:"liked")!
button.frame = CGRectMake(CGRectGetMaxX(self.view.frame) - image.size.width - ChoosePersonButtonHorizontalPadding, CGRectGetMaxY(self.backCardView.frame) + ChoosePersonButtonVerticalPadding, image.size.width, image.size.height)
button.setImage(image, forState:UIControlState.Normal)
button.addTarget(self, action: "likeFrontCardView", forControlEvents: UIControlEvents.TouchUpInside)
self.view.addSubview(button)
}
func constructInfoButton() -> Void{
let button:UIButton = UIButton.buttonWithType(UIButtonType.System) as UIButton
let image:UIImage = UIImage(named:"info")!
button.frame = CGRectMake(CGRectGetMaxX(self.view.frame) - image.size.width - ChoosePersonButtonHorizontalPadding, CGRectGetMaxY(self.backCardView.frame) + ChoosePersonButtonVerticalPadding, image.size.width, image.size.height)
button.setImage(image, forState:UIControlState.Normal)
button.addTarget(self, action: "infoFrontCardView", forControlEvents: UIControlEvents.TouchUpInside)
self.view.addSubview(button)
}
Result (ignore the image and button colour part)
What I want
Please advice.
Hello,
This isn't an issue, just a simple question for the author. I really like the animated gif you have when demoing the functionality of your app! How did you do it/what software did you use? Thank you so much!
Best,
Bennett
The lastest pod has errors in some contexts, see #23.
I got this two error messages after updated xcode 6.3.1.
/Users/MNurdin/Documents/Github/MDCSwipeToChoose/Examples/SwiftLikedOrNope/SwiftLikedOrNope/ChoosePersonViewController.swift:46:14: Initializer does not override a designated initializer from its superclass
/Users/MNurdin/Documents/Github/MDCSwipeToChoose/Examples/SwiftLikedOrNope/SwiftLikedOrNope/ChoosePersonViewController.swift:47:9: Must call a designated initializer of the superclass 'UIViewController'
Code
override init(){
super.init()
}
Please advice. Thank you.
I got this warning message after update latest pod.
/Users/MNurdin/Documents/iOS/xxxxx/Pods/MDCSwipeToChoose/MDCSwipeToChoose/Public/Views/UIView+MDCSwipeToChoose.m:170:43: Absolute value function 'fabsf' given an argument of type 'CGFloat' (aka 'double') but has parameter of type 'float' which may cause truncation of value
Code
- (void)mdc_executeOnPanBlockForTranslation:(CGPoint)translation {
if (self.mdc_options.onPan) {
CGFloat thresholdRatio = MIN(1.f, fabsf(translation.x)/self.mdc_options.threshold);
MDCSwipeDirection direction = MDCSwipeDirectionNone;
if (translation.x > 0.f) {
direction = MDCSwipeDirectionRight;
} else if (translation.x < 0.f) {
direction = MDCSwipeDirectionLeft;
}
MDCPanState *state = [MDCPanState new];
state.view = self;
state.direction = direction;
state.thresholdRatio = thresholdRatio;
self.mdc_options.onPan(state);
}
}
Please check my pull request.
How to add action on frontCardViewFrame() using this one
self.addTarget(self, action: "personInfo", forControlEvents: UIControlEvents.TouchUpInside)
Is it possible to have more than one card in the background?
Perhaps MDCSwipeToChooseView could have an init for just initWithOptions or expose options property
In ios 7, when the view is using autolayout with constaints, it only rotates when doing pan, it seems that
view.center = MDCCGPointAdd(self.mdc_viewState.originalCenter, translation);
isn't working properly in this case (in ios8 it works as expected). What I did to solve this is instead of changing the center property I changed the constraints values, I couldn't figure out another solution. It would be something like this:
[self updatePositionWithDelta: [gestureRecognizer translationInView:self.superview];];
(void) updatePositionWithDelta:(CGPoint)delta {
self.topSpace.constant = originalTop + delta.y;
self.bottomSpace.constant = originalBottom - delta.y;
self.leadingSpace.constant = originalLeading + delta.x;
self.trailingSpace.constant = originalTrailling - delta.x;
[self updateConstraintsIfNeeded];
}
Hope it helps improving the control.
While using Swift code If any card is clicked by choosing the buttons instead of Pan gesture - the animation is not showing up.
In Xcode console we see this error.
SwiftLikedOrNope[3704] <Error>: CGAffineTransformInvert: singular matrix
Tried to fix this by initializing originalTransform in UIView+MDCSwipeToChoose.m
self.mdc_viewState.originalTransform = CGAffineTransformMake(1, 0, 0, 1, 0, 0);
Donno is this the right way or not, comment or suggest a better solution. If our approach is right, let me know if you want me to make a pull request and check in the code.
I got this error message in ChoosePersonView.swift.
init(frame: CGRect, person: Person, options: MDCSwipeToChooseViewOptions) {
super.init(frame: frame, options: options)
self.person = person
self.imageView.image = self.person.Image! //error here
self.autoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth
UIViewAutoresizing.FlexibleBottomMargin
self.imageView.autoresizingMask = self.autoresizingMask
constructInformationView()
}
When user tap Liked or Nope button . The action works correctly except that the frontView is completely disappear without any animation . How can I solve this ? The example app works just fine .But when I use it on my project ,it does not work.
Hi - Any plans to include other directions? For example ability to swipe up and down?
Thanks for this great control!
-Mez
Im trying to swipe a View Programmatically but [self.swipeToChooseView mdc_swipe:MDCSwipeDirectionLeft]; has not been working.Am i doing something wrong?
Grateful for such a great control, I am in the process of using each Liked or Nope will have a memory leak. May I ask how to deal with memory leaks?
Content from GOOGLE translation problem.
Running the Swift example: SwiftLikedOrNope I get the following error while:
fatal error: unexpectedly found nil while unwrapping an Optional value
The error is reported in class ChoosePersonView: MDCSwipeToChooseView Line 43
self.imageView.image = self.person.Image!
I want my own custom view .
the View will have an image and some labels at image bottom like in tinder.
how can i do this ?
Please tell me
Hi thanks for sharing , how do I to make 3 cards like tinder, ? I tried but did not worked
Thanks
I have implemented MDCSwipeToChoose into a swift project and have the view controller currently swiping, however I am having alot of trouble getting the graphics down and loading the stack as it is done in likeornope.. Is there any chance there is a swift version of likeornope available or will one be coming soon. I think I speak for many new IOS developers by saying this would be extremely useful.
Thanks,
Rich
I got warning message for this code
- (void)viewDidLoad {
[super viewDidLoad];
// You can customize MDCSwipeToChooseView using MDCSwipeToChooseViewOptions.
MDCSwipeToChooseViewOptions *options = [MDCSwipeToChooseViewOptions new];
options.delegate = self; // warning message
options.likedText = @"Keep";
options.likedColor = [UIColor blueColor];
options.nopeText = @"Delete";
options.onPan = ^(MDCPanState *state){
if (state.thresholdRatio == 1.f && state.direction == MDCSwipeDirectionLeft) {
NSLog(@"Let go now to delete the photo!");
}
};
MDCSwipeToChooseView *view = [[MDCSwipeToChooseView alloc] initWithFrame:self.view.bounds
options:options];
view.imageView.image = [UIImage imageNamed:@"finn"];
[self.view addSubview:view];
}
Is it possible to change card border width and color?
I love MDCSwipeToChoose! It works great and I was thrilled when I saw the demo app.
There's a problem, though. You can't use it in interface builder because MDCSwipeToChooseView uses a custom initializer. That forces me to do manual layout for my views, which is really tragic. Or I can use complicated wrappers to load my subviews from nibs and stuff them into an MDCSwipeToChooseView subclass.
It would be better to refactor into a traditional collection/subview model, like UITableView, UICollectionView, etc. See ZLSwipeableView for a design example. ZLSwipeableView is an interesting case - I'm not crazy about the control behavior but the API design is very nice.
This would have additional benefits too:
Thanks for making such a nice control!
Looks like the Travis CI build is failing: https://travis-ci.org/modocache/MDCSwipeToChoose/builds/54823755
The error message is strange: Reason: The run destination iPad 2 is not valid for Testing the scheme 'MDCSwipeToChoose'.
Hi,
Besides swiping the card left or right for 'skip' or 'add' respectively, I need to give the user the option to swipe down to mark 'seen'.
How do I go about modifying the MDCSwipeToChoose library? Is this structurally possible?
Any guidance in this regards will help me tremendously.
Thanks,
Varun
A delegate method that gets fired when swiping begins would be cool. Is this possible? I haven't looked too deeply into the code yet.
I got this two error messages after updated xcode 6.3.1.
/Users/MNurdin/Documents/Github/MDCSwipeToChoose/Examples/SwiftLikedOrNope/SwiftLikedOrNope/ImageLabelView.swift:32:14: Initializer does not override a designated initializer from its superclass
/Users/MNurdin/Documents/Github/MDCSwipeToChoose/Examples/SwiftLikedOrNope/SwiftLikedOrNope/ImageLabelView.swift:33:9: Must call a designated initializer of the superclass 'UIView'
Code
override init(){
super.init()
imageView = UIImageView()
label = UILabel()
}
Please advice. Thank you.
How do the green liked and red nope images fade in on the image as you swipe? I don't see those images anywhere and I can't find that functionality in the code.
I can't install pod for swift project.
diff: /../Podfile.lock: No such file or directory
diff: /Manifest.lock: No such file or directory
error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.
When swiping, the pan gesture recognizer doesn't account for the velocity of the swipe when the gesture completes. This means that a short flick, which feels like it should send the card off-screen, moves the card slightly and returns it back to the center.
This should be a relatively simple process of passing the pan gesture recognizer to the finalization method so that the velocity can be accessed and processed.
Hi,
It'd be quite cool to have an ability to set that duration instead of having predefined 0.1
or overriding entire onChosen
property. Can do PR for that by introducing another static property to header file e.g.
@property (nonatomic, assign) NSTimeInterval exitScreenAnimationDuration;
instead of
options.onChosen = [MDCSwipeOptions exitScreenOnChosenWithDuration:0.5 options:UIViewAnimationOptionCurveLinear];
What do you think?
I got this error message in this code
- (BOOL)view:(UIView *)view shouldBeChosenWithDirection:(MDCSwipeDirection)direction {
if (direction == MDCSwipeDirectionLeft) {
return YES;
} else {
// Snap the view back and cancel the choice.
[UIView animateWithDuration:0.16 animations:^{
view.transform = CGAffineTransformIdentity;
view.center = self.superview.center;
}];
return NO;
}
}
What I'd expect:
returning NO
from
- (BOOL)view:(UIView *)view shouldBeChosenWithDirection:(MDCSwipeDirection)direction;
would throw the view to its initial state.
What actually happens:
view remains in the same position as it was after last dragging.
Workaround
manually call mdc_returnToOriginalCenter
.
Suggested solution
Since mdc_returnToOriginalCenter
is private, I think it'd be great to either make it public or modify mdc_exitSuperviewFromTranslation
in the following manner:
if ([delegate respondsToSelector:@selector(view:shouldBeChosenWithDirection:)]) {
BOOL should = [delegate view:self shouldBeChosenWithDirection:direction];
if (!should) {
[self mdc_returnToOriginalCenter]; //< added
return;
}
(note that it now includes a call to mdc_returnToOriginalCenter
)
Another problem is that you'd need to hack around to restore the view's state in this case, i.e. if you were overlaying something on top of the view, no appropriate callbacks will be called. It seems like adding onCancel
block property to accompany MDCSwipeOptions
's onPan
and onChosen
would be a viable solution and won't get anyone into compatibility troubles.
I would provide a PR if you agree that this is a problem and my solution will be good enough.
BTW, thanks for saving us a few hours of work with this thing! :)
After entering pod install in the LikedOrNope directory, I am getting this error.
MacBook-Pro:LikedOrNope varungoel$ pod install
Analyzing dependencies
/Users/varungoel/.rvm/gems/ruby-2.0.0-p353@global/gems/cocoapods-0.33.1/lib/cocoapods/executable.rb:55: warning: Insecure world writable dir /usr/local/bin in PATH, mode 040777
[!] An error occurred while performing git pull
on repo master
.
[!] /usr/bin/git pull --ff-only
error: RPC failed; result=56, HTTP code = 200
fatal: The remote end hung up unexpectedly
fatal: early EOF
fatal: index-pack failed
Has anyone been able to install this pod successfully?
It could be a nice feature to be able to undo the last swipe?
Should clarify in the docs that the user has to manually call wasChosenWithDirection
when using the mdc_swipe function on the MDCSwipeToChooseView.
In my case, the front card view would not be removed either.
Here's a basic sample of getting it to work:
[self.frontCardView mdc_swipe:MDCSwipeDirectionLeft];
[self.frontCardView removeFromSuperview];
[self view:self.swipeView wasChosenWithDirection:MDCSwipeDirectionLeft];
[self.frontCardView mdc_swipe:MDCSwipeDirectionRight];
[self.frontCardView removeFromSuperview];
[self view:self.swipeView wasChosenWithDirection:MDCSwipeDirectionRight];
Hi,
At first, thank you so much for the amazing work!
I would like to disable the swiping between images to upvote or downvote. I would only like to use the green and red thumb for upvote or downvote.
How can I make this possible? I found the void setupSwipeToChoose but when I remove this the first image will work, the second image will be stuck on the screen.
Thank you!
I got this two error messages after updated xcode 6.3.1.
/Users/MNurdin/Documents/Github/MDCSwipeToChoose/Examples/SwiftLikedOrNope/SwiftLikedOrNope/ChoosePersonViewController.swift:111:10: Method 'setFrontCardView' with Objective-C selector 'setFrontCardView:' conflicts with setter for 'frontCardView' with the same Objective-C selector
Code
func setFrontCardView(frontCardView:ChoosePersonView) -> Void{
// Keep track of the person currently being chosen.
// Quick and dirty, just for the purposes of this sample app.
self.frontCardView = frontCardView
self.currentPerson = frontCardView.person
}
Please advice. Thank you.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.