Swiping A View with Gestures - iphone

I am trying to develop an application to Iphone; but i am new-bee so i have got a lot of problems.
My application has got a default view and another small view in the main view that name is flashcard.
I want to add capability this view swiping (or sliding) like Photos in Iphone. For example if user swipes view until the inner view's center reaches bounds of main view there will be two possibilities,
1- if user finish swiping before reach inner view will return to original position.
2- if user don't stop swiping, inner view will go out at screen from swipe direction and return the screen from the opposite direction.
So i declare UIPanGestureRecognizer at viewDidLoad like below
UIPanGestureRecognizer *panFlashCard = [[UIPanGestureRecognizer alloc]
initWithTarget:self action:#selector(handlePanFlashCard:)];
[flashcard addGestureRecognizer:panFlashCard];
[panFlashCard release];
handPanFlashCard action:
UIView *piece = [recognizer view];
CGPoint center = piece.center;
CGFloat x = 160; // the original x axis of inner view
if ([recognizer state] == UIGestureRecognizerStateChanged) {
CGPoint translation = [recognizer translationInView:piece ];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.55];
[piece setCenter:CGPointMake(piece.center.x + translation.x, center.y)];
[UIView commitAnimations];
CGFloat totalX;
totalX= x + translation.x;
if(translation.x <0)
{
if (totalX <= 0)
{
[self showNextCard];
}
else
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.55];
[piece setCenter:CGPointMake(self.view.center.x, center.y)];
[UIView commitAnimations];
}
}
else
{
if (totalX >= self.view.bounds.size.width)
{
[self showPreviousCard];
}
else
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.55];
[piece setCenter:CGPointMake(self.view.center.x, center.y)];
[UIView commitAnimations];
}
}
}
showNextCard action:
[flashcard setCenter:CGPointMake(self.view.bounds.size.width + flashcard.bounds.size.width, flashcard.center.y)];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.55];
[flashcard setCenter:CGPointMake(self.view.center.x, flashcard.center.y)];
[UIView commitAnimations];
showPreviousCard action:
[flashcard setCenter:CGPointMake(0 - flashcard.bounds.size.width, flashcard.center.y)];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.55];
[flashcard setCenter:CGPointMake(self.view.center.x, flashcard.center.y)];
[UIView commitAnimations];
When i run this application, it builds and runs successfully but there is something wrong with animations, some frame mistakes i think.
Please help me to correct this code and run fluent animations while swiping.

If I understand what you are trying to do then you can just use built in controls for this. Take a look at the pagingEnabled property on the UIScrollView class. There is also a sample project called PhotoScroller that may help.
http://developer.apple.com/library/ios/#samplecode/PhotoScroller/Introduction/Intro.html

Related

View animation frame change

Are emerging in the subview scrolling animation. However actionsheet place when you scroll subview, not again appear in the first place.
if(checkboxState == 0)
{
NSTimeInterval animationDuration = 0.8;
CGRect newFrameSize = CGRectMake(0, 155,320,120);
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:animationDuration];
subview.frame = newFrameSize;
[UIView commitAnimations];
}
else if(checkboxState == 1)
{
NSTimeInterval animationDuration = 0.8;
CGRect newFrameSize = CGRectMake(0, 105,320,120);
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:animationDuration];
subview.frame = newFrameSize;
[UIView commitAnimations];
}
Pressing the View is a checkbox in the above code is provided to move up and down. However, even though actionsheet slipped up again when the first view is in place.
View is scrolled up, how can we keep it that way, even if opened actionsheet?
Use [UIView setAnimationBeginsFromCurrentState:YES]; after both "beginAnimation".
Then the previous changes will be saved.
I fixed the problem by using the
subview.bounds
Thank you for your helps.

Pre-cache UIView's animation?

I've set up a UIViewController that holds two other controllers:
MainVC -> SubVC1
-> SubVC2
At start, I show the SubVC1's view. The user can then switch to SubVC2's view:
- (void)showOtherSide:(id)sender
{
UIView *currentView = [self.view.subviews objectAtIndex:0];
BOOL flipToRight;
UIView *newView;
if (currentView == subVC1.view)
{
newView = subVC2.view;
flipToRight = YES;
}
else
{
newView = subVC1.view;
flipToRight = NO;
}
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
if (flipToRight)
{
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:currentView cache:YES];
}
else
{
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:currentView cache:YES];
}
[currentView removeFromSuperview];
[self.view addSubview:newView];
[UIView commitAnimations];
}
The problem now is that even in the simulator the first back and forth flips don't show up, instead the user sees the new view immediately. Because I set the animation caching to YES, the following flips show the animation (at least most of the time!).
I tried to put the animation code in the viewDidAppear: method too, but without any improvement.
Are there any good practices to pre-cache the animations?

Flip View Animation Not Working

I am working on an iPad app that presents a question to the user in a view. When they answer the question, I would like the view to transition to another view that contains the next question. To make it look all fancy, I am trying to add a curl transition to it but the code I wrote does not work can I can't see to find the problem. It does show the correct view but there is no transition animation. What's with that? Here is the method I use to transition:
- (void)pageChangedTo:(NSInteger)page {
if ( (page == currentQuestionNumber) || (page > ( [self.allQuestions count] - 1 ) ) || (page < 0) ) {
return;
}
AskQuestionView *view = [self.questionViews objectAtIndex:page];
UIViewAnimationTransition transition;
if (page > currentQuestionNumber) {
transition = UIViewAnimationTransitionCurlUp;
}
else {
transition = UIViewAnimationTransitionCurlDown;
}
if (self.containerView1.superview) {
self.containerView2 = view;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:transition forView:self.containerView1 cache:YES];
[self.containerView1 removeFromSuperview];
[askQuestionsView addSubview:self.containerView2];
[UIView commitAnimations];
}
else {
self.containerView1 = view;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:transition forView:self.containerView2 cache:YES];
[self.containerView2 removeFromSuperview];
[askQuestionsView addSubview:self.containerView1];
[UIView commitAnimations];
}
currentQuestionNumber = page;
}
Can anyone tell me why this isn't working? I would very much appreciate it!
Set your animation transition forView: _container of_self.containerView2: not the one that's being removed, but the one it's being removed from.

iphone view overlay

I have a client who recently requested this:
My thoughts were that the text could be better displayed on the back of a flipover view and that it looks like it could be an issue in the approval process. Is There any way to even do this, do I even want to try? Are there resources you can share?
Thanks in advance.
EDIT: I should clarify that the NavigationBar and the Table would slide over when taping the picture behind. One tap would make it show and the other tap would make the bar and the table hide.
This is actually pretty good. It's often hard to get clients to give you requirements, and this at least shows you what they're trying to achieve. I'd spend some time reworking the UI so that it will be acceptable in the app store (assuming you're going to publish there) and perhaps more in keeping with the normal use of iOS UI elements. Prepare to give your client a bit of an explanation about why this particular design leaves something to be desired, but try to come up with a design that they'll agree is obviously better. (There's plenty of room for improvement here, so it shouldn't be too hard.)
If your client is absolutely wedded to this exact UI, it might be time to find a new client. But if they're reasonable, thoughtful, and a little bit flexible, this might be the beginning of a nice app.
You can do this. Put the picture (UIImageView) inside a wrapper UIView. Put the text in a UITextView also in the wrapper UIView. Then animate a flip transition between them that brings whichever one you want to the bottom of the subview stack.
You can check for potential UI violations in Apple's HIG: http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html
+(id)showAlert{
UIViewController *controller = [[UIViewController alloc] initWithNibName:#"Overlay" bundle:nil];
Overlay *alert = (Overlay*)controller.view;
//alert.iTag = iiTag;
alert.tag = iiTag;
return alert;
}
-(void)addAnimation{
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.001, 0.001);
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/1.5];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(bounce1AnimationStopped)];
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.1, 1.1);
[UIView commitAnimations];
}
- (void)bounce1AnimationStopped {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/2];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(bounce2AnimationStopped)];
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.9,0.9);
[UIView commitAnimations];
}
- (void)bounce2AnimationStopped {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/2];
self.transform = CGAffineTransformIdentity;
[UIView commitAnimations];
}
- (CGAffineTransform)transformForOrientation {
UIInterfaceOrientation orientation = [UIApplication sharedApplication].statusBarOrientation;
if (orientation == UIInterfaceOrientationLandscapeLeft) {
return CGAffineTransformMakeRotation(M_PI*1.5);
} else if (orientation == UIInterfaceOrientationLandscapeRight) {
return CGAffineTransformMakeRotation(M_PI/2);
} else if (orientation == UIInterfaceOrientationPortraitUpsideDown) {
return CGAffineTransformMakeRotation(-M_PI);
} else {
return CGAffineTransformIdentity;
}
}
-(void)stopAnimatton{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationDelay:2.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDelegate:self];
self.transform = CGAffineTransformMake(00.1, 00.1,0.001, 0.001, 0.001, 0.001);
[UIView commitAnimations];
}

How can I present a UIView from the bottom of the screen like a UIActionSheet?

I'd like a UIView to slide up from the bottom of the screen (and stay mid-screen) like a UIActionSheet. How can I accomplish this?
UPDATE:
I am using the following code:
TestView* test = [[TestView alloc] initWithNibName:#"TestView" bundle:nil];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
test.view.center = CGPointMake(160,100);
//test.view.frame = CGRectMake(0, 0, 160, 210);
[[[UIApplication sharedApplication] keyWindow] addSubview:test.view];
[UIView commitAnimations];
The view seems to be animating from the corner and appearing in the corner. How can I make it slide up from the bottom? Getting close!
Do what Matt did here, but just change the values and direction. I have code at home to do this from the bottom if you need it later (I'll update this post).
Link: http://cocoawithlove.com/2009/05/intercepting-status-bar-touches-on.html
Also, don't forget to take out the bit of code that shifts the main view downward (so instead the UIView just pops over top like an ActionSheet)
Updated with code:
This is what I use in one of my apps to show/hide a little "options" view:
- (void)toggleOptions:(BOOL)ViewHidden
{
// this method opens/closes the player options view (which sets repeat interval, repeat & delay on/off)
if (ViewHidden == NO)
{
// delay and move view out of superview
CGRect optionsFrame = optionsController.view.frame;
[UIView beginAnimations:nil context:nil];
optionsFrame.origin.y += optionsFrame.size.height;
optionsController.view.frame = optionsFrame;
[UIView commitAnimations];
[optionsController.view
performSelector:#selector(removeFromSuperview)
withObject:nil
afterDelay:0.5];
[optionsController
performSelector:#selector(release)
withObject:nil
afterDelay:0.5];
optionsController = nil;
}
else
{
optionsController = [[PlayOptionsViewController alloc] init];
//
// Position the options at bottom of screen
//
CGRect optionsFrame = optionsController.view.frame;
optionsFrame.origin.x = 0;
optionsFrame.size.width = 320;
optionsFrame.origin.y = 423;
//
// For the animation, move the view up by its own height.
//
optionsFrame.origin.y += optionsFrame.size.height;
optionsController.view.frame = optionsFrame;
[window addSubview:optionsController.view];
[UIView beginAnimations:nil context:nil];
optionsFrame.origin.y -= optionsFrame.size.height;
optionsController.view.frame = optionsFrame;
[UIView commitAnimations];
}
}
One way would be to use the present modal view controller on the view controller:
presentModalViewController:(UIViewController *)modalViewController animated:(BOOL)animated
For more info take a look at the UIViewController documentation.
EDIT: If you want a mid-screen view you'll need to animate it into position as #jtbandes has pointed out. I suggest also adding some candy to UIView animation block:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
myView.center = CGPointMake(x,y);
[UIView commitAnimations];
You can then move it again if you need to go full screen or dismiss it.
You'll have to move the view yourself, by setting its center or frame. I'll let you figure out what to set those to. But for the animation:
// set the view to its initial position here...
[UIView beginAnimations:nil context:NULL];
// move the view into place here...
[UIView commitAnimations];
Check out this post: http://blog.yetanotherjosh.com/post/33685102199/3-ways-to-do-a-vertical-transition-with
I'm going with the modal window approach.
Try this solution.... it works
#pragma mark - Date Selector View PresentModelView with Transparent ViewController
- (void) showModal:(UIView*) modalView {
CGRect rect=modalView.frame;
rect.origin=CGPointMake(0, 0);
self.tutorialView.frame=rect;
UIWindow *mainWindow = [(AppDelegate *)[UIApplication sharedApplication].delegate window];
CGPoint middleCenter;
middleCenter = CGPointMake(modalView.center.x, modalView.center.y);
CGSize offSize = [UIScreen mainScreen].bounds.size;
CGPoint offScreenCenter = CGPointMake(offSize.width / 2.0, offSize.height * 1.5);
modalView.center = offScreenCenter;
if ([[mainWindow subviews] containsObject:modalView]) {
[modalView removeFromSuperview];
}
[mainWindow addSubview:modalView];
[mainWindow bringSubviewToFront:modalView];
// Show it with a transition effect
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
// animation duration in seconds
modalView.center = middleCenter;
[UIView commitAnimations];
}
// Use this to slide the semi-modal view back down.
- (void) hideModal:(UIView*) modalView {
CGSize offSize = [UIScreen mainScreen].bounds.size;
CGPoint offScreenCenter = CGPointMake(offSize.width / 2.0, offSize.height * 1.5);
[UIView beginAnimations:nil context:(__bridge void *)(modalView)];
[UIView setAnimationDuration:0.3];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(hideModalEnded:finished:context:)];
modalView.center = offScreenCenter;
[UIView commitAnimations];
}
- (void) hideModalEnded:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {
UIView *modalView = (__bridge UIView *)context;
[modalView removeFromSuperview];
}