2

Quora 的 iOS 7 应用程序似乎在主 UINavigationController 的 UINavigationBar 中显示了一个 UISearchBar。通过点击该栏中的右侧栏按钮项来触发搜索,并从右侧进行动画处理。一切似乎都发生在单个视图控制器中。

Apple 在 iOS 7 中向 UISearchDisplayController 引入了“displaysSearchBarInNavigationBar”属性,但我不相信 Quora 已经使用了这个。设置后,导航栏中不可能有 titleView,Quora 应用程序肯定有这个。

Apple 的日历应用程序使用单独的视图控制器进行搜索,但将搜索与内容保持在同一个视图控制器中,就像 Quora 所做的那样,对用户来说是一种更好的体验。

我认为这样做的唯一方法可能是使用自定义 UIViewController 转换,但这感觉有点矫枉过正。有没有更简单的方法来创建它?

4

1 回答 1

2

这是我编写的一个快速示例视图控制器,用于模仿 Quora“扩展搜索字段”效果。我将由您来合并“搜索结果”表格视图。

我使用了 a UITextField(子类化,所以我可以更改占位符文本的颜色...),但您可以使用UISearchBar. 或者您可能想要制作一个包含UITextField和任何“关闭”按钮的自定义视图。在我的示例中,我使用了UITextFieldrightView 来按住关闭按钮;在 Quora 案例中,它们在文本字段外有关闭按钮,就像一个真正的UISearchBar. 但我认为您不能更改 a 上关闭按钮的文本/图像UISearchBar(至少不容易)。

您可能会想出一个干净地集成内置 searchViewController 的解决方案,但这可能太麻烦了。

@interface TSTextField : UITextField
@end
@implementation TSTextField
- (void) drawPlaceholderInRect: (CGRect) rect
{
    CGFloat fontHeight = self.font.lineHeight;

    CGFloat yOffset = (rect.size.height - fontHeight) / 2.0;

    rect = CGRectMake( 0, yOffset, rect.size.width, fontHeight );

    [[self placeholder] drawInRect: rect
                    withAttributes: @{ NSFontAttributeName : self.font,
                                       NSForegroundColorAttributeName : self.isEditing ? self.textColor : [UIColor whiteColor] }];
}
@end

@interface TSViewController () <UITextFieldDelegate>
@end

@implementation TSViewController

- (void) viewDidLoad
{
    [super viewDidLoad];

    self.navigationController.navigationBar.barTintColor = [UIColor redColor];

    UITextField* searchField = [[TSTextField alloc] initWithFrame: CGRectMake(0, 0, 85, 30)];
    searchField.backgroundColor = [UIColor clearColor];
    searchField.borderStyle = UITextBorderStyleNone;
    searchField.textColor = [UIColor whiteColor];
    searchField.textAlignment = NSTextAlignmentRight;
    searchField.placeholder = @"Search";
    searchField.delegate = self;

    UIButton* magnifyButton = [UIButton buttonWithType: UIButtonTypeSystem];
    [magnifyButton setTitle: @"" forState: UIControlStateNormal];
    [magnifyButton sizeToFit];
    [magnifyButton addTarget: self action: @selector( close: ) forControlEvents: UIControlEventTouchUpInside];
    searchField.leftView = magnifyButton;
    searchField.leftViewMode = UITextFieldViewModeAlways;

    UIButton* closeButton = [UIButton buttonWithType: UIButtonTypeSystem];
    [closeButton setTitle: @"ⓧ" forState: UIControlStateNormal];
    [closeButton sizeToFit];
    [closeButton addTarget: self action: @selector( close: ) forControlEvents: UIControlEventTouchUpInside];
    searchField.rightView = closeButton;
    searchField.rightViewMode = UITextFieldViewModeWhileEditing;

    UIBarButtonItem* bbi = [[UIBarButtonItem alloc] initWithCustomView: searchField];
    self.navigationItem.rightBarButtonItem = bbi;

}

- (BOOL) textFieldShouldBeginEditing:(UITextField *)textField
{
    UITextField* searchField = (UITextField*)self.navigationItem.rightBarButtonItem.customView;
    searchField.borderStyle = UITextBorderStyleRoundedRect;
    searchField.backgroundColor = [UIColor whiteColor];
    searchField.textColor = [UIColor blackColor];
    searchField.text = @"";
    searchField.textAlignment = NSTextAlignmentLeft;

    [UIView transitionWithView: searchField
                      duration: 0.25
                       options: UIViewAnimationOptionAllowAnimatedContent | UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{

                        searchField.frame = CGRectMake( 0, 0, 290, searchField.frame.size.height);
                    }
                    completion: nil];

    return YES;
}

- (void) close: (id) sender
{
    UITextField* searchField = (UITextField*)self.navigationItem.rightBarButtonItem.customView;
    searchField.rightViewMode = UITextFieldViewModeNever;

    [UIView transitionWithView: searchField
                      duration: 0.25
                       options: UIViewAnimationOptionAllowAnimatedContent | UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{

                        searchField.frame = CGRectMake( 0, 0, 85, searchField.frame.size.height);
                        searchField.backgroundColor = [UIColor clearColor];
                        searchField.text = @"";
                        searchField.borderStyle = UITextBorderStyleNone;
                        searchField.textColor = [UIColor whiteColor];
                        searchField.textAlignment = NSTextAlignmentRight;

                        [searchField resignFirstResponder];
                     }

                     completion:^(BOOL finished) {

                         searchField.rightViewMode = UITextFieldViewModeWhileEditing;
                     }];
}

@end
于 2013-11-13T20:08:01.147 回答