2017-09-01 111 views
14

我想用新的iOS 11大標題在新的導航欄中放置搜索欄。但是,搜索欄的顏色由iOS自動應用,我無法更改它。iOS 11 UISearchBar在UINavigationBar

if #available(iOS 11.0, *) { 
    let sc = UISearchController(searchResultsController: nil) 
    navigationItem.searchController = sc 
    navigationItem.hidesSearchBarWhenScrolling = false 
} 

搜索欄的深藍色背景,但我只是想將其更改爲白色。

enter image description here

設置背景顏色的結果是:

navigationItem.searchController?.searchBar.backgroundColor = UIColor.white 

enter image description here

我也試圖在搜索欄上setScopeBarButtonBackgroundImagesetBackgroundImage,但一切看起來完全怪異。

此外,當我通過點擊搜索欄觸發搜索時,它會切換到右側取消按鈕的模式。 ( 「Abbrechen」 在德語)

enter image description here

與 「Abbrechen」 文本顏色也不能更改。 (需要它也是白色的)

任何幫助表示讚賞。

編輯:按照要求,這裏導航的直板造型代碼:

self.navigationBar.tintColor = UIColor.myWhite 
self.navigationBar.titleTextAttributes = [NSAttributedStringKey.foregroundColor : UIColor.myWhite, NSAttributedStringKey.font: UIFont.myNavigationBarTitle()] 
self.navigationBar.barTintColor = UIColor.myTint 

if #available(iOS 11.0, *) { 
    self.navigationBar.prefersLargeTitles = true 
    self.navigationBar.largeTitleTextAttributes = [NSAttributedStringKey.foregroundColor : UIColor.myWhite, NSAttributedStringKey.font: UIFont.myNavigationBarLargeTitle()] 
} 

當前結果: 我已經使用Krunals主意設置的搜索欄背景的顏色,但隨後圓角丟失。重新設置圓角後,搜索欄的動畫似乎被破壞了。

enter image description here

所以還沒有滿意的解決方案。似乎嵌入到iOS 11導航欄中的搜索欄無法自定義。與此同時,只需更改佔位符文本的顏色就足夠了,但即使這似乎也不可行。 (我試圖從StackOverflow的多種方法 - 不工作)

+0

你需要搜索的文字也是白色或其他 –

+0

搜索文本可以是灰色的,這是確定。但如果這也是可以改變的話,那將很酷。 – Darko

回答

13

現在就是你想要的...

if #available(iOS 11.0, *) { 
      let sc = UISearchController(searchResultsController: nil) 
      sc.delegate = self 
      let scb = sc.searchBar 
      scb.tintColor = UIColor.white 
      scb.barTintColor = UIColor.white 


      if let textfield = scb.value(forKey: "searchField") as? UITextField { 
       textfield.textColor = UIColor.blue 
       if let backgroundview = textfield.subviews.first { 

        // Background color 
        backgroundview.backgroundColor = UIColor.white 

        // Rounded corner 
        backgroundview.layer.cornerRadius = 10; 
        backgroundview.clipsToBounds = true; 

       } 
      } 

      if let navigationbar = self.navigationController?.navigationBar { 
       navigationbar.barTintColor = UIColor.blue 
      } 
      navigationItem.searchController = sc 
      navigationItem.hidesSearchBarWhenScrolling = false 

} 

結果:

enter image description here

enter image description here


隨着圓角:
動畫與圓潤的邊角也工作正常。

enter image description here

+0

是的,渴望成功,謝謝!圓形的邊緣也可以在view.layer我想。完成這一點,我會將它標記爲已回答,供其他人找到。有關內部工作的內部知識也不是實現它的最佳方式,但如果這是唯一的方法... – Darko

+0

我試圖設置圓角層並且它可以工作。但是當滾動搜索欄時動畫看起來很奇怪。總的來說,所有這些看起來像是黑客,並不是很好的工作。 – Darko

+0

與我面臨的問題分享我的示例項目。 – Krunal

0

試試這個代碼,

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

'if let textField = navigationItem.searchController?.searchBar.value(forKey:「_searchField」)as? UITextField {textField.backgroundColor = UIColor.white }' - 這不起作用。 – Darko

1

這應該

func addSearchbar(){ 
     if #available(iOS 11.0, *) { 
      let sc = UISearchController(searchResultsController: nil) 
      let scb = sc.searchBar 
      scb.tintColor = UIColor.white 

      if let navigationbar = self.navigationController?.navigationBar { 
       //navigationbar.tintColor = UIColor.green 
       //navigationbar.backgroundColor = UIColor.yellow 
       navigationbar.barTintColor = UIColor.blue 
      } 

      navigationController?.navigationBar.tintColor = UIColor.green 
      navigationItem.searchController = sc 
      navigationItem.hidesSearchBarWhenScrolling = false 
     } 
} 


你結果工作:

enter image description here

enter image description here

+0

這正是我已經擁有的。我需要搜索欄有一個_white_背景。 – Darko

+1

這真的好像在iOS 11中實際上是不可能的。 – Darko

1

我改變了文本字段的背景裏面的AppDelegate此代碼。

夫特4

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { 

     //background color of text field 
     UITextField.appearance(whenContainedInInstancesOf: [UISearchBar.self]).backgroundColor = .cyan 

     } 

這是結果

example used to change the background to cyan color

2

目標C

if (@available(iOS 11.0, *)) { 
    self.searchController = [[UISearchController alloc] initWithSearchResultsController:nil]; 
    self.searchController.searchResultsUpdater = self; 
    self.searchController.searchBar.delegate = self; 
    self.searchController.dimsBackgroundDuringPresentation = NO; 
    self.navigationItem.searchController=self.searchController; 
    self.navigationItem.hidesSearchBarWhenScrolling=NO; 
    self.searchController.searchBar.searchBarStyle = UISearchBarStyleProminent; 
    self.searchController.searchBar.showsBookmarkButton = NO; 
    self.searchController.searchBar.placeholder = @"Search"; 
    self.searchController.searchBar.tintColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:1]; 
    self.searchController.searchBar.barTintColor=[UIColor colorWithRed:1 green:1 blue:1 alpha:1]; 
    UITextField *txfSearchField = [self.searchController.searchBar valueForKey:@"_searchField"]; 
    txfSearchField.tintColor=[UIColor colorWithRed:21/255.0 green:157/255.0 blue:130/255.0 alpha:1]; 
    txfSearchField.textColor=[UIColor colorWithRed:1 green:1 blue:1 alpha:1]; 
    txfSearchField.backgroundColor=[UIColor whiteColor]; 
    UIView *backgroundview= [[txfSearchField subviews]firstObject ]; 
    backgroundview.backgroundColor=[UIColor whiteColor]; 
    // Rounded corner 
    backgroundview.layer.cornerRadius = 8; 
    backgroundview.clipsToBounds = true; 
} 
+0

歡迎來到Stack Overflow!感謝您的代碼片段,它可能會提供一些有限的即時幫助。通過展示*爲什麼*這是一個很好的解決方案,並且使它對未來的讀者更有用,一個正確的解釋[將大大提高](// meta.stackexchange.com/q/114762)其長期價值其他類似的問題。請[編輯]你的答案以添加一些解釋,包括你所做的假設。 –

0

這是我用於使搜索欄白色的代碼:

if let textfield = searchController.searchBar.value(forKey: "searchField") as? UITextField { 
      if let backgroundview = textfield.subviews.first { 
       backgroundview.backgroundColor = UIColor.init(white: 1, alpha: 1) 
       backgroundview.layer.cornerRadius = 10 
       backgroundview.clipsToBounds = true 
      } 
     } 

enter image description here

相關問題