ios - Tweetbot 喜欢收缩 View 过渡

Question

有谁知道如何实现当前 View Controller 的 View 缩小并透明地放置另一个 View ？在 Tweetbot 3 中点击导航栏左上角的头像即可实现。例如，我应该拍摄快照吗？

Answer 1

为了实现这种效果，您必须从头开始重建 View 堆栈。

因为不可能更改 viewController.view 的框架，所以您必须像这样添加一种容器 subview :

@implementation ViewController
@synthesize container;

- (void)viewDidLoad {
    [super viewDidLoad];

    container = [[UIView alloc] initWithFrame:self.view.frame];
    [self.view addSubview:container];
    // add all views later to this insted of self.view

    // continue viewDidLoad setup
}

现在，如果你有，你可以像这样为收缩行为设置动画:

[UIView animateWithDuration:.5 animations:^{
        container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
    }];

好的，我假设您正在为 iOS 7 开发，所以我们将在这里使用一些新的 API(对于早期版本，有替代框架)。现在因为 WWDC UIView 有一个 resizableSnapshotViewFromRect:(CGRect) afterScreenUpdates:(BOOL) withCapInsets:(UIEdgeInsets) 方法返回一个单一的 UIView 对象.

[UIView animateWithDuration:.5 animations:^{
        container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
    } completion:^(BOOL finished) {
        UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];   
    }];

如果你不想重写你的 View 管理，你也可以先用这种方式拍摄你的主视图的快照，将它设置到容器中，然后只对图像进行动画处理。但请记住，您无法与捕获的 View 进行交互。

完成后，您可以从 this 下载这两个类别文件 repo (它们来自 WWDC，所以直接来自 Apple!)。基本上，他们所做的是向 UIView 类添加一些很酷的新方法，我们将在其中使用 applyDarkEffect。我还没有对此进行测试，也许另一种方法更适合您的需求。

无论如何，如果我们将它实现到 block 中，并且可能还添加一个 UIImageView 来显示模糊叠加层，它应该看起来像这样:

[UIView animateWithDuration:.5 animations:^{
        container.frame = CGRectMake(10, 17, self.view.frame.size.width-20, self.view.frame.size.height-34);
    } completion:^(BOOL finished) {
        UIView *viewToBlur = [self.view resizableSnapshotViewFromRect:container.frame afterScreenUpdates:YES withCapInsets:UIEdgeInsetsZero];
        UIImage *image = [viewToBlur applyDarkEffect];
        UIImageView *blurredView = [[UIImageView alloc] initWithFrame:self.view.frame];
        [self.view addSubview:blurredView];

        // optionally also animate this, to achieve an even smoother effect
        [blurredView setImage:image];

    }];

然后您可以将 SecondViewController 的 View 添加到堆栈顶部，这样它的委托(delegate)方法仍将被调用。通过新的UIView动画方法animateWithDuration:(NSTimeInterval) delay:(NSTimeInterval) usingSpringWithDamping:(CGFloat) initialSpringVelocity:(CGFloat) options:(UIViewAnimationOptions) animations:^(void) 可以实现传入账户 View 的弹跳效果)animations completion:^(BOOL finished)completion(更多关于 documentation )

希望这对您的项目有所帮助。