Make UIImage full screen overlaying Nav & Tabbar too - swift

I have a picture that becomes full screen with black bars to preserve ratio. The problem I'm running into is that it doesn't go over the navbar and tabbar as well. I'm guessing the part of the code I need to change is in here
let imageView = sender.view as! UIImageView
let newImageView = UIImageView(image: imageView.image)
newImageView.frame = self.view.frame
newImageView.backgroundColor = .black
newImageView.contentMode = .scaleAspectFit
What can I set the newImageView frame to so it covers everything?

The problem is that the full screen image is behind the navigation bar and tab bar.
To set it to the full screen size, use UIScreen.main.bounds:
newImageView.frame = UIScreen.main.bounds
When presenting the full screen image, hide the navigation bar and tab bar:
self.navigationController?.isNavigationBarHidden = true
self.tabBarController?.tabBar.isHidden = true
When dismissing the full screen image, restore the navigation bar and tab bar:
self.navigationController?.isNavigationBarHidden = false
self.tabBarController?.tabBar.isHidden = false
Alternate solution
As #LeoDabus mentioned in the comments, you can solve this by presenting a new viewController which contains the imageView that covers the entire view. Present this viewController modally with:
self.present(newViewController, animated: false, completion: nil)
Note: Setting animated to false will allow the full screen image to appear without animation.

Related

Reapply constraints after hiding UITabBar

I have a UIButton that is constrained to the view's safeAreaLayoutGuide bottom anchor and a UITabBar in that UIView. Everything is okay there. However, when I fullscreen an image, I hide the UITabBar. When I dismiss the fullscreen, I show the UITabBar again. However, the UIButton moves down and doesn't constrain to the UITabBar as it did before the UITabBar was hidden. The UIButton is covered partially by the UITabBar. Any solutions?
Here is the dismiss fullscreen code.
#objc func dismissFullscreenImage(_ sender: UITapGestureRecognizer) {
sender.view?.removeFromSuperview()
self.navigationController?.isNavigationBarHidden = false
self.tabBarController?.tabBar.isHidden = false
}
Here are two things you can try:
Solution 1:
Add this line to dismissFullscreenImage():
self.view.setNeedsLayout()
This invalidates the layout of self.view and causes it to be laid out again.
Solution 2:
You can avoid the need to relayout the view by making the navigationBar and tabBar invisible.
Instead of hiding/showing the navigationBar and tabBar by changing their isHidden properties, try setting their alpha values:
// hide
self.navigationController?.navigationBar.alpha = 0
self.tabBarController?.tabBar.alpha = 0
// show
self.navigationController?.navigationBar.alpha = 1
self.tabBarController?.tabBar.alpha = 1

Pull to refresh indicator gets miss placed when adding imageview behind nav bar

I can't figure out why this happens, but when I add a imageview behind my tableview and navigation bar, my navigation bar acts strange:
The navigation bar gets stuck in a static position and dosenĀ“t move while scrolling as it did before
The activity indicator from pull to refresh gets placed between the navigation bar button and the top of the tableview. Instead of staying on top of the navigation bars title as before.
Left picture is the bug without the imageview in the background.
Right picture show how it works perfectly without the imageview.
My code to get the clear navigation bar (Though I don't think this introduces any problem as it works fine when the imageview in the background isn't there):
self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true self.navigationController?.view.backgroundColor = UIColor.clear
Found a solution.
Set the image as the backgroundview of the tableview and set the tableview to be fullscreen.
let image = UIImage(named: "myphoto")
let iv = UIImageView(image: image)
iv.contentMode = .scaleAspectFill
iv.layer.frame = CGRect(x: 0, y: 0, width: (self.tableView.superview?.frame.size.width)!, height: (self.tableView.superview?.frame.size.height)!)
let tableViewBackgroundView = UIView()
tableViewBackgroundView.addSubview(iv)
self.tableView.backgroundView = tableViewBackgroundView

Why I cannot make my UITabBarController blurred?

I have a UITabBar and I want to make it blurred. I wrote the following code:
import UIKit
class TabBarController:UITabBarController {
override func viewDidLoad() {
super.viewDidLoad()
let blur = UIBlurEffect(style: UIBlurEffectStyle.Light)
let blurView = UIVisualEffectView(effect: blur)
blurView.frame = self.view.bounds
blurView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
self.view.layer.insertSublayer(blurView, atIndex: 0)
}
}
but somehow the last line throws error:
Cannot convert value of type 'UIVisualEffectView' to expected argument
type 'CALayer'
how can I fix that?
I changed the last line to:
self.tabBar.addSubview(blurView)
but now the whole tabbar is blurred (even with icons and they are not visible). When I changed this line to:
self.tabBar.sendSubviewToBack(blurView)
then the tabbar is visible, but not blurred. I want to achieve effect from accepted answer from here Black background on transparent UITabBar but here it is uitabbar and I'm using uitabbarcontroller... Can you help me with applying blur in my case?
You just add the blur view as a subview:
self.view.addSubview(blurView)
Since you just want to blue the tab bar and this class is a tab bar controller, you can do:
self.tabBar.addSubview(blueView)
You also need to change the frame:
blurView.frame = self.tabBar.bounds
why don't you just use the barTintColor property on your TabBarController?
self.tabBar.translucent = true
self.tabBar.barTintColor = UIColor.blackColor()
You don't even need to subclass UITabBarController. You can call this on any UIViewController.
self.tabBarController?.tabBar.translucent = true
self.tabBarController?.tabBar.barTintColor = UIColor.blackColor()
If I understood correctly from the following comment that you posted, you want to change the UITabBar to be black in colour but still blurred.
And yes, I noticed that the UITabBarController is blurred by default, but I would like to make it blurred with specific style (.Dark).
Doing this since iOS 7 has actually become quite easy. Simply change the barStyle of your UITabBar to .black. Put the following code in your UIViewController's viewDidLoad method (note that UITabBar is translucent by default, so you don't need to specify that again).
tabBarController?.tabBar.barStyle = .black
If you want to set it back to the regular, white barStyle, change it back to .default.
tabBarController?.tabBar.barStyle = .default
You may even do this from within Interface Builder by selecting the Tab Bar in your UITabBarController's hierarchy and changing its Style to Black.
I have a solution, all you need is configure your UITabBar as following:
// next code will make tabBar fully transparent
tabBar.isTranslucent = true
tabBar.backgroundImage = UIImage()
tabBar.shadowImage = UIImage() // add this if you want remove tabBar separator
tabBar.barTintColor = .clear
tabBar.backgroundColor = .black // here is your tabBar color
tabBar.layer.backgroundColor = UIColor.clear.cgColor
If you want to add blur, do this:
let blurEffect = UIBlurEffect(style: .dark) // here you can change blur style
let blurView = UIVisualEffectView(effect: blurEffect)
blurView.frame = tabBar.bounds
blurView.autoresizingMask = .flexibleWidth
tabBar.insertSubview(blurView, at: 0)
As a result:
Attach bottom constraint to the bottom of the view instead of Safe Area
It just might not be a problem with your TabBar but with tableView constraints.
Tab bar is blurred by default.

ScrollView and Navigation Bar ios9

I have a View Controller (named View2) embedded in a Navigation Controller.
In this view I have a ScrollView which covers all the view (including the navigation bar).
This View Controller is presented from another view with the call:
let view2 = self.storyboard?.instantiateViewControllerWithIdentifier("View2") as! View2
let modalStyle: UIModalTransitionStyle = UIModalTransitionStyle.CrossDissolve
let nav: UINavigationController = UINavigationController.init(rootViewController: view2)
nav.modalTransitionStyle = modalStyle
self.presentViewController(nav, animated: true, completion: nil)
In my View2, I adjust the navigation bar to be translucent:
navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.translucent = true
But there is an issue, when View2 appears, the scrollview starts bellow the navigation bar. I have to tapp one time on the scrollview to see it auto-adjust at the top of the screen, over the navigation bar.
Any idea to fix it?
I want than the scrollview appears at the top of the screen, over the translucent navigation bar.
Thank you for your feedbacks,
Thomas
Did you try setting automaticallyAdjustsScrollViewInsets = false on your view controller?
Another option would be to uncheck the option "Under Top Bar" in the view controller's attributes inspector in "Extend Edges".
Hope this helps.

Howto Size the Modal View programmatically (SWIFT)

I simply want to present a small option dialog over an existing main UIViewController/UIView , so that on an IPad I would see a small Dialog and in the Background I will see the Main View.
I managed to show a UIViewController/UIView in a modal view style as follow:
func showoptions(){
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let controller = storyboard.instantiateViewControllerWithIdentifier("Options") as! UIViewController
controller.modalPresentationStyle = UIModalPresentationStyle.Popover
let popoverPresentationController = controller.popoverPresentationController
// result is an optional (but should not be nil if modalPresentationStyle is popover)
if let _popoverPresentationController = popoverPresentationController {
// set the view from which to pop up
_popoverPresentationController.sourceView = self.view;
//_popoverPresentationController.sourceRect = CGRectMake(60, 100, 500, 500)
//_popoverPresentationController. .setPopoverContentSize(CGSizeMake(550, 600), animated: true)
//_popoverPresentationController.sourceView.sizeToFit();
// present (id iPhone it is a modal automatic full screen)
self.presentViewController(controller, animated: true, completion: nil)
}
}
But I have still some issues:
1. Howto get rid of the arrow shown at the border.
2. Howto size this modal view. It is shown to small and I would like to fit it to the largest controls in the UIControllerView/UIView.
any help ?
Try changing _popoverPresentationController.permittedArrowDirections to empty option set
Change controller.preferredContentSize to match your desired size
I needed something similar and ended up presenting a view controller as a modal with a transparent background over the current context. There I made a smaller opaque UIView with what I wanted.