ios中UI和常用动画汇总 抖动等现成的动画

ios中UI和常用动画汇总 抖动等现成的动

1.保证程序UI和设计图完全吻合(UI显示)

2.尽量能避免闪出闪去等操作,结合实际情况,能过渡的交互尽量结合动画制作,

 

以符合ios风格,(Animation)

(一).UI显示:

原则:保证要与设计图模式一摸一样,发现不适合的东西,需要及时沟通后让设计

 

师修改,尽量要保证和设计图的像素一一对应

1.自定义UIAlertView:

换背景:

 

 

UIAlertView *theAlert = [[UIAlertView alloc] initWithTitle:title 

 

message:message delegate:delegate cancelButtonTitle:cancleTitle 

 

otherButtonTitles:otherTitle,nil];

[theAlert show];

theAlert.backgroundColor = [UIColor clearColor];

UILabel *theTitle = [theAlert valueForKey:@"_titleLabel"];

[theTitle setTextColor:[UIColor whiteColor]];

UILabel *theBody = [theAlert valueForKey:@"_bodyTextLabel"];

[theBody setTextColor:[UIColor whiteColor]];

UIImage *theImage = [UIImage imageNamed:@"alertBack.png"];

theImage = [theImage stretchableImageWithLeftCapWidth:0. 

 

topCapHeight:0.];

CGSize theSize = [theAlert frame].size;

UIGraphicsBeginImageContext(theSize);

[theImage drawInRect:CGRectMake(0, 0, theSize.width, theSize.height)];

theImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

theAlert.layer.contents = (id)[theImage CGImage];

for (UIView *tempView in theAlert.subviews)

if ([tempView isMemberOfClass:[UIImageView class]])

[tempView removeFromSuperview];

[theAlert release];

 

1

<span class="Apple-style-span" style="font-family: Georgia, 'Times New 

 

Roman', 'Bitstream Charter', Times, serif; font-size: 13px; line-height: 

 

19px; white-space: normal;">2.自定义UIPageControl</span>

改变点儿的颜色,可以改变小点儿的颜色:(附件中)

MyPageControl.h

MyPageControl.m

3.自定义UISegmentConrol

改变自定义风格:(需要用切图配合)

 

 

UISegmentedControl *segmentControl = [[UISegmentedControl alloc] 

 

initWithItems:[NSArray arrayWithObjects:

[UIImage imageNamed:@"seg1_tapped.png"],

[UIImage imageNamed:@"seg2.png"],

[UIImage imageNamed:@"seg3.png"],nil]];

segmentControl.segmentedControlStyle = UISegmentedControlStyleBar;

segmentControl.frame = CGRectMake((DeviceWidth-76*3)/2-9, 

 

14+[cellContentArray count]*35, 76*3, 33.5);

segmentControl.selectedSegmentIndex = 0;

[segmentControl addTarget:self action:@selector(changeBookType:) 

 

forControlEvents:UIControlEventValueChanged];

[cell.contentView addSubview:segmentControl];

[segmentControl release];

4.自定义UIProgressView

改变pressView的进度颜色显示:基于QuartzCore绘制图像

CustemProgressBar.h

CustemProgressBar.m

5.自定义UITableView/UITableViewCell

很常用,往后要倾向IB来做:layOutSubView布局frame

6.自定义UINavigationBar(用view组合)

TopBarView.h

TopBarView.m

我的做法:将自身的navibar英藏后在显示为自定义的navibarView:这样方便程序

 

来控制:

7.自定义UIPopViewController(用view组合)

iPhone里不支持PopViewController,但是有时会需要在程序里显示

 

PopViewController这样的东西

8.自定义UITabBarView

用一组button组合成tabbar的显示,方便灵活,但要确保需要管理好内容:

由于sdk中的tabbar是很不灵活的,隐藏之类的操作都很难控制:

9.自定义UISearchBar

用多个view组合起来平城searchview的显示:可以改变背景,圆角等

改变背景等需求;

10.自定义UITextField/UITextView

可以换背景等:leftview rightView background等

11.翻页效果:UIPageViewController(iOS5)

1.官方demo,

2.leaves框架翻页效果

(二).常用到的动画汇总:

一.控件本身附有的动画方法:

UIKit包含的动画效果,用起来也比较省事,举例如下:

1. [self.navigationController setNavigationBarHidden:YES animated:YES];

2.一般使用UITableView的的动画效果汇总:

先设置数据源,然后在执行动画:

An error has occurred. Please try again later.

 

- (void)insertSections:(NSIndexSet *)sections withRowAnimation:

 

(UITableViewRowAnimation)animation;

- (void)deleteSections:(NSIndexSet *)sections withRowAnimation:

 

(UITableViewRowAnimation)animation;

- (void)reloadSections:(NSIndexSet *)sections withRowAnimation:

 

(UITableViewRowAnimation)animation __OSX_AVAILABLE_STARTING

 

(__MAC_NA,__IPHONE_3_0);

- (void)insertRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:

 

(UITableViewRowAnimation)animation;

- (void)deleteRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:

 

(UITableViewRowAnimation)animation;

- (void)reloadRowsAtIndexPaths:(NSArray *)indexPaths withRowAnimation:

 

(UITableViewRowAnimation)animation __OSX_AVAILABLE_STARTING

 

(__MAC_NA,__IPHONE_3_0);

3.[scrollVie setContentOffset:CGPoint animated:BOOL]

4.UIImageView的动画效果:

 

UIImageView *campFireView = [[UIImageView alloc] initWithFrame:XXX];

campFireView.animationImages = [NSArray arrayWithObjects:

[UIImage imageNamed:@"campFire01.gif"],

[UIImage imageNamed:@"campFire02.gif"]......., nil];

campFireView.animationDuration = 1.75;

campFireView.animationRepeatCount = 0;

[campFireView startAnimating];

[campFireView release];

二.UIViewAnimation实例:Animation块动画,Animation块支持多种动画叠加,会

 

产生各种不同的效果

//在这里之前初始化参数

XXX

XXX

 

[UIView beginAnimations:nil context:nil];

[UIView setAnimationDelegate:delegate];

[UIView setAnimationWillStartSelector:startSelector];//开始的代理

[UIView setAnimationDidStopSelector:stopSelector];//结束的代理

[UIView setAnimationDuration:seconds];

 

1

2

//改变后的参数,动画将会从初始化的参数向改变后的参数过渡

//位置:

 

1

tempView.center = center;

 

1

//大小transform

 

1

tempView.transform = CGAffineTransformMakeScale(number, number);

 

1

//透明度

 

1

tempView.alpha = 0;

 

1

//旋转

 

1

2

CGAffineTransform newTransform = CGAffineTransformMakeRotation(M_PI);

[viewToAddAnimation setTransform:newTransform];

 

1

2

//翻转两个View的动画:

把一个removeFromSupview同时把另一个addSubView,设置一下动画的翻转效果:上

 

下左右选一个;

 

1

2

[view1 removeFromSupview];

[view addSubView:view2];

 

1

//横向滑动效果等

 

1

[UIView commitAnimations];

 

1

.........

 

三.CAAnimation实例:

弹出时抖动显示,模仿AlertView的弹出效果,可以将抖动结合用到其他的地方:

 

 

+(void) showCustemAlertViewInRect:(CGRect) frame inView:(UIView *) 

 

superview

{

UIView *tempView = [UIGloble newWhiteViewWithFrame:frame 

 

backgroundColor:[UIColor blueColor]];

[superview addSubview:tempView];//CGRectMake(40, 60, DeviceWidth-80, 

 

DeviceHeight-200)

CAKeyframeAnimation *animation=nil;

animation = [CAKeyframeAnimation animationWithKeyPath:@"transform"];

animation.duration = 0.8;

animation.delegate = self;

animation.removedOnCompletion = YES;

animation.fillMode = kCAFillModeForwards;

NSMutableArray *values = [NSMutableArray array];

[values addObject:[NSValue valueWithCATransform3D:CATransform3DMakeScale

 

(0.1, 0.1, 1.0)]];

[values addObject:[NSValue valueWithCATransform3D:CATransform3DMakeScale

 

(1.2, 1.2, 1.0)]];

[values addObject:[NSValue valueWithCATransform3D:CATransform3DMakeScale

 

(0.9, 0.9, 0.9)]];

[values addObject:[NSValue valueWithCATransform3D:CATransform3DMakeScale

 

(1.0, 1.0, 1.0)]];

animation.values = values;

animation.timingFunction = [CAMediaTimingFunction 

 

functionWithName:kCAMediaTimingFunctionEaseInEaseOut];

[tempView.layer addAnimation:animation forKey:nil];

[tempView release];

}

四.晃动动效果:CABasicAnimation动画举例:可以模仿iphone删除程序模式下的抖

 

动效果:

 

 

CALayer*viewLayer=[self layer];

CABasicAnimation*animation=[CABasicAnimation 

 

animationWithKeyPath:@"transform"];

animation.duration=0.2;

animation.repeatCount = 100000;

animation.autoreverses=YES;

animation.fromValue=[NSValue valueWithCATransform3D:CATransform3DRotate

 

(viewLayer.transform, -0.03, 0.0, 0.0, 0.03)];

animation.toValue=[NSValue valueWithCATransform3D:CATransform3DRotate

 

(viewLayer.transform, 0.03, 0.0, 0.0, 0.03)];

[viewLayer addAnimation:animation forKey:@"wiggle"];

五.按照路径绘制动画的效果(CAKeyframeAnimation : CAPropertyAnimation)

指定几个点,会按照动画指定的轨迹出效果:可以自选几个比较明显重要的点来绘

 

制出动画

 

CAKeyframeAnimation *animation = [CAKeyframeAnimation 

 

animationWithKeyPath:@"position"];

[animation setDuration:0.8];

CGPoint p1 = tempButton.center;

CGPoint p2 = CGPointMake(152, 97);

CGPoint p3 = CGPointMake(189, 110);

CGPoint p4 = CGPointMake(220, 124);

CGPoint p5 = CGPointMake(245, 163);

CGPoint p6 = CGPointMake(220, 250);

CGPoint p7 = CGPointMake(177, 379);

[animation setValues:[NSArray arrayWithObjects:

[NSValue valueWithCGPoint:p1],

[NSValue valueWithCGPoint:p2],

[NSValue valueWithCGPoint:p3],

[NSValue valueWithCGPoint:p4],

[NSValue valueWithCGPoint:p5],

[NSValue valueWithCGPoint:p6],

[NSValue valueWithCGPoint:p7],

nil]];

[animation setKeyTimes:[NSArray arrayWithObjects:

[NSNumber numberWithFloat:0.0],

[NSNumber numberWithFloat:0.3],

[NSNumber numberWithFloat:0.4],

[NSNumber numberWithFloat:0.5],

[NSNumber numberWithFloat:0.6],

[NSNumber numberWithFloat:0.7],

[NSNumber numberWithFloat:0.8],

nil]];

//[animation setAutoreverses:YES];//返回到原始状态

[tempButton.layer addAnimation:animation forKey:@"BookView-Fly"];

[UIGloble addAnimationFade:tempButton duraion:0.8];

[UIGloble addAnimationScal:tempButton toPoint:tempButton.center 

 

lightState:YES delegate:tempButton startSelector:nil 

 

stopSelector:@selector(removeFromSuperview) scaleNumber:0.1 duraion:0.8];

[tempButton release];

[self performSelector:@selector(changeBadgeValue) withObject:nil 

 

afterDelay:0.8];

六.CATransition,cube动画翻转,privateAPI

CATransition *animation = [CATransition animation];

animation.delegate = self;

animation.duration = 0.5f;

animation.timingFunction = UIViewAnimationCurveEaseInOut;

animation.fillMode = kCAFillModeRemoved;

animation.removedOnCompletion = NO;

animation.type = @"cube";

[[UIApplication sharedApplication].keyWindow.layer addAnimation:animation 

 

forKey:@"animationID"];

总结出来的:

实现iphone漂亮的动画效果主要有两种方法,一种是UIView层面的,一种是使用

 

CATransition进行更低层次的控制,

第一种是UIView,UIView方式可能在低层也是使用CATransition进行了封装,它只

 

能用于一些简单的、常用的效果展现,这里写一个常用的示例代码,供大家参考。

 

[UIView beginAnimations:@"Curl"context:nil];//动画开始

[UIView setAnimationDuration:0.75];

[UIView setAnimationDelegate:self];

[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp 

 

forView:myview cache:YES];

[myview removeFromSuperview];

[UIView commitAnimations];

第二种方式相对复杂一些,但如果更好的进行控制,还是使用这种方法吧,基本使

 

用方法可以看一下如下例子:

 

CATransition *animation = [CATransition animation];

[animation setDuration:1.25f];

[animation setTimingFunction:[CAMediaTimingFunction

functionWithName:kCAMediaTimingFunctionEaseIn]];

[animation setType:kCATransitionReveal];

[animation setSubtype: kCATransitionFromBottom];

[self.view.layer addAnimation:animation forKey:@"Reveal"];

还有一种设置动画类型的方法,不用setSubtype,只用setType

[animation setType:@"suckEffect"];

这里的suckEffect就是效果名称,可以用的效果主要有:

pageCurl 向上翻一页

pageUnCurl 向下翻一页

rippleEffect 滴水效果

suckEffect 收缩效果,如一块布被抽走

cube 立方体效果

oglFlip 上下翻转效果

最后再给出一种常用代码供大家参考。

 

// Curl the image up or down

CATransition *animation = [CATransition animation];

[animation setDuration:0.35];

[animation setTimingFunction:UIViewAnimationCurveEaseInOut];

if (!curled){

//animation.type = @"mapCurl";

animation.type = @"pageCurl";

animation.fillMode = kCAFillModeForwards;

animation.endProgress = 0.99;

} else {

//animation.type = @"mapUnCurl";

animation.type = @"pageUnCurl";

animation.fillMode = kCAFillModeBackwards;

 

from:http://3426724.blog.51cto.com/3416724/845765

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值