[英]iOS 7 photos app like custom UIViewController Transition
I am a bit new to iOS development. 我对iOS开发有点新意。 I am working on an app that has about 5,000 visual data points, organized in categories.
我正在开发一个具有大约5,000个可视数据点的应用程序,按类别组织。 I want to present them in a UICollectionView with very tiny UICollectionViewCells.
我想用非常小的UICollectionViewCells在UICollectionView中呈现它们。 When a user taps on something in a category, the category zooms in with the selected cell in focus.
当用户点击某个类别中的某些内容时,该类别会放大所选单元格的焦点。 Pretty much like how the "Photos" tab of the iOS 7 Photos app works: Years > Collections > Moments.
非常类似于iOS 7照片应用的“照片”标签的工作方式:年>收藏>时刻。
How do I go about implementing a custom transition like that? 我该如何实现这样的自定义转换? Are there any open-source libraries already written for accomplishing this?
有没有为实现这个目的而编写的开源库?
If you can't find any library, try to play with this code I wrote for custom animations. 如果您找不到任何库,请尝试使用我为自定义动画编写的代码。 You can specify a start point, an end point, start scale and end scale of a view that you want to zoom and scale in or out.
您可以指定要缩放和缩放的视图的起点,终点,起始比例和结束比例。 See below an example how I use it.
请参阅下面的示例我如何使用它。 The point is to use a fake view to push it with animation, then push and pop your real view without animation.
关键是使用假视图用动画推动它,然后在没有动画的情况下推送和弹出真实视图。 viewobj is set to fade in from alpha 0 to alpha 1, zoomableView will scale from the point/scale you give as parameter to the final position you set it in your storyboard/xib.
viewobj设置为从alpha 0到alpha 1淡入,zoomableView将从您作为参数提供的点/比例缩放到您在storyboard / xib中设置的最终位置。 Hope it will help.
希望它会有所帮助。
@ you can create a category vor UIView and add these methods @您可以创建一个类别vor UIView并添加这些方法
- (void) addSubView:(UIView*)viewObj animateFromPoint:(CGPoint)point zoomableView:(UIView*)view minScale:(CGSize)scale completion:(void (^)(void))completionBlock{
CGPoint center = view.center;
[view setTransform:CGAffineTransformMakeScale(scale.width, scale.height)];
viewObj.alpha = 0;
view.center = point;
[self addSubview:viewObj];
[self addSubview:view];
[UIView animateWithDuration:0.3
delay:0.0
options:UIViewAnimationOptionCurveEaseOut
animations:^{
view.center = center;
[view setTransform:CGAffineTransformMakeScale(1.0, 1.0)];
viewObj.alpha = 1;
}
completion:^(BOOL fin){
if(completionBlock)
completionBlock();
}];
}
- (void) removeFromSuperviewAnimateToPoint:(CGPoint)point zoomableView:(UIView*)view minScale:(CGSize)scale completion:(void (^)(void))completionBlock{
CGRect startFrame = view.frame;
self.alpha = 1;
[self.superview addSubview:view];
[UIView animateWithDuration:0.3
delay:0.0
options:UIViewAnimationOptionCurveEaseIn
animations:^{
view.center = point;
[view setTransform:CGAffineTransformMakeScale(scale.width, scale.height)];
self.alpha = 0;
}
completion:^(BOOL fin){
[self removeFromSuperview];
[view removeFromSuperview];
[view setTransform:CGAffineTransformMakeScale(1, 1)];
view.frame = startFrame;
[self addSubview:view];
if(completionBlock)
completionBlock();
}];
}
And to use them: 并使用它们:
@ your did select item at index path: @你在索引路径上选择了项目:
self.itemDetails = [self.storyboard instantiateViewControllerWithIdentifier:@"ItemDetailsVC"];
ItemDetailsVC* itd = [self.storyboard instantiateViewControllerWithIdentifier:@"ItemDetailsVC"];
__weak UIViewController* wself = self;
[self.view addSubView:self.itemDetails.view animateFromPoint:self.zoomedFrom zoomableView:self.itemDetails.viewZoomable minScale:CGSizeMake(0.371134, 0.371134) completion:^{
[wself.navigationController pushViewController:itd animated:NO];
}];
self.addSubviewIsUp = YES;
@ back button of the view you added: 你添加的视图的@后退按钮:
[self.navigationController popViewControllerAnimated:NO];
@ viewdidapear of your main screen 主屏幕的@ viewdidapear
if(self.addSubviewIsUp){
[self.addVc.view removeFromSuperviewAnimateToPoint:CGPointMake(160, 75) zoomableView:self.addVc.zoomableView minScale:CGSizeMake(0.01, 0.01) completion:^{
}];
}
self.addSubviewIsUp = NO;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.