I want to achive a viewcontroller modal such as the Apple HandOff HomePod UI style.
It should be a modal on top of the current ViewController (which is and should stay in fullscreen) and should have a modal on top of itself.
The result should look like this, with the same corner radius of the device:
I already tried shrinking the modal view controller, using UIViewControllerTransitioningDelegate, with this code, but couldn't apply a corner radius to the ViewController or NavigationController:
extension ViewController: UIViewControllerTransitioningDelegate {
func presentationController(forPresented presented: UIViewController, presenting: UIViewController?, source: UIViewController) -> UIPresentationController? {
return ShrinkedPresentationController(presentedViewController: presented, presenting: presentingViewController)
}
}
class ShrinkedPresentationController: UIPresentationController {
override var frameOfPresentedViewInContainerView: CGRect {
guard let bounds = containerView?.bounds else { return .zero }
return CGRect(x: 0, y: 60, width: bounds.width, height: bounds.height - 60)
}
}
My app contains a modal UIView that can be presented from anywhere. How this works is the present method attaches the view as a subview on the key window:
func present(_ completion: ((Bool) -> ())? = { _ in }) {
guard !isPresented else {
return
}
if !isBackgroundReady {
initializeBackground()
}
UIApplication.shared.keyWindow?.addSubview(backgroundView)
UIApplication.shared.keyWindow?.addSubview(self)
UIView.animate(withDuration: 0.3, animations: {
self.backgroundView.alpha = 0.35
self.alpha = 1.0
}, completion: { _ in
self.isPresented = true
completion?(true)
})
}
private func initializeBackground() {
backgroundView.backgroundColor = UIColor.black
backgroundView.alpha = 0.0
backgroundView.frame = CGRect(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY, width: UIScreen.main.bounds.width * 1.2, height: UIScreen.main.bounds.height * 1.2)
backgroundView.center = CGPoint(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY)
}
This modal contains an email link that users can click that opens up an email prompt (or an email action sheet if they long press it). This link is added by using the an NSAttributedString and it's .link attribute on a UITextView:
let supportString = NSMutableAttributedString(
string: "general.supportEmail".localized(),
attributes: [
.link: "mailto:\("general.supportEmail".localized())",
]
)
supportTextView.attributedText = supportString
However, when the email prompt or action sheet appears, it is displayed behind the modal view:
Is it possible to get the prompt/action sheet to appear above the modal view with the current way I present the modal, or will I need to add some sort of recognizer somewhere that detects when one of these views appears and temporarily dismiss the modal until my app view comes back into focus? If it's the later, how would I accomplish that?
The quick answer as to why this is happening is that you are presenting your custom modal view on top of the Window, which will be on top of everything, and your UIAlertController will be presented on the UIViewController presenting it (which is below your custom view).
One quick solution would be to always add your custom view as a subview on the current "top" UIViewController. You can do that with a UIViewController extension - something like this:
extension UIViewController {
static func topViewController(_ viewController: UIViewController? = nil) -> UIViewController? {
let viewController = viewController ?? UIApplication.shared.keyWindow?.rootViewController
if let navigationController = viewController as? UINavigationController, !navigationController.viewControllers.isEmpty {
return self.topViewController(navigationController.viewControllers.last)
} else if let tabBarController = viewController as? UITabBarController,
let selectedController = tabBarController.selectedViewController
{
return self.topViewController(selectedController)
} else if let presentedController = viewController?.presentedViewController {
return self.topViewController(presentedController)
}
return viewController
}
}
This extension will handle any UIViewController that is "on top", whether it's in a UINavigationController, a UITabBarController, or just presented modally, etc. Should cover all cases.
After that you can adjust your present method to take this into account:
func present(_ completion: ((Bool) -> ())? = { _ in }) {
guard !isPresented else {
return
}
if !isBackgroundReady {
initializeBackground()
}
guard let topViewController = UIViewController.topViewController() else { return }
topViewController.view.addSubview(backgroundView)
topViewController.view.addSubview(self)
UIView.animate(withDuration: 0.3, animations: {
self.backgroundView.alpha = 0.35
self.alpha = 1.0
}, completion: { _ in
self.isPresented = true
completion?(true)
})
}
Instead of adding in the window, add the modal in the navicontroller -> topviewcontroller.
Link: https://developer.apple.com/documentation/uikit/uinavigationcontroller/1621849-topviewcontroller.
This might help you.
I am trying to hide the navigationBar when putting some SwiftUI inside of a UIKit UIViewController:
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
self.navigationController?.setNavigationBarHidden(true, animated: animated)
But it does not go away. When I take away the SwiftUI however, it works. Does anyone know how to solve this?
Edit:
I am instantiating a view like this:
let controller = UIHostingController(rootView: view())
where view is the SwiftUI and then adding this to the UIView() as you would any UIKit element.
UIHostingViewController respects the navigationBarHidden value of your SwiftUI view. You can either call .navigationBarHidden(true) at the end of your SwiftUI view, or you can use the custom UIHostingController subclass shown in the example below.
Solution:
import SwiftUI
import UIKit
class YourHostingController <Content>: UIHostingController<AnyView> where Content : View {
public init(shouldShowNavigationBar: Bool, rootView: Content) {
super.init(rootView: AnyView(rootView.navigationBarHidden(!shouldShowNavigationBar)))
}
#objc required dynamic init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
Example of usage:
let hostVc = YourHostingController(shouldShowNavigationBar: false, rootView: YourSwiftUIView())
Using the modifier .navigationBarHidden(true) did not work in our case. It had no effect.
Our solution is to subclass UIHostingController and don't let it access the UINavigationController at all. For example:
import UIKit
import SwiftUI
final public class RestrictedUIHostingController<Content>: UIHostingController<Content> where Content: View {
/// The hosting controller may in some cases want to make the navigation bar be not hidden.
/// Restrict the access to the outside world, by setting the navigation controller to nil when internally accessed.
public override var navigationController: UINavigationController? {
nil
}
}
Note that this solution relies on underlying code in UIKit and SwiftUI accessing the UINavigationController and setting the navigation bar hidden state based on the UIViewController.navigationController-property. This may break in the future if Apple decides to change on this assumption.
Ran into this problem yesterday, too.
I am presenting a modal UINavigationController with a UIViewController as rootViewController, which embeds a SwiftUI View via UIHostingController.
Setting the usual setNavigationBarHidden in viewDidAppear of the UIViewController stops working as soon as the SwiftUI View is embedded.
Overview:
Root ViewController: setNavigationBarHidden in viewWillAppear
Navigation Bar Visible:
UINavigationController > root UIViewController > embedded UIHostingController
Navigation Bar Invisible:
UINavigationController > root UIViewController > no UIHostingController
After some debugging I realized that the UIHostingController itself calls setNavigationBarHidden again.
So the reason for this problem is, that the UIHostingControllers alters the surrounding UINavigationController's UINavigationBar.
One easy fix:
Set the Navigation Bar property in the first presented SwiftUI View that is embedded by your UIHostingController.
var body: some View {
MyOtherView(viewModel: self.viewModel)
.navigationBarHidden(true)
}
This will revert the adjustment SwiftUI and the UIHostingController are trying to apply to your surrounding UINavigationController.
As there is no guarantee about the interaction between SwiftUI and UIKit (that it uses underlying UIKit), I would suggest keeping the setNavigationBarHidden in the surrounding viewDidAppear together with this modifier, too.
Hiding navigation bar from a class that is extending UIHostingController seems to work when setNavigationBarHidden is called in viewDidAppear instead of viewWillAppear.
override func viewDidAppear(_ animated: Bool) {
navigationController?.setNavigationBarHidden(true, animated: false)
super.viewDidAppear(animated)
}
In my case, I had to use this UIHostingController subclass.
class NavigationBarHiddenUIHostingController<Content: View>: UIHostingController<Content> {
override func viewWillLayoutSubviews() {
super.viewWillLayoutSubviews()
if navigationController?.isNavigationBarHidden == false {
navigationController?.isNavigationBarHidden = true
}
}
}
I want to include my approach here just in case someone find it useful when working with SwiftUI.
I found out that the problem was that UIHostingController was overriding something on my declare of
navigationController?.setNavigationBarHidden(true, animated: false)
So i just created a custom UIHostingController and used viewWillAppear(_ animated:Bool):
class UIHostingViewControllerCustom:UIHostingController<YourView>{
override func viewWillAppear(_ animated: Bool) {
navigationController?.setNavigationBarHidden(true, animated: false)
}
}
Then when you are adding that UIHostingController into your ViewController:
let hostingController = UIHostingViewControllerCustom(rootView: YourView())
hostingController.view.backgroundColor = .clear
addChild(hostingController)
hostingController.view.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(hostingController.view)
hostingMapView.didMove(toParent: self)
//Constraints
hostingController.view.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
hostingController.view.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
hostingController.view.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: -view.safeAreaInsets.top).isActive = true
hostingController.view.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor, constant: -view.safeAreaInsets.bottom).isActive = true
Nothing worked for me so I added an observer to hide navigationBar in the parent view:
private var observer: NSKeyValueObservation?
override func viewDidLoad() {
super.viewDidLoad()
observer = navigationController?.observe(
\.navigationBar.isHidden,
options: [.new]
) { [weak self] _, change in
guard change.newValue == false else { return }
self?.navigationController?.navigationBar.isHidden = true
}
}
This seems fixed on iOS 16: if you add a symbolic breakpoint for -[UINavigationController setNavigationBarHidden:animated:] and you p $arg3 you'll find that it was nil (false) on iOS 14/15 and it's now 1 (true) on iOS 16, in case you did call setNavigationBarHidden(true somewhere before this internal call happens, i.e. the internal call doesn't overwrite your code anymore.
On iOS 14, #TParizek's solution works (modifier .navigationBarHidden(true)), but on iOS 15 I had to call setNavigationBarHidden(true on the first viewDidLayoutSubviews call.
Unfortunately, if you are making UIHostingViewController without UINavigationController, you would need to make some adaptions to the frame itself(actually to reduce its topAnchor to 48).
It appears that navigationBar spacing shows up only on next viewWillAppear and layout of subviews.
Here is the solution that I have used for my UIHostingViewController.
Firstly, I have made function(inside of my UIHostingViewController) that would set origin(x,y) of my inner subview and set the constraints to self.view.
It has condition(to not do that every time, only when navigation bar spacing shows up):
private var savedView: UIView?
private func removeAdditionalTopSpacing() {
if view.subviews.count == 0 {
return
}
var widgetFrame = view.subviews[0].frame
let widgetStartingPoint = widgetFrame.origin.y
widgetFrame.origin.y = 0
widgetFrame.origin.x = 0
self.view.subviews[0].frame = widgetFrame
self.view.subviews[1].frame = widgetFrame
if widgetStartingPoint > 0 {
self.savedView = self.view
self.savedView?.translatesAutoresizingMaskIntoConstraints = false
self.savedView?.widthAnchor.constraint(equalTo: self.savedView!.subviews[0].widthAnchor).isActive = true
self.savedView?.heightAnchor.constraint(equalTo: self.savedView!.subviews[0].heightAnchor).isActive = true
self.savedView?.centerXAnchor.constraint(equalTo: self.savedView!.subviews[0].centerXAnchor).isActive = true
self.savedView?.centerYAnchor.constraint(equalTo: self.savedView!.subviews[0].centerYAnchor).isActive = true
self.view = self.savedView
self.view.setNeedsLayout()
self.view.layoutIfNeeded()
}
}
Important note:
Reason why I have saved current view inside of private variable savedView is because of his existence and memory release. In this way it won't be lost when removeFromSuperView got called.
There are always 2 subviews of UIHostingViewController.view. One for content and another one for hit range. Both are moved for 48 points down when navigation bar spacing shows up.
There are two places where I have called it: viewDidAppear() and viewDidLayoutSubviews():
public override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
removeAdditionalTopSpacing()
}
public override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
removeAdditionalTopSpacing()
}
Hi to all here is my solution how to hide AND BACK navigation bar
import Foundation
import SwiftUI
import UIKit
class HostingController <Content>: UIHostingController<AnyView> where Content : View {
private weak var previousViewController: UIViewController?
private var shouldShowNavigationBar: Bool
private let shouldShowNavigationBarAfterBack: Bool
public init( rootView: Content, previousViewController: UIViewController?,
shouldShowNavigationBar: Bool = false, shouldShowNavigationBarAfterBack: Bool = true) {
self.previousViewController = previousViewController
self.shouldShowNavigationBar = shouldShowNavigationBar
self.shouldShowNavigationBarAfterBack = shouldShowNavigationBarAfterBack
super.init(rootView: AnyView(rootView))
}
override func viewDidLayoutSubviews() {
navigationController?.setNavigationBarHidden(!shouldShowNavigationBar, animated: false)
super.viewDidLayoutSubviews()
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
DispatchQueue.main.async { [weak self] in
guard let strongSelf = self else {
return
}
strongSelf
.previousViewController?
.navigationController?
.setNavigationBarHidden(!strongSelf.shouldShowNavigationBarAfterBack, animated: false)
}
}
#objc required dynamic init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
How to use it:
let viewController = HostingController(rootView: view, previousViewController: previousViewController)
In case if you need all parameters make not default you can call:
let viewController = HostingController(rootView: view, previousViewController: previousViewController, shouldShowNavigationBar: false, shouldShowNavigationBarAfterBack: false)
previousViewController - it's a controller that make push of this new one controller.
I used SwiftUI introspect library to hide the extra navigation bar that was only showing for OS version lower than 16.
.introspectNavigationController(customize: { navigationController in
navigationController.navigationBar.isHidden = true
})
Do u know where you put in UIKit function inside of swiftUI ?
inside of
var body: some View {
}
you need to call your ViewControllerWrapper class that class need to include some methods in order to use your UIKit class. UIViewControllerRepresentable implementation its also need.
I would like to model a table view after one found in the Todoist app (see below), is it possible to do this without and additional framework? If so how would I go about doing this?
You can create a view controller with a UITableView and present it as UIPopoverPresentationController
let vc = UIViewController()
vc.modalPresentationStyle = .popover
vc.preferredContentSize = CGSize(width: 200, height: 200)
let popUp = vc.popoverPresentationController
popUp?.permittedArrowDirections = .up
popUp?.delegate = self
popUp?.sourceView = sender as! UIView // here set the frame of the button that the arrow points to when popup is shown
present(vc, animated: true, completion: nil)
//
Inside the vc that you presents the popup make it implements the delegate UIPopoverPresentationControllerDelegate and write this method
func adaptivePresentationStyle(for controller: UIPresentationController) -> UIModalPresentationStyle {
return .none
}
I have a main view controller called TestViewController that has a button and when you tap the button, it opens a popover view controller. When you tap on the background, the popover gets dismissed which is what I want to disable. I have this code in my popover view controller and it should run but it's not running.
extension TestViewController: UIPopoverPresentationControllerDelegate {
func popoverPresentationControllerShouldDismissPopover(_ popoverPresentationController: UIPopoverPresentationController) -> Bool {
print ("TEST") //This does not show up in console
return false
}
}
EDIT:
This is the code that I use to open the popover.
let popover = storyboard?.instantiateViewController(withIdentifier: "PopoverVC") as! PopOverViewController
popover.modalPresentationStyle = .popover
popover.popoverPresentationController?.sourceView = self.view
popover.popoverPresentationController?.sourceRect = CGRect(x: self.view.bounds.midX, y: self.view.bounds.midY, width: 0, height: 0)
popover.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
popoverPresentationController?.passthroughViews = nil
popover.dimView2 = self.dimView2
dimView2.isHidden = false
self.present(popover, animated: false)
}
Set the delegate.
popover.popoverPresentationController?.delegate = self
popoverPresentationControllerShouldDismissPopover function is deprecated in iOS 14.
For latest version you should use following code
extension TestViewController: UIPopoverPresentationControllerDelegate {
func presentationControllerShouldDismiss(_ presentationController: UIPresentationController) -> Bool {
return false
}
}