I'm testing out my UI and I find the search bar a little bit too narrow for my liking. I also want to make sure people with poorer vision or poorer manual dexterity have no issues bringing up the interface they want.
So, what I would like to do is Adjust the height of the UITextfield
inside UISearchbar
.
What I have tried: 1. In Storyboard, add UISearchbar
Height constraint - Results: the searchbar size increases, but the UITextField
inside stays the same.
UITextField
inside UISearchbar
and modify its height - Results: The console output shows that the parameter is modified, but on screen, the UITextField
height remains the same.Note - I can modify other parameters of the UITextField
using method 2 and the change is reflected on screen so I know I am getting to the UITextField
Code for Method 2, put in viewDidLoad() of ViewController where UISearchbar is located:
for tempView in (self.roomInfoSearchBar.subviews[0] as! UIView).subviews as! [UIView] { if let tV = tempView as? UITextField { var currentFrameRect = tV.frame currentFrameRect.size.height = 80 //tV.layer.backgroundColor = UIColor.blueColor().CGColor //This works fine //tV.layer.cornerRadius = 5 //This works fine //tV.font = UIFont(name: "Courier", size: 40) //This works fine println(tV.frame.height) //console output:0.0 tV.frame = currentFrameRect println(tV.frame) //console output:(0.0, 0.0, 0.0, 80.0) println(currentFrameRect) //console output:(0.0, 0.0, 0.0, 80.0) - redundant, just checking println(tV.frame.height) //console output:80.0 - it says 80, but screen shows searchbar definitely not 80. } }
I think it has something to do with autolayout somehow being able to disregard parameters regardless of where it is set. I would like to continue to use autolayout since it does a lot of work for me, but I wish it would behave like it does in Storyboard where when a user sets a setting it will use those parameters in its autolayout and complain when it can't as opposed to just ignoring the setting without feedback.
Edit:
In response to Mahesh. I'm don't know much objective C++ but I tried my best to convert what you wrote into swift. This is what I have:
(Inside my viewcontroller.swift)
func viewDIdLayoutSubviews() { super.viewDidLayoutSubviews() self.roomInfoSearchBar.layoutSubviews() var topPadding: Float = 5.0 for view in (self.roomInfoSearchBar.subviews[0] as! UIView).subviews as! [UIView] { if let tfView = view as? UITextField { var calcheight = self.roomInfoSearchBar.frame.size.height - 10 tfView.frame = CGRectMake(tfView.frame.origin.x, CGFloat(topPadding), tfView.frame.size.width, self.roomInfoSearchBar.frame.size.height - CGFloat(topPadding * 2)) } } }
I've kept my code for getting to the textfield since I had some issues converting your code to swift. For the CGRectMake - swift complained about various types including that topPadding wasn't a CGFloat and for the last variable (Y size), again it did not like mixing CGFloat with Float so I had to change that too.
Unfortunately, it does not appear to work. I changed the UISearchbar height to 80 in storyboard and I just got a very tall searchbar with the textfield covering about 1/3 of the total height.
Edit #2: Incorporating Yuyutsu and corrected version of Mahesh code. Still not perfect, but closer. Yuyutsu's code works but as mentioned in my comments, the field does not center, the resize is also visible (jump from height A to height B) when the view is first loaded. One additional deficiency is that because the resize is done at viewDidAppear
once the orientation changes, the field returns to the intrinsic size.
My code based on Yuyutsu's:
override func viewDidAppear(animated: Bool) { super.viewDidAppear(animated) var roomInfoSearchBarFrame = roomInfoSearchBar.frame var newHeight: CGFloat = 60 for subView in roomInfoSearchBar.subviews { for subsubView in subView.subviews { if let textField = subsubView as? UITextField { var currentTextFieldFrame = textField.frame var recenteredY = (roomInfoSearchBarFrame.height - newHeight)/2 var newTextFieldFrame = CGRectMake(textField.frame.minX, recenteredY, textField.frame.width, newHeight) textField.frame = newTextFieldFrame textField.borderStyle = UITextBorderStyle.RoundedRect textField.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight //textField.backgroundColor = UIColor.redColor() // textField.font = UIFont.systemFontOfSize(20) } } } }
Looking at Yuyutsu's code I wanted to know where else I could put this adjustment and I came across link via another stackoverflow post. Based on what I read, I saw that Mahesh's answer should work. This is where I realized why it wasn't working - I needed to override func viewWillLayoutSubviews()
.
Current code: Keeps size with orientation change. But size jump still visible (it shouldn't be visible)
override func viewWillLayoutSubviews() { super.viewWillLayoutSubviews() var roomInfoSearchBarFrame = roomInfoSearchBar.frame var newHeight: CGFloat = 60 for subView in roomInfoSearchBar.subviews { for subsubView in subView.subviews { if let textField = subsubView as? UITextField { var currentTextFieldFrame = textField.frame var recenteredY = (roomInfoSearchBarFrame.height - newHeight)/2 var newTextFieldFrame = CGRectMake(textField.frame.minX, recenteredY, textField.frame.width, newHeight) textField.frame = newTextFieldFrame textField.borderStyle = UITextBorderStyle.RoundedRect textField.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight //textField.backgroundColor = UIColor.redColor() // textField.font = UIFont.systemFontOfSize(20) } } } }
So right now, the only thing left is to try and make it so the textfield is the set size prior to the view being visible so there is no size shift that is visible to the user.
Final Edit: Fully working code With Yuyutsu's additional help, code below does everything I want - starts off at the set size, field is centered, deals with rotation fine.
override func viewDidLayoutSubviews() { super.viewDidLayoutSubviews() self.roomInfoSearchBar.layoutIfNeeded() self.roomInfoSearchBar.layoutSubviews() var roomInfoSearchBarFrame = roomInfoSearchBar.frame var newHeight: CGFloat = 60 //desired textField Height. for subView in roomInfoSearchBar.subviews { for subsubView in subView.subviews { if let textField = subsubView as? UITextField { var currentTextFieldBounds = textField.bounds currentTextFieldBounds.size.height = newHeight textField.bounds = currentTextFieldBounds textField.borderStyle = UITextBorderStyle.RoundedRect //textField.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight } } } }
Thanks Yuyutsu. Thanks Mahesh for pretty much coming up with the final solution right from the start, just missing a few critical bits.
Click the attribute inspector for the textField and then change the Border style to second one and you will be able to change the height.
Using searchbar. heightAnchor. constraint(equalToConstant: 200). isActive = true worked for me.
override func viewDidAppear(animated: Bool) { super.viewDidAppear(animated) for subView in searchBars.subviews { for subsubView in subView.subviews { if let textField = subsubView as? UITextField { var bounds: CGRect bounds = textField.frame bounds.size.height = 35 //(set height whatever you want) textField.bounds = bounds textField.borderStyle = UITextBorderStyle.RoundedRect // textField.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight textField.backgroundColor = UIColor.redColor() // textField.font = UIFont.systemFontOfSize(20) } } } }
This might helps you :)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With