从导航栏下方的顶部动画 UISearchBar 幻灯片

Question

我想在我的UINavigationBar 底部添加一个UISearchBar，我想让它看起来像是栏的一部分。在下面的视频中，它显示了导航栏从顶部滑入视图的默认动画。我想在那之前在搜索栏中滑动，让它看起来像一个对象。

如何为 UISearchBar 重新创建此动画以显示和隐藏动画？并使其无缝动画化？

Animation

Answer 1

我认为您对导航栏使用自定义动画而不是默认动画。

我的测试代码如下。

#import "ViewController.h"

@interface ViewController ()
// Add a UISearchBar below navigation bar in Interface Builder 
@property (weak, nonatomic) IBOutlet UISearchBar *searchBar;

@end

@implementation ViewController{

    // this is flag for navigation bar status (shown or hidden)
    BOOL _isNaviBarHidden;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    _isNaviBarHidden = NO;

}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


// trigger for show navigation bar. I don't know when you want to show. so I add a button in my test viewcontroller
- (IBAction)showNavibar:(id)sender {


    if(_isNaviBarHidden == NO){

        return;
    }


    [self setNavibarAndSearchBarHidden:NO];

}



- (IBAction)hideNavibar:(id)sender {

    if(_isNaviBarHidden == YES){

        return;
    }

    [self setNavibarAndSearchBarHidden:YES];
}


-(void)setNavibarAndSearchBarHidden:(BOOL)hidden{


    CGFloat yOffset = -130;

    CALayer *naviBarLayer = self.navigationController.navigationBar.layer;
    CALayer *searchBarLayer = self.searchBar.layer;


    [UIView animateWithDuration:0.3 animations:^{

        if(hidden){

            naviBarLayer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeTranslation(0, yOffset));
            searchBarLayer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMakeTranslation(0, yOffset));


        }else{

            naviBarLayer.transform = CATransform3DMakeAffineTransform(CGAffineTransformIdentity);
            searchBarLayer.transform = CATransform3DMakeAffineTransform(CGAffineTransformIdentity);

        }


    } completion:^(BOOL finished) {

        _isNaviBarHidden = hidden;

    }];


}