Get the default shrunk and expanded height of large title navigation bar - ios

I have enabled large titles for the navigation bar with:
navigationController?.navigationBar.prefersLargeTitles = true
This makes the navigation bar start with an expanded height, and shrink as the user scrolls down.
Now, I want to add a subview inside the navigation bar that resizes, based on how tall the navigation bar is. To do this, I will need to get both the maximum and minimum height of the navigation bar, so I can calculate the fraction of how much it's expanded.
I can get the current height of the navigation bar like this:
guard let height = navigationController?.navigationBar.frame.height else { return }
print("Navigation height: \(height)")
I'm calling this inside scrollViewDidScroll, and as I'm scrolling, it seems that the expanded height is around 96 and the shrunk height is around 44. However, I don't want to hardcode values.
iPhone 12
Expanded (96.33)
Shrunk (44)
iPhone 8
Expanded (96.5)
Shrunk (44)
I am also only able to get these values when the user physically scrolls up and down, which won't work in production. And even if I forced the user to scroll, it's still too late, because I need to know both heights in advance so I can insert my resizing subview.
I want to get these values, but without hardcoding or scrolling
Is there any way I can get the height of both the shrunk and expanded navigation bar?

Came across my own question a year later. The other answer didn't work, so I used the view hierarchy.
It seems that the shrunk appearance is embedded in a class called _UINavigationBarContentView. Since this is a private class, I can't directly access it. But, its y origin is 0 and it has a UILabel inside it. That's all I need to know!
extension UINavigationBar {
func getCompactHeight() -> CGFloat {
/// Loop through the navigation bar's subviews.
for subview in subviews {
/// Check if the subview is pinned to the top (compact bar) and contains a title label
if subview.frame.origin.y == 0 && subview.subviews.contains(where: { $0 is UILabel }) {
return subview.bounds.height
}
}
return 0
}
}
Usage:
override func viewDidLoad() {
super.viewDidLoad()
self.title = "Navigation"
if
let navigationBar = navigationController?.navigationBar,
let window = UIApplication.shared.keyWindow
{
navigationBar.prefersLargeTitles = true /// Enable large titles.
let compactHeight = navigationBar.getCompactHeight() // 44 on iPhone 11
let statusBarHeight = window.safeAreaInsets.top // 44 on iPhone 11
let navigationBarHeight = compactHeight + statusBarHeight
print(navigationBarHeight) // Result: 88.0
}
}
The drawback of this answer is if Apple changes UINavigationBar's internals, it might not work. Good enough for me though.

Using following extension u can get extra height
extension UINavigationBar
{
var largeTitleHeight: CGFloat {
let maxSize = self.subviews
.filter { $0.frame.origin.y > 0 }
.max { $0.frame.origin.y < $1.frame.origin.y }
.map { $0.frame.size }
return maxSize?.height ?? 0
}
}
And I said earlier u can get extended height by following
guard let height = navigationController?.navigationBar.frame.maxY else { return }
print("Navigation height: \(height)")
let window = UIApplication.shared.keyWindow
let topPadding = window?.safeAreaInsets.top
let extendedHeight = height - topPadding
You can get shrunk height by subtracting difference from extended height
guard let difference = navigationController?.navigationBar.lagreTitleHeight else {return}
let shrunkHeight = extendedHeight - difference

Related

Animate the height of a UIScrollView based on it's content

My situation:
I have a horizontal ScrollView containing a StackView.
Inside this StackView there are some Views, that can be expanded/collapsed.
When I want to expand one of these Views, I first unhide some subViews in the View. After that I need to change the height of the ScrollView based on the new height of this View.
But this is not working...
I try this code:
UIView.animate(withDuration: 0.3) { [self] in
// Toggle hight of all subViews
stackView.arrangedSubviews.forEach { itemView in
guard let itemView = itemView as? MyView else { return }
itemView.toggleView()
}
// Now update the hight of the StackView
// But here the hight is always from the previous toggle
let height = self.stackView.arrangedSubviews.map {$0.frame.size.height}.max() ?? 0.0
print(height)
heightConstraint.constant = height
}
This code nicely animates, but always to the wrong height.
So the ScrollView animates to collapsed when it should be expanded and expanded when it should be collapsed.
Anyone with on idea how to solve this?
The problem is that, whatever you are doing here:
itemView.toggleView()
may have done something to change the height a view, but then you immediately call:
let height = self.stackView.arrangedSubviews.map {$0.frame.size.height}.max() ?? 0.0
before UIKit has updated the frames.
So, you can either track your own height property, or...
get the frame heights after the update - such as with:
DispatchQueue.main.async {
let height = self.stackView.arrangedSubviews.map {$0.frame.size.height}.max() ?? 0.0
print("h", height)
self.scrollHeightConstraint.constant = height
UIView.animate(withDuration: 0.3) {
self.view.layoutIfNeeded()
}
}

Managing view frame when hide and unhide a tabbar

I have a UIViewController that has tab bar controller at bottom. When user click on a button I m hiding the tab bar. Tab bar is getting hidden but there is a white space at bottom. ViewController frame is not changing. How to manage this ? If tabor controller gets hidden, viewController height should get increase.
func apply(_ effect: ActivityFeedEffect) {
switch effect {
case .feedTypeChange(mode: let mode):
self.parent?.tabBarController?.tabBar.isHidden = mode == .hidden
}
}
This is an extension on UITabBarController, which you can use.
This basically, updates the frames of the view.
You can add animation and other frame handling if needed, based on your use case. But this is something that can lead you in that direction.
extension UITabBarController {
func hideTabBar(isHidden:Bool) {
if (isTabBarAlreadyHidden() == isHidden) { return }
let frame = self.tabBar.frame
let height = frame.size.height
let offsetY = (isHidden ? -height : height)
self.tabBar.frame.offsetBy(dx:0, dy:offsetY)
self.view.frame = CGRect(x:0,y:0,width: self.view.frame.width, height: self.view.frame.height + offsetY)
self.view.setNeedsDisplay()
self.view.layoutIfNeeded()
}
func isTabBarAlreadyHidden() ->Bool {
return self.tabBar.frame.origin.y < UIScreen.main.bounds.height
}
}
In my case, I have configured on the storyboard the extended Edges to go under bottom bars and under opaque bars (see image). So My view always takes the hole screen, and I don't need to adjust the frame. Maybe this helps.
My structure is Tab bar -> Navigation Controller -> TableView (here I hide/show the tab bar)

iOS 10 - How to create custom Navigation bar large title

My app deployment target version is iOS 10. and I added navigation bar large title in my app. it is working as per need in above iOS 10. if I try to test this in iOS 10 it is not working. So I am trying to create custom Navigation bar large tile for iOS 10 as well. but i don't know how to achieve this. please guide me. Thanks Advance
if #available(iOS 11.0, *) {
navigationController?.navigationBar.prefersLargeTitles = true
} else {
// need to add here as well
}
In case somebody needs this. Here is how I did it. For me, this is better than the default, because it supports whatever customization you may want from large title (ex. multiline)
In my case my layout looks like this. You can have however you want, but make sure title is not inside of the table view / scroll view.
view
view
large title label
view (this view will stick on top)
view
table view
view
view
In this case, I have scrollViewDidScroll delegate, which checks the scrollView content offset to change the titleLabels top constraint. For me top constraint is 16. Change it to whatever you want to have
extension YourViewController: UITableViewDelegate {
public func scrollViewDidScroll(_ scrollView: UIScrollView) {
let titleHeight = titleLabel.bounds.height
if (scrollView.contentOffset.y <= 0) {
// Title is fully visible - table view is at the top
titleLabelTopConstraint.constant = 16
isLargeTitleHidden = false
} else if (scrollView.contentOffset.y > (titleHeight + 16)){
// Title is not visible at all. Table view is at an unknown position but it is not top
titleLabelTopConstraint.constant = -titleHeight
isLargeTitleHidden = true
} else {
// Title is kind of visible. Not fully hidden or shown.
titleLabelTopConstraint.constant = -scrollView.contentOffset.y + 16
isLargeTitleHidden = false
}
} }
I also have the isLargeTitleHidden to update the nav
var isLargeTitleHidden: Bool = false {
didSet{
if (oldValue != isLargeTitleHidden){
updateNavBar()
}
}
}
func updateNavBar(){
let fadeTextAnimation = CATransition()
fadeTextAnimation.duration = 0.2
fadeTextAnimation.type = CATransitionType.fade
navigationController?.navigationBar.layer.add(fadeTextAnimation, forKey: "fadeText")
if isLargeTitleHidden {
navigationItem.title = titleLabel.text
} else {
navigationItem.title = ""
}
}
NavigationBar have a titleView object where the title is. You can customize a label to go there however you want and make navigationBar.titleView = yourLabel or make a custom UIView all the same.

Dynamic CollectionViewCell size using AutoLayout not rendering properly

I currently have my UICollectionView set up in the IB like so:
The bottom constraint has it's constant changed to the height of the keyboard when the keyboard appears:
func keyboardWillShow(notification: NSNotification) {
let keyboardHeight = getKeyboardHeight(notification)
keyboardHeightConstraint.constant = keyboardHeight + 20
print(cardCollectionView.frame)
self.cardCollectionView.configureCollectionView()
self.cardCollectionView.reloadInputViews()
}
Where configureCollectionView() is:
func configureCollectionView() {
self.backgroundColor = UIColor.clearColor()
// Create the layout
let space = 10.0 as CGFloat
let flowLayout = UICollectionViewFlowLayout()
let width = (self.frame.size.width) - 4 * space
let height = (self.frame.size.height)
let edgeInsets = UIEdgeInsetsMake(0, 2 * space, 0, 2 * space)
// Set top and bottom margins if scrolling horizontally, left and right margins if scrolling vertically
flowLayout.minimumLineSpacing = space
flowLayout.minimumInteritemSpacing = 0
// Set horizontal scrolling
flowLayout.scrollDirection = .Horizontal
// Set edge insets
flowLayout.sectionInset = edgeInsets
flowLayout.itemSize = CGSizeMake(width, height)
self.setCollectionViewLayout(flowLayout, animated: true)
// Always allow it to scroll
self.alwaysBounceHorizontal = true
}
Now the problem arises when the keyboard appears:
When the keyboard first appears the CollectionView gets resized and then configureCollectionView() is called. As a result the CollectionViewCell should also get resized but instead it looks like it's being clipped by the bounds of the resized CollectionView.
This can be seen as in the 2nd image in the GIF (after the keyboard appears) there are no rounded corners on the bottom and the 4 buttons are there.
It seems like when I click another TextView the CollectionViewCell goes back to it's correct size, although it still has an alpha = 1 even though nowhere in my code did I set the alpha to one.
To get my final desired result, I had to dismiss the keyboard.
What is wrong with my implementation, what can I do different to achieve my desired result when the keyboard is shown instead of having to go through all of the above?

Increasing and Animating a Navigation Bar's height?

I subclassed UINavigationBar, and I have a button that drops down into a drop down menu. I wish to animate and push the contents below the navigation bar down as the navigation bar increases in height. Essentially I want a temporary table in the view of the navigationBar.
So far I overrode sizeThatFits() to return the custom sizes for the length I want, which is determined by a state enum. And I call sizeToFit() when the navigation bar needs to resize.
override func sizeThatFits(size: CGSize) -> CGSize {
let superSize = super.sizeThatFits(size)
var newSize: CGSize!
if(state == .Normal) {
newSize = CGSizeMake(superSize.width, superSize.height + heightIncrease)
} else if (state == .Menu) {
newSize = CGSizeMake(superSize.width, superSize.height + tableIncrease)
}
return newSize
}
func buttonPressed(){
if(state == .Normal){
state = .Menu
_delegate?.didChangeStateTo(.Menu)
} else if (state == .Menu){
state = .Normal
_delegate?.didChangeStateTo(.Normal)
}
UIView.animateWithDuration(0.3, animations: {
self.sizeToFit()
})
}
When I animate sizeToFit(), the navigation bar increases in size according to the animation, but the contents below the bar (the view of the viewController) immediately jumps down to the full length.
This is because sizeThatFits immediately returns the new CGSize. So the animation only works for the navigation bar itself, and the contents of the view do not follow the animation, but jump to their destination.
I tried avoiding using sizeThatFits, but UINavigationBar doesn't allow you to change the size of the bar simply by setting the frame with a CGRect.
I know there are other ways of going about this without playing around with subclassing UINavigationBar, but with my app's UI this way would be the most effective and code efficient.
Thanks in advance

Resources