开发者

UISearchBar - scope bar animated

I've found example of animated search-bar with scope bar under "UISearchDisplayDelegate Protocol Reference"(SearchBar-animated-sample ), here is a video preview: SearchBarAnimated-video

I've checked sample code, but I can't find the code that triggers an开发者_JAVA百科imation. Does anyone knows how to create that animation ? Do you have to use UISearchBarDelegate to get that animation ?


Inorder to control the animations of UISearchBar you have implement the delegates of UISearchDisplayController by extending in your header file. The delegates are as follows;

    - (void)searchDisplayControllerWillBeginSearch:(UISearchDisplayController *)controller
    {
        [UIView beginAnimations:nil context:NULL];
        self.searchDisplayController.searchBar.showsScopeBar = NO;
        CGRect headerViewFrame = self.searchDisplayController.searchBar.frame;
        headerViewFrame.origin.y -= 54.0f;
        self.searchDisplayController.searchBar.frame = headerViewFrame;

        CGRect tableViewFrame = self.tableView.frame;
        tableViewFrame.origin.y -= 54.0f;
        self.tableView.frame = tableViewFrame;

        [UIView commitAnimations];
    }

    -(void)searchDisplayControllerWillEndSearch:(UISearchDisplayController *)controller
    {
        [UIView beginAnimations:nil context:NULL];

        CGRect headerViewFrame = self.searchDisplayController.searchBar.frame;
        headerViewFrame.origin.y += 54.0f;
        self.searchDisplayController.searchBar.frame = headerViewFrame;

        CGRect tableViewFrame = self.tableView.frame;
        tableViewFrame.origin.y += 54.0f;
        self.tableView.frame = tableViewFrame;

        [UIView commitAnimations];
    }


It's built right in to UISearchBar. Apple does this for you, you don't have to call any method by yourself.

Basically, from the moment you set your search bar's scopeButtonTitles property, Apple will animate the scope bar.


I found the answer to this question more useful though it doesn't automatically transition the search bar to the top of your view.

How do you hide/show UISearchBar's scope bar with animation?


This works well for me in Xcode 6. If you have auto layout constraints in place then you may need to add in adjustments for them as I've done (didn't work without them).

- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar
{
    searchBar.showsScopeBar = YES;
    searchBarHeightConstraint.constant = 88; // Changes from 44 to 88 with scope bar
    tableViewHeightConstraint.constant = 480; // Changes from 524 to 480 with scope bar

    [UIView animateWithDuration:0.3
                     animations:^{
                         CGRect newFrame = tableView.frame;
                         newFrame.origin.y = 88;
                         tableView.frame = newFrame;
                     }];

    return YES;
}

- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar
{
    searchBar.showsScopeBar = NO;
    searchBarHeightConstraint.constant = 44;
    tableViewHeightConstraint.constant = 524;

    [UIView animateWithDuration:0.3
                     animations:^{
                         CGRect newFrame = tableView.frame;
                         newFrame.origin.y = 44;
                         tableView.frame = newFrame;
                     }];
    return YES;
}


sizeToFit in an Animation block

The UISearchBar w/ scope bar is easily animated. UISearchBar has a height of 44.f before calling sizeToFit with the scope bar and then becomes 88.f. In my case, the UISearchBar was embedded in a UITableView within Interface Builder so it was not possible to add auto layout constraints.

#pragma mark - UISearchBarDelegate methods

- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar
{
    searchBar.showsScopeBar = YES;
    [UIView animateWithDuration:0.2f animations:^{
        [searchBar sizeToFit];
    }];

    [searchBar setShowsCancelButton:YES animated:YES];

    return YES;
}

- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar
{
    searchBar.showsScopeBar = NO;
    [searchBar sizeToFit];

    [searchBar setShowsCancelButton:NO animated:YES];

    return YES;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜