如何在iOS 7中更改UISearchBar

Question

我正在为iOS 7创建一个应用程序,我需要在我的UITableView中添加UISearchBar.搜索功能工作正常,我的问题是我试图使用下面的代码自定义我的搜索栏UI,以实现我的输出如下截图:

这是我的代码:

searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(40, 29, 266, 27)];
searchBar.delegate = self;
searchBar.barTintColor = [UIColor clearColor];
[[UILabel appearanceWhenContainedIn:[UISearchBar class], nil] setTextColor:[UIColor whiteColor]];
[[UISearchBar appearance] setSearchFieldBackgroundImage:[UIImage imageNamed:@"search-bar.png"]forState:UIControlStateNormal];

NSDictionary *attributes =
[NSDictionary dictionaryWithObjectsAndKeys:
 [UIColor whiteColor], UITextAttributeTextColor,
 [UIFont fontWithName:@"HPSimplifiedW01-Regular" size:14.0f], UITextAttributeFont,
 nil];
[[UIBarButtonItem appearanceWhenContainedIn:[UISearchBar class], nil]
 setTitleTextAttributes:attributes forState:UIControlStateNormal];
[[UIBarButtonItem appearanceWhenContainedIn:[UISearchBar class], nil]
 setTitleTextAttributes:attributes forState:UIControlStateHighlighted];

for (UIView *subView in searchBar.subviews)
{
    for (UIView *secondLevelSubview in subView.subviews){
        if ([secondLevelSubview isKindOfClass:[UITextField class]])
        {
            UITextField *searchBarTextField = (UITextField *)secondLevelSubview;
            searchBarTextField.clearButtonMode = UITextFieldViewModeNever;
            //set font color here
            searchBarTextField.textColor = [UIColor whiteColor];
            searchBarTextField.tintColor = [UIColor whiteColor];

            if ([searchBarTextField respondsToSelector:@selector(setAttributedPlaceholder:)]) {
                UIColor *color = [UIColor whiteColor];
                searchBarTextField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"Search" attributes:@{NSForegroundColorAttributeName: color}];

                searchBarTextField.textAlignment = NSTextAlignmentLeft;
                searchBarTextField.leftViewMode = UITextFieldViewModeAlways;

                searchBarTextField.rightView = nil;
                searchBarTextField.leftView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@""]];
            }

            searchBarTextField.font = [UIFont fontWithName:@"HPSimplifiedW04-LightItalic" size:15.0f];

            break;
        }
    }
}

但目前使用上面的代码我得到我的输出如下截图:

你可以帮助我实现我的输出作为第一个屏幕吗？谢谢

Answer 1

在这种情况下的问题是,我们想要更改的大多数属性是视图的图层属性,并且外观代理无法访问.但是有一个巧妙的方法来改变它:

我们可以将这些属性包装在类别方法中.

@interface UITextField (test)
- (void)setLayerCornerRadius:(CGFloat)cornerRadiu;
- (void)setLayerBorderColor:(UIColor *)color;
- (void)setLayerBorderWidth:(CGFloat)width;
@end

@implementation UITextField (test)

- (void)setLayerCornerRadius:(CGFloat)cornerRadius {
    self.layer.cornerRadius = cornerRadius;
}

-(void)setLayerBorderColor:(UIColor *)color
{
    self.layer.borderColor = color.CGColor;
}

-(void)setLayerBorderWidth:(CGFloat)width
{
    self.layer.borderWidth = width;
}
@end

同

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:self.searchBar.barTintColor];
[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBorderStyle:UITextBorderStyleNone];
[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerCornerRadius:15];
[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerBorderColor:[UIColor darkGrayColor]];
[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerBorderWidth:1];

我们实现了

barTintColor 在故事板中设置

为了摆脱放大镜玻璃图标,我们可以做到这一点

[self.searchBar setImage:[[UIImage alloc] init] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal];

现在最困难的部分是让占位符文本保持对齐.

因此我将UISearchBar子类化了

@interface MySearchBar : UISearchBar

@end

@implementation MySearchBar

-(void)setAlternatePropmtLabel:(UILabel *)alternatePropmtLabel
{
    UILabel *l = (UILabel *)[self viewWithTag:1991];
    l = alternatePropmtLabel;
    [self addSubview:l];
    l.tag = 1991;
}

-(UILabel *)alternatePropmtLabel
{
    return (UILabel *)[self viewWithTag:1991];
}


@end

添加添加

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    [[[self superview] viewWithTag:1991] setHidden:YES];
}

到文本域类别.(您应该1991使用一些不错的标识符替换)
在故事板中,我将其设置MySearchBar为搜索栏的自定义类.

现在通过使用

UILabel *promtLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 0, 100, 44)];
promtLabel.text = @"prompt";
[(MySearchBar *)self.searchBar setAlternatePropmtLabel:promtLabel];

我明白了

第一次触摸时"提示"消失.

完整的代码,稍微调整一下:

#import "ViewController.h"

static NSUInteger kAlternatePlaceHolderTag = 1991;

@interface MySearchBar : UISearchBar

@end

@implementation MySearchBar

-(void)layoutSubviews
{
    [super layoutSubviews];
}


-(void)setAlternatePlaceholderLabel:(UILabel *)alternatePlaceholderLabel
{
    UILabel *l = (UILabel *)[self viewWithTag:kAlternatePlaceHolderTag];
    l = alternatePlaceholderLabel;
    [self addSubview:l];
    l.tag = kAlternatePlaceHolderTag;
}

-(UILabel *)alternatePlaceholderLabel
{
    return (UILabel *)[self viewWithTag:kAlternatePlaceHolderTag];
}


@end



@interface UITextField (test)
- (void)setLayerCornerRadius:(CGFloat)cornerRadius;
- (void)setLayerBorderColor:(UIColor *)color;
- (void)setLayerBorderWidth:(CGFloat)width;
@end

@implementation UITextField (test)

- (void)setLayerCornerRadius:(CGFloat)cornerRadius {
    self.layer.cornerRadius = cornerRadius;
}

-(void)setLayerBorderColor:(UIColor *)color
{
    self.layer.borderColor = color.CGColor;
}

-(void)setLayerBorderWidth:(CGFloat)width
{
    self.layer.borderWidth = width;
}

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    [[[self superview] viewWithTag:kAlternatePlaceHolderTag] setHidden:YES];
}


@end



@interface ViewController ()
@property (weak, nonatomic) IBOutlet UISearchBar *searchBar;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    [self.searchBar setImage:[[UIImage alloc] init] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal];

    UILabel *promtLabel = [[UILabel alloc] initWithFrame:CGRectMake(22, 0, 100, 44)];
    promtLabel.text = @"prompt";
    promtLabel.font = [UIFont fontWithName:@"HelveticaNeue-Italic" size:12];
    promtLabel.textColor = [UIColor whiteColor];
    [(MySearchBar *)self.searchBar setAlternatePlaceholderLabel:promtLabel];

    [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:self.searchBar.barTintColor];
    [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBorderStyle:UITextBorderStyleNone];
    [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerCornerRadius:15];
    [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerBorderColor:[UIColor whiteColor]];
    [[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setLayerBorderWidth:1];


}


@end