How to add a button to a Tab Bar Controller - ios

I mean, not a UITabBarItem, an UIButton. For example, in the Deezer app, the middle button shows a view with an animation that covers the entire screen. I don't want the button to be rounded. Just to execute the action.

This is a very simplistic example. You'll still have to modify it to fit your needs, but if you have a UIBarButtonItem called button that you've added to your navigationBar, you should be able to do something like this, in viewDidLoad
button.action = #selector(showView)
Then you just need to create a function to be called.
func showView() {
let myView = UIView()
self.view.addSubview(myView)
}
Of course this has no animations, but again this is just to point you in the right direction.

Related

Why viewDidLoad function is not called?

I want to change UIBarButton's color in the navigationBar. To achieve this, in viewDidLoad: I put this line:
navigationController?.navigationBar.tintColor = .white
Everything works fine until I started to notice something strange. That UIBarButton is used to dismiss the UIViewController. When it is pressed, I just dismiss the viewController. But, if I present it (viewController) again, the color of the UIBarButton is not white, it gets tintColor of the application.
After doing some debugging, I noticed that viewDidLoad: is not called again after the viewController is just dismissed and presented again. The reason why my UIBarButton has a different color is because I change its color in viewDidLoad:. When viewDidLoad: is not called, of course, color is not changed.
It was an interesting discovery for me the fact that iOS doesn't call viewDidLoad: for UIViewController that was presented already. Possibly, it is due to the optimisation, because it is not efficient to draw the whole UI every time.
My solution to this problem can be to change color, not in viewDidLoad:, but in viewDidAppear:. But, is it right approach to solve a problem? And why viewDidLoad: is not called in the above situation?
It looks like you create and store you view controller, but present it wrapped in UINavigationController:
let controller = YourModalViewController()
...
func presentMyModal() {
present(UINavigationController(rootViewController: controller))
}
In this case your viewDidLoad method will be called just once and you'll have visual bug. If you want to leave styling code of your modal inside it's file you can create instance func which will return this controller wrapped and styled.
extension YourModalViewController {
func wrappedInNC() -> UINavigationController {
let nc = UINavigationController(rootViewController: controller)
// Styling code.
return nc
}
}

Where is the back button graphic Apple uses in the navigation stack?

I want to add code to the back button presented in UINavigationController. But, I want the back button to look identical to what Apple presents.
I have this all setup to use my graphic in the leftBarButton, but am unable to get the graphic to look perfect. To that end, is there a way that I can use the internal iOS back button in my own custom button?
Unfortunately the navigation bar's back button is not very customizable. There is no simple way to access this image.
If you're familiar with Sketch or Photoshop, I suggest you take a screenshot of the back button and trace your image over the exact location.
If you can't do this, you technically can access the back buttons image through some minor UI manipulation. You'll have to first have a back button which is on screen. Once you know it's on screen, such as in your viewDidAppear, you'll want to look through the subviews of your leftBarButtonItem. One way you can do this is by calling navigationBar.subviews and navigating until the view. Another way is to expose the items target view.
extension UIBarButtonItem {
var targetView: UIView? {
guard let view = value(forKey: "view") as? UIView else {
return nil
}
return view
}
}
Now you can call leftBarButtonItem.targetView.subviews. Your for-loop would look something like,
for subview in leftBarButtonItem.targetView.subviews {
if let imageView = subview as? UIImageView {
self.image = imageView?.image
}
}
All of this is pseudo code and untested. Typically UIKit will use the standard classes (such as UIImageView) when building their views. However in older classes, they have been known to draw images manually. So if there is no image, you can always resort to taking a snapshot of the view with the arrow.
view.snapshotView(afterScreenUpdates: false)
Once you have your image / view, you'll save it in a property (most likely in your custom navigation controller) and then you'll have access to it whenever you push new view controllers.

Display a UIView / UIControl overlapping UIToolbar

I'm trying to display a large button at the bottom of the screen, so that it appears above the toolbar.
Button Overlapping Toolbar
My first attempt at this works on the iPad, and on the iPhone in Landscape mode, but the button appears behind the toolbar in Portrait mode. So, this is probably related to the difference in rendering with the Split View Controller:
addButton.frame = CGRect(x:0, y:0, width:48, height:48)
addButton.setBackgroundImage(UIImage(named:"Button - Add"), for: .normal)
let topView = self.navigationController?.view
topView?.addSubview(addButton)
I don't want it to appear above all other view controllers, e.g. popovers and modal segues, so I can't place the button on the application's topmost window, i.e. the following doesn't give me the right result either:
let topView = UIApplication.shared.windows.first
topView?.addSubview(addButton)
The only solution that works for me is to add the button to the toolbar, but this isn't great because the touch zone for the button is clipped by the toolbar:
self.navigationController?.toolbar.addSubview(addButton)
let topView: UIView? = addButton.superview
So, does anyone know of a way to place a UIView or UIControl in a layer or view above the toolbar, but still on the active viewController?

iOS 11 on NavigationBar pull down - height of bar changes?

What I want to to: I want to drag down the whole view of a viewController to dismiss to the parent viewController using a pan gesture recognizer.
The Problem: When I drag the view down, the navigationBar decreases its height and does not look good. When the view returns to its original position, the navigationBar returns to the default size. I want the navigationBar to stay at its size. I also tried to use the new large titles and some other properties of the navigationController/-bar, but that did not solve it.
Note: Everything worked fine already before iOS 11.
My code:
override func viewDidLoad() {
super.viewDidLoad()
let panGesture = UIPanGestureRecognizer(target: self, action: #selector(dragViewDown(_:)))
navigationController!.view.addGestureRecognizer(panGesture)
}
#IBAction func dragViewDown(_ gesture: UIPanGestureRecognizer) {
if let dragView = gesture.view {
let translation = gesture.translation(in: dragView)
dragView.center.y = (dragView.center.y + translation.y)
gesture.setTranslation(CGPoint.zero, in: dragView)
}
}
This test project only has one viewController and does not provide the dismissal, but the problem is the same as in my working project.
I also uploaded the project to GitHub: https://github.com/maddinK7/navitationBar-pull-down-problem
Does anyone have an idea how to solve this? Thanks in advance.
I want the navigationBar to stay at its size
It is staying at its size. If you check the navigation bar's bounds size height before, during, and after the drag, you will see that it remains the same (probably 44) at all times. What's changing is the drawing extension that causes the drawing of the nav bar to extend up behind the status bar. It can't do that when you pull the whole thing away from the top of the screen, because it is not at the top next to the status bar any more. iOS 11 is more strict about the way it performs this drawing extension, probably because it has to do it in a special way on the iPhone X.
So, let's make sure you're doing this correctly:
Make sure that the navigation bar has a top constraint pinned to the safe area layout guide's top, with a constant of zero.
Make sure that the navigation bar has a delegate that returns .topAttached from position(forBar:).
If you are doing both those things and it doesn't help, you'll have to implement this in some other way entirely. Making the view directly draggable like this, without a custom parent view controller, was always dubious.
When UINavigationController attached top, system will add safe area top margin in the navigation background.
(NOTICE: Background margin will not changed when offset value is between 1 and 0)
So you have to handle attached/detached top event by handle gesture offset to change the right offset and content insets.
You can try the solution in my lib example. ;)
My example include UITableViewController in the UINavigationController, so it will relatively complex.
https://github.com/showang/OverlayModalViewController

backBarButtonItem becomes visible on iOS 10 when titleView has constraints

Having a very weird behavior on iOS 10. Assume you have an empty app, created with a Master-Detail Application template. Place any UIView as a titleView in navigationBar for detail viewcontroller. Place any UIView to the right bar button items.
Then, write that code to configureView method:
if let item = self.splitViewController?.displayModeButtonItem {
self.navigationItem.leftBarButtonItem = item
self.navigationItem.leftItemsSupplementBackButton = true
}
Then configure splitviewcontroller preferredDisplayMode = .allVisible, so the displayModeButtonItem could appear.
On iOS 9 and lower this results in a standard behavior: the detail viewcontroller displays displayModeButtonItem expand button on a left side.
When user taps it, the icon transforms to an arrow. Tapping an arrow reverses button state.
On iOS 10 displayModeButtonItem displays as expand button, but if user taps it, it disappears.
Meanwhile, the button is still there and a user can tap it one more time. After that, displayModeButtonItem appears again with expand icon and backButtonItem icon as well. Just like it appears when we push another viewcontroller onto detail's navigationcontroller:
But in that case both of icons acts as displayModeButtonItem.
Is this an iOS bug, or a misconfig? What can I do to get normal button behavior?
Edit: I found out, that everything works as expected, if a titleView (of rightBarButtonItem's view) does not contain any constraints on it's child views. Filed a radar on this.
Edit 2: Some controls (like UIImageView) may implicitly add NSContentSizeLayoutConstraint, so, to prevent this behavior (and prevent the bug above), subclass it and override intrinsicContentSize method like this:
private class NoConstraintsUIImageView: UIImageView {
private override func intrinsicContentSize() -> CGSize {
// prevent implicit NSContentSizeLayoutConstraint adding in updateConstraints
return CGSize(width: UIViewNoIntrinsicMetric, height: UIViewNoIntrinsicMetric)
}
}

Resources