I'm trying to create a modal view using Xcode's storyboard. I want it to consist of a small opaque view within a transparent view, so as to look like what would be called a popup window in desktop terminology.
I've created a segue to the new view controller, set it to "Present Modally" and its presentation to "Current Context", created my opaque view in the new view controller, and then set the background of the view of the new view controller to "Clear Color", and unchecked "Opaque".
When I trigger the segue, the new box slides into place over the previous view, exactly as it should, but then as soon as the animation ends, the background goes black.
What's going wrong here? How can I make the background stay transparent and the old view remain visible?
You can use this category and change the code for you have the transparent modal view. In file UIViewController+ENPopUp.m you just have add [popUpView setBackgroundColor:[UIColor clearColor]]; in the end of presentPopUpView method.
I hope this can help you.
You need to use View Controller Containment:
iOS Developer Library
// Sample code you can use in your UIViewController
func addChildVC(child: UIViewController) {
self.addChildViewController(child)
child.view.bounds = self.view.bounds
self.view.addSubview(child.view)
child.didMoveToParentViewController(self)
}
func removeChildVC(child:UIViewController) {
child.willMoveToParentViewController(nil)
child.view.removeFromSuperview()
child.removeFromParentViewController()
}
Related
I am creating a child view controller in a parent view controller and presenting it with the code below -
self.addChildViewController(childVC)
childVC.view.frame = self.view.bounds
self.view.addSubview(childVC.view)
childVC.view.autoresizingMask = [.flexibleWidth,.flexibleHeight]
childVC.didMove(toParentViewController: baseVC)
The child view controller simply displays a 200 X 300 image view right in the middle. I want the child view controller to blur the parent view controller's view and display this opaque image view. However I can't seem to get it to show the underlying parent view controller's contents no matter what I do. I already tried the following in child view controller's viewDidLoad -
view.backgroundColor = UIColor.black.withAlphaComponent(0.5)
What am I missing here? Is there a better approach? The child view controller's purpose is to encapsulate the image preview logic by blurring the parent view controller's contents and display a UIImageView right in its view's center.
Try using ChildVC.backgroundColor = UIColor.black.withAlphaComponent(0.5). This code makes the child view appear semi transparent.
Hope this helps.
Create a new ViewController as a ChildViewController.
Give segue to ChildViewController from ParentViewController.
set following property
You have to select Presentation as Over current context
You can also change the Transition based on your requirement
See following image
Set background color of childViewController view as what you want and set its opacity 50% or 60% , whatever you want.
This will show parent view with blur effect.
My original solution -
view.backgroundColor = UIColor.black.withAlphaComponent(0.5)
is working. My parent view controller's view is white with very sparse detail so I assumed that the parent view isn't visible, silly overlook on my part.
I'm loading a view controller modally via another view controller and I'm trying to change the background color using:
override func viewDidLoad() {
super.viewDidLoad()
transparentBG.backgroundColor? = UIColor.black.withAlphaComponent(0.4)
// transparentBG is a UIView defined in storyboard
}
While the view is animating into position (sliding up) it maintains the alpha value I set. But once it reaches the top of the screen it removes the alpha component and is changing the color to what looks like the color with the alpha component, so like a gray color, but with no transparency as seen in the image below.
Is there anyway to maintain the alpha component after if finishes loading?
Step one: Change this to an overFullScreen presentation.
Step two: There is no step two.
just set presentaion style on viewContriller
[myViewcontroller setModalPresentationStyle:UIModalPresentationCustom];
[myViewcontroller setModalTransitionStyle:UIModalTransitionStyleCrossDissolve];
[self.navigationController presentViewController:myViewcontroller animated:true completion:nil];
What is happening is that the alpha is being kept, but the previous view is being removed once the animation is complete.
There are a couple approaches you can take.
Take a screen shot of the previous view and insert that as a background in the new view. Look at the drawViewHierarchyInRect function. You can grab the screen shot in the new view controller's init method, then set it as a background image in the viewDidLoad.
The other approach would be to add the overlay as a subview, either to the existing view, or even the window itself.
I've used both methods successfully.
I have a UINavigationController with a UIViewController set as it's rootController, it contains a background on its UIView using an image set just under the navBar. I then push onto the navigation controller a new UIViewController and when the back button is pushed, the previous controller looks different. Using the visual debugger I can see that the self.view has moved entirely down below the navBar where previously it was at the top. I have no idea and been racking my brains as to why this might be happening
-(void)pushIPhoneMessagingContactsController:(MessageContactsViewController *)contactsController{
self.selectorView.hidden = YES;
[self.navigationController pushViewController:contactsController animated:YES];
}
On the RootViewController (iPhoneMessagingNotificationsController)
-(void)viewWillAppear:(BOOL)animated{
self.selectorView.hidden = NO;
[[[self navigationItem] leftBarButtonItem] setTintColor:[UIColor blackColor]];
[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleDefault];
if ([_displayType intValue] == MESSAGES_SHOWING) {
[self.notificationsViewController.view removeFromSuperview];
[self.contentView addSubview:_messagesViewController.view];
} else {
[self.messagesViewController.view removeFromSuperview];
[self.contentView addSubview:_notificationsViewController.view];
}
}
It seems the offending line was in the viewWillAppear method of the pushed UIViewController
self.navigationController.navigationBar.translucent = YES;
Somewhere else this navigationBar gets set as translucent:
[self.navigationController.navigationBar setBackgroundImage:[UIImage new]
forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.navigationBar.translucent = YES;
and to make it solid colour again:
self.navigationController.navigationBar.shadowImage = nil;
self.navigationController.navigationBar.translucent = NO;
but this code seems to mess with the layout so perhaps there is another way to change the opacity of the navBar and statusBar without affecting the layout?
What you're currently trying to do is hide or show a selectorView which really only should appear for one specific view controller.
Here's an encapsulated way to solve this that makes your selectorView a part of the root view controller, removing the connection from other view controllers. They no longer have to know about it or hide it.
Add your selectorView to your rootViewController's navigation bar titleView. (You can do this in code, or drop it in Storyboard and add an IBOutlet for it.)
self.navigationItem.titleView = selectorView;
Now when you push another view controller, its title will replace your rootViewController's selectorView title (view). Your other view controllers don't need to know anything about that view.
This is a good design approach in general. Anytime you have a control that should only appear on one view controller's navigation bar, you want to make it a part of that view controller's navigationItem (titleView, or left/right bar button items.) iOS will display the control when it presents that view controller, and hide the control when that view controller is no longer the top view controller in the navigation controller stack.
As for the 64-pixel height issue, it's likely related to some complexity in the rootViewController hierarchy that shouldn't be there.
In iOS 7/8, a view's content, by default, appears under a translucent navigation bar. Apple freely managed this for you, by insetting the first view of the view hierarchy.
From your code, it appears that you're trying to "hide" or "show" the (un)selected viewController's view.
Each view controller should have a view it controls. A view controller shouldn't be trying to control other view controller's views, or adding other view controller's views to its own view hierarchy.
Here's Apple's recommended way to approach this. Use a containerView in your rootViewController. The whole purpose of a container view is to encapsulate a view controller within a view. As your selectorView changes which view to show, you have your container view transition from one view controller to the other. (If you're not familiar with how to do that, check out this answer.)
Pin the containerView to the rootViewController's view, so Auto Layout can size it for you.
Your view hierarchy now looks like view -> containerView, instead of view -> hidden view of unselected view controller, shown view of selected view controller. Apple can adjust the first view's inset, and nothing gets incorrectly offset (by the height of the navigation control).
Update:
This question talks about scrollViewInsets and how they can be set on a view-controller-by-view-controller basis. If you do have a view controller, and you don't want its content to appear under a bar, uncheck that box.
But the best way to handle this is to "standardize" your UI, so it isn't varying from view to view. Either make the bar always be translucent, or not always be translucent. This makes transitions less "jarring" for the users.
I have a split view controller within a navigation controller and I want to put a DejalActivityView over everything it when I'm doing certain operations. Right now I'm using the following code:
- (void)showActivityView
{
UIView *viewToUse = [MSMasterViewController get].splitViewController.navigationController.view;
[DejalBezelActivityView activityViewForView:viewToUse];
[DejalActivityView currentActivityView].showNetworkActivityIndicator = YES;
}
This works in landscape mode, but when in portrait mode with the master view in popover form, the dejal activity view appears behind the popover. Is there a better view to use that will cover the whole screen?
Maybe you could use your Window as Superview, and only change relativ Frame positing.
greetings Oli
Since there is no complete, definitive answer to this common recurring question, I'll ask and answer it here.
Often we need to present a UIViewController such that it doesn't cover full screen, as in the picture below.
Apple provides several similar UIViewController, such as UIAlertView, Twitter or Facebook share view controller, etc..
How can we achieve this effect for a custom controller?
NOTE : This solution is broken in iOS 8. I will post new solution ASAP.
I am going to answer here using storyboard but it is also possible without storyboard.
Init: Create two UIViewController in storyboard.
lets say FirstViewController which is normal and SecondViewController which will be the popup.
Modal Segue: Put UIButton in FirstViewController and create a segue on this UIButton to SecondViewController as modal segue.
Make Transparent: Now select UIView (UIView Which is created by default with UIViewController) of SecondViewController and change its background color to clear color.
Make background Dim: Add an UIImageView in SecondViewController which covers whole screen and sets its image to some dimmed semi transparent image. You can get a sample from here : UIAlertView Background Image
Display Design: Now add an UIView and make any kind of design you want to show. Here is a screenshot of my storyboard
Here I have add segue on login button which open SecondViewController as popup to ask username and password
Important: Now that main step. We want that SecondViewController doesn't hide FirstViewController completely. We have set clear color but this is not enough. By default it adds black behind model presentation so we have to add one line of code in viewDidLoad of FirstViewController. You can add it at another place also but it should run before segue.
[self setModalPresentationStyle:UIModalPresentationCurrentContext];
Dismiss: When to dismiss depends on your use case. This is a modal presentation so to dismiss we do what we do for modal presentation:
[self dismissViewControllerAnimated:YES completion:Nil];
Thats all.....
Any kind of suggestion and comment are welcome.
Demo :
You can get demo source project from Here : Popup Demo
NEW : Someone have done very nice job on this concept : MZFormSheetController
New : I found one more code to get this kind of function : KLCPopup
iOS 8 Update : I made this method to work with both iOS 7 and iOS 8
+ (void)setPresentationStyleForSelfController:(UIViewController *)selfController presentingController:(UIViewController *)presentingController
{
if (iOSVersion >= 8.0)
{
presentingController.providesPresentationContextTransitionStyle = YES;
presentingController.definesPresentationContext = YES;
[presentingController setModalPresentationStyle:UIModalPresentationOverCurrentContext];
}
else
{
[selfController setModalPresentationStyle:UIModalPresentationCurrentContext];
[selfController.navigationController setModalPresentationStyle:UIModalPresentationCurrentContext];
}
}
Can use this method inside prepareForSegue deligate like this
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
PopUpViewController *popup = segue.destinationViewController;
[self setPresentationStyleForSelfController:self presentingController:popup]
}
Modal Popups in Interface Builder (Storyboards)
Step 1
On the ViewController you want as your modal popup, make the background color of the root UIView clear.
Tip: Do not use the root UIView as your popup. Add a new UIView that is smaller to be your popup.
Step 2
Create a Segue to the ViewController that has your popup. Select "Present Modally".
Two Methods To Create Popup From Here
Method One - Using the Segue
Select the Segue and change Presentation to "Over Current Context":
Method Two - Using the View Controller
Select the ViewController Scene that is your popup. In Attributes Inspector, under View Controller section, set Presentation to "Over Current Context":
Either method will work. That should do it!
You can do this in Interface Builder.
For the view you wish to present modally set its outermost view background to transparent
Control + click and drag from the host view controller to the modal view controller
Select present modally
Click on the newly created segue and in the Attribute Inspector (on the right) set "Presentation" to "Over Current Context"
Feel free to use my form sheet controller MZFormSheetControllerfor iPhone, in example project there are many examples on how to present modal view controller which will not cover full window and has many presentation/transition styles.
You can also try newest version of MZFormSheetController which is called MZFormSheetPresentationController and have a lot of more features.
You can use EzPopup (https://github.com/huynguyencong/EzPopup), it is a Swift pod and very easy to use:
// init YourViewController
let contentVC = ...
// Init popup view controller with content is your content view controller
let popupVC = PopupViewController(contentController: contentVC, popupWidth: 100, popupHeight: 200)
// show it by call present(_ , animated:) method from a current UIViewController
present(popupVC, animated: true)
Imao put UIImageView on background is not the best idea . In my case i added on controller view other 2 views . First view has [UIColor clearColor] on background, second - color which u want to be transparent (grey in my case).Note that order is important.Then for second view set alpha 0.5(alpha >=0 <=1).Added this to lines in prepareForSegue
infoVC.providesPresentationContextTransitionStyle = YES;
infoVC.definesPresentationContext = YES;
And thats all.
Swift 4:
To add an overlay, or the popup view
You can also use the Container View with which you get a free View Controller ( you get the Container View from the usual object palette/library)
Steps:
Have a View (ViewForContainer in the pic) that holds this Container View, to dim it when the contents of Container View are displayed. Connect the outlet inside the first View Controller
Hide this View when 1st VC loads
Unhide when Button is clicked
To dim this View when the Container View content is displayed, set the Views Background to Black and opacity to 30%
You will get this effect when you click on the Button
You can do this to add any other subview to the view controller.
First set the status bar to None for the ViewController which you want to add as subview so that you can resize to whatever you want. Then create a button in Present View controller and a method for button click. In the method:
- (IBAction)btnLogin:(id)sender {
SubView *sub = [[SubView alloc] initWithNibName:#"SubView" bundle:nil];
sub.view.frame = CGRectMake(20, 100, sub.view.frame.size.width, sub.view.frame.size.height);
[self.view addSubview:sub.view];
}
Hope this helps, feel free to ask if any queries...