subview animation in iPhone - iphone

I am using below code to show hide my subview:
[self.view addSubview:selectorView];
[selectorView setFrame:CGRectOffset([selectorView frame], 0, -selectorView.frame.size.height)];
viewVisible = NO;
- (IBAction)onButtonClick:(id)sender {
[self showHideView]; // Show and hide our imageView in an animated fashion}
- (void)showHideView {
if (viewVisible) { // If our imageView is on screen hide the view
[UIView beginAnimations:#"animateImageOff" context:NULL]; // Begin animation
[selectorView setFrame:CGRectOffset([selectorView frame], 0, -selectorView.frame.size.height)]; // Move imageView off screen
[UIView commitAnimations]; // End animations
viewVisible = NO;
[showHideButton setTitle:#"Show" forState:UIControlStateNormal]; // Change button title to "Show"
} else { // if our imageView is off screen show the view
[UIView beginAnimations:#"animateImageOn" context:NULL]; // Begin animation
[selectorView setFrame:CGRectOffset([selectorView frame], 0, selectorView.frame.size.height)]; // Move imageView on screen
[UIView commitAnimations]; // End animations
viewVisible = YES;
[showHideButton setTitle:#"Hide" forState:UIControlStateNormal]; // Change button title to "Hide"
}}
How can I set the subview Y-axis value in this code because when the subview gets on the screen it hides my screen header bar And I am using a button to show/hide the subview, I also want to animate that button so that when the button is clicked, button's position should also be changed along Y-axis.
Here are the screenshots for what I want

Try to bring your your header view to front in the MainView:
[self.view bringSubviewToFront:headerView];
And the image button animation you can do this:
[UIView animateWithDuration:1.0 animations:^{
CGFloat degrees = 180;
CGAffineTransform transform =
CGAffineTransformMakeRotation(degrees/180 * 3.14);
imageButton.transform = transform;
}];

Related

Insert a UIView between 2 other UIViews to create a list with 3 UIView's

I have in my application one ViewController that requires a UIScrollView
In this UIScrollView i have many UIButton's. When i press one button bellow the button that i touched i want to show a UIView animating his entrance. Just like a accordion, like this: Jquery demo
Currently i have this method to open the "accordion":
-(void) openView:(UIView *)view inFrame:(CGRect)final {
CGRect frame = view.frame;
frame.size.height = 0;
frame.origin = finalFrame.origin;
view.frame = frame;
[self.buttonsView addSubview:view];
[UIView animateWithDuration:1.0 animations:^{
view.frame = finalFrame;
} completion:^(BOOL finished){
}];
}
the self.buttonsView is the UIView that i use inside my scrollview.
With this method i can insert a view rigth after my button. But the problem is: I can't open the space between the buttons to enlarge my buttonsView
is there a way to do this?
button1
button2
button3
button 2 clicked:
button1
button2
a view
button3
button 2 clicked again:
button1
button2
button3
And i can't use UITableView
Modify your openView:inFrame: method to also animate the frames of all the buttons below the one you tapped.
Please try this
//in .h file declare one variable
IBOutlet UIButton *btnpreviouslySelected;
CGRect customerButtonFrame,inventoryButtonFrame,templatesButtonFrame;
Consider btnCustomer,btnInventroy,btntemplate are your three buttons & assign them tag as 1,2,3 resp.
viewsearch is new view which you want to add in between two buttons
//in .m
//in view did load method set following
btnpreviouslySelected=nil;
customerButtonFrame=btnCustomer.frame;
inventoryButtonFrame=btnInventory.frame;
templatesButtonFrame=btnTemplates.frame;
-(void) RepositioningFrameMneuTree
{
btnCustomer.frame=customerButtonFrame;
btnInventory.frame=inventoryButtonFrame;
btnTemplates.frame=templatesButtonFrame;
}
-(void) RepositioningMenuTree:(int)iCaseValue
{
if (iCaseValue==1)
{
btnInventory.center=CGPointMake(btnInventory.center.x,btnInventory.center.y+300);
}
if (iCaseValue==2 || iCaseValue==1)
{
btnTemplates.center=CGPointMake(btnTemplates.center.x,btnTemplates.center.y+300);
}
}
-(IBAction) buttonClicked:(UIButton*)btn;
{
if(btnpreviouslySelected==btn)
{
//set to default location
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
//here remove search view
[viwSearchView removeFromSuperview];
[self RepositioningFrameMneuTree];
[UIView commitAnimations];
return;
}
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
//assign previousbutton to new button
btnpreviouslySelected=btn;
[self RepositioningFrameMneuTree];
viwSearchView.frame=CGRectMake(0,btn.frame.origin.y+45,viwSearchView.frame.size.width,viwSearchView.frame.size.height);
//add search view on your view
[self.buttonsview addSubview:viwSearchView];
//-------------------------------------------
//change the location of button below selected button to show the search button
switch (btn.tag) {
case 1:
[self RepositioningMenuTree:1];
break;
case 2:
[self RepositioningMenuTree:2];
break;
case 3:
//dont do any thing
break;
default:
break;
}
//end animation
[UIView commitAnimations];
}

UIAnimation - Show UIView from button.frame.origin.y

I have a UIButton somewhere on my view. On touch event of button I making a UIView appear. The UIAnimation I have used make the view appear from top of window. But I want it to appear from button.frame.origin.y . Before touching the button the view is not visible. On touching the button view should start appearing from above position.
Here is the code :
-(IBAction) ShowInfowView:(id)sender{
CGRect rect = viewInfo.frame;
rect.origin.y = rect.size.height - rect.size.height+58.0;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.70];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
viewInfo.frame = rect;
[UIView commitAnimations];
}
This is how I am hiding the view again :
-(IBAction) HideInfoView:(id)sender{
CGRect rect = viewInfo.frame;
rect.origin.y = -rect.size.height;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.70];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
viewInfo.frame = rect;
[UIView commitAnimations];
}
In viewDidLoad I am doing the following :
CGRect rect = viewInfo.frame;
rect.origin.y = -rect.size.height;
viewInfo.frame = rect;
UPDATE:
Please see this example. Here view is appearing from top of screen. I want it to appear from button y axis. For that matter please consider button y position a bit upwards.
So you want a slide-in effect, but not from the top of the screen, just some arbitrary value?
One way to do it:
1) You should create a view that has the dimensions and position of your desired view AFTER animation finishes, we'll call it baseview.
2) Set this baseview property clipsToBounds to YES. This will make all subviews that are outside of the baseview's frame invisible.
3) Add your animating view as a subview of the baseview, but set the frame so it is invisible (by plcacing it above the baseview):
frame = CGRectMake(0, -AnimViewHeight, AnimViewWidth, AnimViewHeight);
4) Animate the animview frame:
//put this inside of an animation block
AnimView.frame = CGRectMake(0, 0, AnimViewWidth, AnimViewHeight);
EDIT:
Example:
//define the tags so we can easily access the views later
#define BASEVIEW_TAG 100
#define INFOVIEW_TAG 101
- (void) showInfo
{
//replace the following lines with preparing your real info view
UIView * infoView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
[infoView setBackgroundColor: [UIColor yellowColor]];
[infoView setTag: INFOVIEW_TAG];
//this is the frame of the info view AFTER the animation finishes (again, replace with real values)
CGRect targetframe = CGRectMake(100, 100, 100, 100);
//create an invisible baseview
UIView * baseview = [[UIView alloc] initWithFrame:targetframe];
[baseview setBackgroundColor: [UIColor clearColor]];
[baseview setClipsToBounds: YES]; //so it cuts everything outside of its bounds
[baseview setTag: BASEVIEW_TAG];
//add the nfoview to the baseview, and set it above the bounds frame
[baseview addSubview: infoView];
[infoView setFrame:CGRectMake(0, -infoView.bounds.size.height,
infoView.bounds.size.width, infoView.bounds.size.height)];
//add the baseview to the main view
[self.view addSubview: baseview];
//slide the view in
[UIView animateWithDuration: 1.0 animations:^{
[infoView setFrame: baseview.bounds];
}];
//if not using ARC, release the views
[infoview release];
[baseview release];
}
- (void) hideinfo
{
//get the views
UIView * baseView = [self.view viewWithTag: BASEVIEW_TAG];
UIView * infoView = [baseView viewWithTag: INFOVIEW_TAG];
//target frame for infoview - slide up
CGRect out_frame = CGRectMake(0, -infoView.bounds.size.height,
infoView.bounds.size.width, infoView.bounds.size.height);
//animate slide out
[UIView animateWithDuration:1.0
animations:^{
[infoView setFrame: out_frame];
} completion:^(BOOL finished) {
[baseView removeFromSuperview];
}];
}
I have done exactly what you're trying in my recent project.
The following steps should make this work:
1. In your viewDidLoad: you init your viewToFadeIn like this:
viewToFadeIn = [[UIView alloc] initWithFrame:CGRectMake(20,self.view.frame.size.height+10, self.view.frame.size.widh-40, 200)];
//its important to initalize it outside your view
//your customization of this view
[self.view addSubview:viewToFadeIn];
2.your ShowInfowView: Method should look like this:
` -(IBAction) ShowInfowView:(id)sender{
[UIView beginAnimations:#"fadeIn" context:NULL];
[UIView setAnimationDuration:0.25];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationFinished:finished:context:)];
viewToFadeIn.transform = CGAffineTransformMakeTranslation(0, -290);
//290 is in my case, try a little for your correct value
[UIView commitAnimations];
}
3.yourHideInfoView:` Method looks like this
-(IBAction) HideInfoView:(id)sender{
[UIView beginAnimations:#"fadeOut" context:NULL];
[UIView setAnimationDuration:0.25];
[UIView setAnimationDelegate:self];
viewToFadeIn.transform = CGAffineTransformMakeTranslation(0, 0);
[UIView commitAnimations];
}
EDIT:
4. animationFinishedMethod:
- (void)animationFinished:(NSString *)animationID finished:(BOOL)finished context:(void *)context{
if ([animationID isEqual:#"fadeIn"]) {
//Do stuff
}
if ([animationID isEqual:#"fadeOut"]) {
//Do stuff
}
}
SEE THIS
This should do the trick. Good luck
Your problem is not clear (for me).
What is this?
rect.origin.y = rect.size.height - rect.size.height+58.0;
Is 58 origin of your UIButton?
You should use sender.frame etc
Use blocks to animate like this
[UIView animateWithDuration:0.5f animations:^{
// Animation here
} completion:^(BOOL finished) {
// onComplete
}];
- (void) slideIn{
//This assumes the view and the button are in the same superview, if they're not, you'll need to convert the rects
//I'm calling the animated view: view, and the button: button...easy enough
view.clipToBounds = YES;
CGRect buttonRect = button.frame;
CGRect viewRect = CGRectMake(buttonRect.origin.x, buttonRect.origin.y + buttonRect.size.height, view.bounds.size.width, 0);
CGFloat intendedViewHeight = view.height;
view.frame = viewRect;
viewRect.size.height = intendedViewHeight;
[UIView animateWithDuration:.75 delay:0.0f options:UIViewAnimationOptionCurveEaseOut animations:^{
view.frame = viewRect;
}completion:nil];
}
This will cause the the view to appear to slide out from under the button. To slide the view back in, you just reverse the animations. If you wish to slide it up from the button, you'll need to make sure your starting 'y' is the 'y' value of the button (rather than the 'y' + 'height') and animate both the height and y values of the view that needs animating.

Creating a faded out screen effect iphone

I have a view controller....when the user presses a button I want a black screen to fade in over the top and a uiactivityindicator to appear on top of the faded screen.
How can I get this animated fade in effect?
-(IBAction) loginToApp:(id)sender{
//fade in view
}
Add another view over the top of your view, colored solid black. You can do it in IB or programatically, just make sure it has a higher z-order (is on top). Make its alpha = 0. Then:
-(IBAction) loginToApp:(id)sender{
[UIView animateWithDuration:1.5 animations:^{ myview.alpha = 1.0; }]
}
...obviously you need an outlet or variable myview connected to that view. 1.5 = seconds. Change for your needs.
Sure you can. You can create the overlay view however you wish, but this will work (assuming you create appropriate instance variables somewhere). My code was in my view controller, so [self view] returns the view I want to shade over.
shadeView = [[UIView alloc] initWithFrame:[[self view] bounds]];
shadeView.backgroundColor = [UIColor blackColor];
shadeView.alpha = 0.0f;
spinner = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorStyleWhiteLarge];
spinner.center = CGPointMake(CGRectGetMidX([shadeView bounds]),
CGRectGetMidY([shadeView bounds]));
[shadeView addSubview:spinner];
[[self view] addSubview:shadeView];
To present:
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:2.0];
[spinner startAnimating];
shadeView.alpha = 0.7f;
[UIView commitAnimations];
And to hide:
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[spinner stopAnimating];
shadeView.alpha = 0.0f;
[UIView commitAnimations];

Value of button Title animating in Core Animation Block

I am using a UIButton to represent number of notification on bar of a table that slides up/down when the button is placed. The title of the button changes dynamically to represent number of un-read notifications.
Please see partial screenshots attached.
Start Frame of Animation - Notifications showing as 2 - Correctly
End Frame of Animation - Notifications Showing as 0 - This should not change
Below is the code I am using to animate
-(IBAction) showNotifications {
if (notificationTableIsUp) {
CGRect notificationsHeaderFrame = notificationsHeader.frame;
CGRect notificationsTableFrame = notificationsTable.frame;
// Animate to pull up Notification Table
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
notificationTableIsUp = !notificationTableIsUp;
notificationsHeaderFrame.origin.y += 220;
notificationsHeader.frame = notificationsHeaderFrame;
notificationsTableFrame.origin.y += 220;
notificationsTable.frame = notificationsTableFrame;
[UIView commitAnimations];
} else {
CGRect notificationsHeaderFrame = notificationsHeader.frame;
CGRect notificationsTableFrame = notificationsTable.frame;
// Animate to pull down Notification Table
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
notificationTableIsUp = !notificationTableIsUp;
notificationsHeaderFrame.origin.y -= 220;
notificationsHeader.frame = notificationsHeaderFrame;
notificationsTableFrame.origin.y -= 220;
notificationsTable.frame = notificationsTableFrame;
[UIView commitAnimations];
}
}
- (void)viewDidLoad {
[super viewDidLoad];
notificationTableIsUp = NO;
[self updateNotificationBadgeTo:2];
}
- (void) updateNotificationBadgeTo:(NSInteger)numberOfNotifications {
notificationBadgeButton.titleLabel.font = [UIFont boldSystemFontOfSize:14];
notificationBadgeButton.titleLabel.textColor = [UIColor whiteColor];
notificationBadgeButton.titleLabel.text = [NSString stringWithFormat:#"%d", numberOfNotifications];
}
Note that the Green bar is a UIView and Notifications is a UILabel and Round button is a UIButton all set up in IB. 0 is the initial title for the button set in IB. I am setting it to 2 in viewDidLoad.
So basic problem here is when I click on the button, the value it changing from white 2 (set in viewDidLoad) to Blue 0 (Set in IB).
How can I remove this part when I am animating the slide up/down?
Thanks
Dev.
No Solution found so far. Ended up removing this feature altogether :(

How to create a collapsible UIView

I need to create a expandable and collapsible UIView of some sort and am not able to pay for a third party control.
This is basically how I would like it to behave:
At the top there should be a UIButton (or similar) that allows the user to toggle between expanded and collapsed.
When expanded I want to be able to place other UIView (e.g. calendar)and when collapsed the surrounding controls should move up.
Does anyone have any ideas how to implement this simply - noob here :(
Subclass a ViewController and have two methods that your button can fire like 'collapse' and 'expand', this might get you started: You can assign new selectors to UIButtons dynamically:
[button addTarget:self action:#selector(eventMethod:)
forControlEvents:UIControlEventTouchUpInside];
Code:
#define COLAPSED_HEIGHT 30
-(void)expand
{
CGRect s= [self getScrerenBoundsForCurrentOriantation];
CGRect f = self.view.frame;
f.origin.y =s.size.height-self.view.frame.size.height;
[UIView beginAnimations:#"expand" context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationFinished:finished:context:)];
self.view.frame=f;
//CHANGE YOUR EXPAND/COLLAPSE BUTTON HERE
[UIView commitAnimations];
self.thumbScrollerIsExpanded=YES;
}
-(void)collapseView
{
//re-factored so that this method can be called in ViewdidLoad
CGRect s= [self getScrerenBoundsForCurrentOriantation];
CGRect f = self.view.frame;
f.origin.y =(s.size.height-COLAPSED_HEIGHT);
self.view.frame = f;
self.thumbScrollerIsExpanded=NO; //thumbScrollerIsExpanded is a BOOL property
}
- (void)collapse
{
[UIView beginAnimations:#"collapse" context:NULL];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationFinished:finished:context:)];
[self collapseView];
//CHANGE YOUR EXPAND/COLLAPSE BUTTON HERE
[UIView commitAnimations];
}
-(CGRect)getScrerenBoundsForCurrentOriantation
{
return [self getScrerenBoundsForOriantation:[[UIDevice currentDevice] orientation]];
}
-(CGRect)getScrerenBoundsForOriantation:(UIInterfaceOrientation)_orientation
{
UIScreen *screen = [UIScreen mainScreen];
CGRect fullScreenRect = screen.bounds; // always implicitly in Portrait orientation.
if (UIInterfaceOrientationIsLandscape(_orientation))
{
CGRect temp;
temp.size.width = fullScreenRect.size.height;
temp.size.height = fullScreenRect.size.width;
fullScreenRect = temp;
}
return fullScreenRect;
}
- (void)animationFinished:(NSString *)animationID finished:(BOOL)finished context:(void *)context
{
if ([animationID isEqualToString:#"expand"])
{
//example
}
else if ([animationID isEqualToString:#"collapse"])
{
//example
}
}
You could try adding a UIView (either in xib or programmatically) off screen, then use a UIView animation to slide it into your main viewing area.
The button would have an IBAction which would toggle the animation (slide in/slide out). You can slide it off screen then set UIView's hidden property to true. When you recall the IBAction, have it check if the view's hidden property is true. If it is, you know to play the animation of it sliding in, if not, then you play the animation of sliding out.