Programing

iOS에서 UISearchBar 구성 요소의 배경색을 변경하는 방법

lottogame 2020. 11. 29. 09:32
반응형

iOS에서 UISearchBar 구성 요소의 배경색을 변경하는 방법


UISearchBar검색 필드 주변의 배경색 을 제거 / 변경하는 방법을 알고 있습니다 .

[[self.searchBar.subviews objectAtIndex:0] removeFromSuperview];
self.searchBar.backgroundColor = [UIColor grayColor];

UISearchBar 사용자 정의 달성

하지만 내부에서 이렇게하는 방법을 모릅니다.

원하는 UISearchBar 사용자 정의

iOS 4.3 이상과 호환되어야합니다.


이 코드를 사용하여 searchBar의 UITextFieldbackgroundImage 를 변경하십시오 .

UITextField *searchField;
NSUInteger numViews = [searchBar.subviews count];
for (int i = 0; i < numViews; i++) {
    if ([[searchBar.subviews objectAtIndex:i] isKindOfClass:[UITextField class]]) { //conform?
        searchField = [searchBar.subviews objectAtIndex:i];
    }
}
if (searchField) {
    searchField.textColor = [UIColor whiteColor];
    [searchField setBackground: [UIImage imageNamed:@"yourImage"]]; //set your gray background image here
    [searchField setBorderStyle:UITextBorderStyleNone];
}

변경하려면 아래 코드를 사용하십시오 UISearchBarIcon.

 UIImageView *searchIcon = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"yourSearchBarIconImage"]];
searchIcon.frame = CGRectMake(10, 10, 24, 24);
[searchBar addSubview:searchIcon];
[searchIcon release];

또한 searchBar 아이콘을 변경하려면 다음과 같은 기본 제공 방법을 UISearchBar사용할 수 있습니다 ( iOS 5 이상 에서 사용 가능 ).

- (void)setImage:(UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state

여기에서 4 가지 유형을 설정할 수 있습니다 UISearchBarIcon.

  1. UISearchBarIconBookmark
  2. UISearchBarIconClear
  3. UISearchBarIconResultsList
  4. UISearchBarIconSearch

도움이 되었기를 바랍니다.


텍스트 필드 자체를 사용자 지정하면됩니다.

나는 단순히 이것을하고 있으며 나에게 잘 작동합니다 (iOS 7).

UITextField *txfSearchField = [_searchBar valueForKey:@"_searchField"];
txfSearchField.backgroundColor = [UIColor redColor];

이렇게하면 이미지를 만들거나 크기를 조정할 필요가 없습니다.


사설 API를 사용하지 않는 솔루션! :)

현재 ( 아마도 iOS 5 이후 ) 다음과 같이 한 가지 색상 케이스에 대해 이렇게 할 수 있습니다.

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:[UIColor redColor]];

그러나 외관에 따라 변경 사항은 앱 전체에 적용된다는 점을 명심하십시오 (솔루션의 장점 또는 단점이 될 수 있음).

Swift의 경우 사용할 수 있습니다 (iOS 9 이상에서 작동합니다) :

if #available(iOS 9.0, *) {
    UITextField.appearanceWhenContainedInInstancesOfClasses([UISearchBar.self]).backgroundColor = UIColor.darkGrayColor()
}

#available프로젝트가 iOS 9 이상을 지원하는 경우 필요하지 않습니다 .

이전 버전의 iOS를 지원해야하고 Swift를 사용하려면 질문을 살펴보십시오 .


세부

  • Xcode 버전 11.0 (11A420a), Swift 5

UISearchBar 사용자 정의 샘플

해결책

import UIKit

extension UISearchBar {
    func getTextField() -> UITextField? { return value(forKey: "searchField") as? UITextField }
    func setTextField(color: UIColor) {
        guard let textField = getTextField() else { return }
        switch searchBarStyle {
        case .minimal:
            textField.layer.backgroundColor = color.cgColor
            textField.layer.cornerRadius = 6
        case .prominent, .default: textField.backgroundColor = color
        @unknown default: break
        }
    }
}

용법

let searchBar = UISearchBar(frame: CGRect(x: 0, y: 20, width: UIScreen.main.bounds.width, height: 44))
//searchBar.searchBarStyle = .prominent
view.addSubview(searchBar)
searchBar.placeholder = "placeholder"
searchBar.setTextField(color: UIColor.green.withAlphaComponent(0.3))

결과 1

 searchBar.searchBarStyle = .prominent // or default

여기에 이미지 설명 입력

결과 2

 searchBar.searchBarStyle = .minimal

여기에 이미지 설명 입력

전체 샘플

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        let searchBar = UISearchBar(frame: CGRect(x: 0, y: 20, width: UIScreen.main.bounds.width, height: 44))
        //searchBar.searchBarStyle = .minimal
        searchBar.searchBarStyle = .prominent
        view.addSubview(searchBar)
        searchBar.placeholder = "placeholder"
        searchBar.setTextField(color: UIColor.green.withAlphaComponent(0.3))
    }
}

UISearchBar 문서 에 따르면 :

이 기능은 iOS 5.0 이상에서 사용해야합니다.

- (void)setSearchFieldBackgroundImage:(UIImage *)backgroundImage forState:(UIControlState)state

사용 예 :

[mySearchBar setSearchFieldBackgroundImage:myImage forState:UIControlStateNormal];

안타깝게도 iOS 4에서는 덜 정교한 방법으로 되돌려 야합니다. 다른 답변을 참조하십시오.


Accatyyc가 iOS5 +에 대해 말했듯이 setSearchFieldBackgroundImage를 사용하지만 그래픽을 만들거나 다음을 수행해야합니다.

CGSize size = CGSizeMake(30, 30);
// create context with transparent background
UIGraphicsBeginImageContextWithOptions(size, NO, [UIScreen mainScreen].scale);

// Add a clip before drawing anything, in the shape of an rounded rect
[[UIBezierPath bezierPathWithRoundedRect:CGRectMake(0,0,30,30)
                            cornerRadius:5.0] addClip];
[[UIColor grayColor] setFill];

UIRectFill(CGRectMake(0, 0, size.width, size.height));
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

[self.searchBar setSearchFieldBackgroundImage:image forState:UIControlStateNormal];

애플 방식은 어때?

UISearchBar.appearance().setSearchFieldBackgroundImage(myImage, for: .normal)

디자인에 모든 이미지를 설정할 수 있습니다!

그러나 모든 프로그래밍 방식을 만들려면 다음을 수행하십시오.


Swift 3 에 대한 내 솔루션

let searchFieldBackgroundImage = UIImage(color: .searchBarBackground, size: CGSize(width: 44, height: 30))?.withRoundCorners(4)
UISearchBar.appearance().setSearchFieldBackgroundImage(searchFieldBackgroundImage, for: .normal)

헬퍼 확장을 사용하는 곳

public extension UIImage {

    public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {
        let rect = CGRect(origin: .zero, size: size)
        UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)
        color.setFill()
        UIRectFill(rect)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        guard let cgImage = image?.cgImage else { return nil }
        self.init(cgImage: cgImage)
    }

    public func withRoundCorners(_ cornerRadius: CGFloat) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        let rect = CGRect(origin: CGPoint.zero, size: size)
        let context = UIGraphicsGetCurrentContext()
        let path = UIBezierPath(roundedRect: rect, cornerRadius: cornerRadius)

        context?.beginPath()
        context?.addPath(path.cgPath)
        context?.closePath()
        context?.clip()

        draw(at: CGPoint.zero)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext();

        return image;
    }

}

Swift 2.2 및 iOS 8+에서 다양한 검색 창 속성의 모양을 사용자 정의하는 가장 좋은 방법은 다음과 같습니다. UISearchBarStyle.Minimal

searchBar = UISearchBar(frame: CGRectZero)
searchBar.tintColor = UIColor.whiteColor() // color of bar button items
searchBar.barTintColor = UIColor.fadedBlueColor() // color of text field background
searchBar.backgroundColor = UIColor.clearColor() // color of box surrounding text field
searchBar.searchBarStyle = UISearchBarStyle.Minimal

// Edit search field properties
if let searchField = searchBar.valueForKey("_searchField") as? UITextField  {
  if searchField.respondsToSelector(Selector("setAttributedPlaceholder:")) {
    let placeholder = "Search"
    let attributedString = NSMutableAttributedString(string: placeholder)
    let range = NSRange(location: 0, length: placeholder.characters.count)
    let color = UIColor(white: 1.0, alpha: 0.7)
    attributedString.addAttribute(NSForegroundColorAttributeName, value: color, range: range)
    attributedString.addAttribute(NSFontAttributeName, value: UIFont(name: "AvenirNext-Medium", size: 15)!, range: range)
    searchField.attributedPlaceholder = attributedString

    searchField.clearButtonMode = UITextFieldViewMode.WhileEditing
    searchField.textColor = .whiteColor()
  }
}

// Set Search Icon
let searchIcon = UIImage(named: "search-bar-icon")
searchBar.setImage(searchIcon, forSearchBarIcon: .Search, state: .Normal)

// Set Clear Icon
let clearIcon = UIImage(named: "clear-icon")
searchBar.setImage(clearIcon, forSearchBarIcon: .Clear, state: .Normal)

// Add to nav bar
searchBar.sizeToFit()
navigationItem.titleView = searchBar

여기에 이미지 설명 입력


비공개 API를 사용하지 않고 :

for (UIView* subview in [[self.searchBar.subviews lastObject] subviews]) {
    if ([subview isKindOfClass:[UITextField class]]) {
        UITextField *textField = (UITextField*)subview;
        [textField setBackgroundColor:[UIColor redColor]];
    }
}

더 나은 해결책은 UITextField내부 의 모양을 설정하는 것입니다UISearchBar

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil] setBackgroundColor:[UIColor grayColor]];

카테고리 메소드를 사용하여 모든보기를 탐색하기 만하면됩니다 (iOS 7에서 확인되었으며 비공개 API를 사용하지 않음).

@implementation UISearchBar (MyAdditions)

- (void)changeDefaultBackgroundColor:(UIColor *)color {
  for (UIView *subview in self.subviews) {
    for (UIView *subSubview in subview.subviews) {
      if ([subSubview isKindOfClass:[UITextField class]]) {
        UITextField *searchField = (UITextField *)subSubview;
        searchField.backgroundColor = color;
        break;
      }
    }
  }
}

@end

따라서 카테고리를 클래스로 가져온 후 다음과 같이 사용하십시오.

[self.searchBar changeDefaultBackgroundColor:[UIColor grayColor]];

바로 뒤에 넣으면 [[UISearchBar alloc] init]검색 창의 하위보기가 아직 생성되고 있기 때문에 아직 작동하지 않습니다. 나머지 검색 표시 줄을 설정 한 후 몇 줄을 입력합니다.


색상 만 변경 :

searchBar.tintColor = [UIColor redColor];

배경 이미지 적용 :

[self.searchBar setSearchFieldBackgroundImage:
                          [UIImage imageNamed:@"Searchbox.png"]
                                     forState:UIControlStateNormal];

- (void)viewDidLoad
{
    [super viewDidLoad];
    [[self searchSubviewsForTextFieldIn:self.searchBar] setBackgroundColor:[UIColor redColor]];
}

- (UITextField*)searchSubviewsForTextFieldIn:(UIView*)view
{
    if ([view isKindOfClass:[UITextField class]]) {
        return (UITextField*)view;
    }
    UITextField *searchedTextField;
    for (UIView *subview in view.subviews) {
        searchedTextField = [self searchSubviewsForTextFieldIn:subview];
        if (searchedTextField) {
            break;
        }
    }
    return searchedTextField;
}

이것은 Swift 버전입니다 (swift 2.1 / IOS 9)

for view in searchBar.subviews {
    for subview in view.subviews {
        if subview .isKindOfClass(UITextField) {
            let textField: UITextField = subview as! UITextField
            textField.backgroundColor = UIColor.lightGrayColor()
        }
    }
}

iOS 13 이상에서이 작업을 수행하려면

searchController.searchBar.searchTextField.backgroundColor = // your color here

기본적으로는 searchTextField.borderStyle로 설정되어 있으며 설정할 roundedRect색상 위에 약간의 회색 오버레이를 적용합니다. 원치 않는 경우

searchController.searchBar.searchTextField.borderStyle = .none

이렇게하면 회색 오버레이가 제거되지만 둥근 모서리도 제거됩니다.


iOS 9의 경우 다음을 사용하십시오.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.

// Remove lag on oppening the keyboard for the first time
UITextField *lagFreeField = [[UITextField alloc] init];
[self.window addSubview:lagFreeField];
[lagFreeField becomeFirstResponder];
[lagFreeField resignFirstResponder];
[lagFreeField removeFromSuperview];

//searchBar background color change
[[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setBackgroundColor:[UIColor greenColor]];
[[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]] setTextColor:[UIColor blackColor];

return YES;
}

스위프트 3

for subview in searchBar.subviews {
    for innerSubview in subview.subviews {
        if innerSubview is UITextField {
            innerSubview.backgroundColor = UIColor.YOUR_COLOR_HERE
        }
    }
}

Swift 3+의 경우 다음을 사용하십시오.

for subView in searchController.searchBar.subviews {

    for subViewOne in subView.subviews {

        if let textField = subViewOne as? UITextField {

           subViewOne.backgroundColor = UIColor.red

           //use the code below if you want to change the color of placeholder
           let textFieldInsideUISearchBarLabel = textField.value(forKey: "placeholderLabel") as? UILabel
                textFieldInsideUISearchBarLabel?.textColor = UIColor.blue
        }
     }
}

Swift 4를 사용하면 추가 코드가 필요없이이 작업 만 수행하는 것이 좋습니다.

self.searchBar.searchBarStyle = .prominent
self.searchBar.barStyle = .black

외부 배경이 회색이되지 않게하려면 .prominent를 .minimal로 변경할 수도 있습니다.


@EvGeniy ​​Ilyin EvGeniy ​​Ilyin의 솔루션이 최고입니다. 나는 썼다 목표 - C의 이 솔루션을 기반으로 버전을.

크리에이트 UIImage두 클래스 메소드 카테고리를하고, 광고 를 UIImage + YourCategory.h을

+ (UIImage *)imageWithColor:(UIColor *)color withSize:(CGRect)imageRect;
+ (UIImage *)roundImage:(UIImage *)image withRadius:(CGFloat)radius;

UIImage + YourCategory.m 에서 메서드 구현

// create image with your color
+ (UIImage *)imageWithColor:(UIColor *)color withSize:(CGRect)imageRect
{
    UIGraphicsBeginImageContext(imageRect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, imageRect);

    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

// get a rounded-corner image from UIImage instance with your radius
+ (UIImage *)roundImage:(UIImage *)image withRadius:(CGFloat)radius
{
    CGRect rect = CGRectMake(0.0, 0.0, 0.0, 0.0);
    rect.size = image.size;
    UIGraphicsBeginImageContextWithOptions(image.size, NO, [UIScreen mainScreen].scale);
    UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect
                                                cornerRadius:radius];
    [path addClip];
    [image drawInRect:rect];

    image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

당신의 자신 UISearchBarViewController

CGRect rect = CGRectMake(0.0, 0.0, 44.0, 30.0);
UIImage *colorImage = [UIImage imageWithColor:[UIColor yourColor] withSize:rect];
UIImage *finalImage = [UIImage roundImage:colorImage withRadius:4.0];
[yourSearchBar setSearchFieldBackgroundImage:finalImage forState:UIControlStateNormal];

이것은 나를 위해 일했습니다.

- (void)setupSearchBar
{
    [self.searchBar setReturnKeyType:UIReturnKeySearch];
    [self.searchBar setEnablesReturnKeyAutomatically:NO];
    [self.searchBar setPlaceholder:FOLocalizedString(@"search", nil)];
    [self.searchBar setBackgroundImage:[UIImage new]];
    [self.searchBar setBackgroundColor:[UIColor myGreyBGColor]];
    [self.searchBar setBarTintColor:[UIColor myGreyBGColor]];
    [self.searchBar setTintColor:[UIColor blueColor]];
}

iOS 13, Swift 5

searchBar.searchTextField.backgroundColor = .gray
 searchBar.searchTextField.tintColor = .white
 searchBar.searchTextField.textColor = .white

이것은 검색 창에서 textField의 배경색을 변경하는 데 도움이되었습니다.

UITextField.appearance(whenContainedInInstancesOf: [UISearchBar.self]).backgroundColor = .white

참고 URL : https://stackoverflow.com/questions/13817330/how-to-change-inside-background-color-of-uisearchbar-component-on-ios

반응형