How to bring subview to front in interface builder without changing its position - ios

I want to ask a simple question how can I temporary bring a subview to front to view its element without changing its position by dragging and dropping. The problem i face all the time is i forgot to put the views back to there position and that causes lot of trouble specially if you are working on the view that have large number of subviews.
Question : Is there any shortcut or any functionality that can show the view temporary without dragging, changing its frame or making any changes in its hierarchy.
For a view controller like this :-

FYI, for those who are wondering, the view closest to the bottom of the list (on the left) will show in the front. So in the case below, view 'a' will be in front of 'b' and 'b' will be in front of 'c'
XIB:

If you need your views to be readily accessible for viewing/editing without having to rearrange them, I would actually recommend breaking them out into their own view and then stitching them together in the correct order in your code. This will ensure that all elements will be put in the proper order and will always be easily editable. Something like this:
And then in your code, in somewhere like viewDidLoad:
[self.view addSubview:view2];
[self.view addSubview:view3];

Related

Swapping UIViews in and out of a ViewController's view

I'm not entirely new to iOS/Swift development but I've mostly been working on "backend" code so my UI design/development skill level is unfortunately not what I'd like it to be. With that in mind, I have a UI layout (for a view controller) that looks something like this:
In this layout, the view labeled "View To Swap" could be in one of three states:
It may be hidden (or removed?) in which case StackView B should appear directly below StackView A
It may need to show (or be replaced by?) "Subview A"
It may need to show (or be replaced by?) "Subview B"
Both Subview A and B will have a button in the upper right hand corner that, when clicked, should remove/hide the "View To Swap" view.
I've been reading about container views a little bit and I'm wondering if this is the approach that I should take here or is there a more simple, direct way to implement this? I'm currently using the storyboard and autolayout to define my primary view (the view on the left) and constraints but I understand the basics of building a UI programatically if that makes it easier to implement something like this? Thanks for any suggestions!
You need to insert the 3 main views ( top stack , viewToSwap , bottom stack ) inside a vertical UIStackView with distribution = fillEqually , and hook viewToSwap as IBOutlet, whenever you want to hide it do
self.viewToSwap.isHidden = true
this will automatically collapse it's content , and you can add any subview to it (A/B) and don't forget self.viewToSwap.clipsToBounds = true

How do I make the elements in my UIView responsive?

My goal is to create an alert that has three text fields, one taller than the others, and an image that, when tapped, allows the user to choose a picture to replace a set default one.
After unsuccessfully searching for a library for this, I decided to create my own alert by placing a UIView off the screen and, when prompted by a button, would zoom onto the screen; it consists of all the elements I require.
When I run the application, the view pops up correctly, but none of the elements on the view are responding to touch. I've checked that isUserInteractionEnabled for everything is turned on.
What's also odd is that when I keep the view on the screen (instead of placing it some distance away on Storyboard), all the elements work fine.
I'm assuming it had something to do with the animation. I tested it with a fade in instead of a displacement, and the result was the same - the elements were unresponsive.
In order for your elements to be responsive you have to link the action of you clicking them to your view's code. You can do this in a non-programmatic manner by ctrl-clicking your element on story-views and then dragging to the view controller. Then choose action instead of outlet, and choose when the action you want will be triggered (bottom part). Then insert your code in the viewController.
So I figured it out. I used the debug view hierarchy and saw that the alert was behind the elements behind it, even though it was still being shown (for some reason). I changed the zIndex of the UIView and it worked!

How can I bring a view in front of another view, in Swift?

Below are how my views are organized in IB, top->bottom when the app is started.
The user can do something to make "Category Table View Header" temporarily expand over "Name View" - however once doing so, the .TouchDown action assigned to "Category Table View Header" no longer works wherever it overlaps with "Name View" (i.e., the user can tap the header anywhere it doesn't overlap with name view and it still works).
I know that may be confusing, so I drew out some boxes. On the left is the original, right is after user action - problem is on the right the action on the red box only works if the user taps the bottom half, not the top half.
My guess is its because the header is lower in the view hierarchy than the name view, but it would be hard for me to change that without messing around with a bunch of constraints.
I also tried setting nameView.hidden = true, but that doesn't work.
If you want to bring a subview to the front, you can use:
SWIFT 4 + UPDATE
self.view.bringSubviewToFront(yourView)
SWIFT 3 UPDATE
self.view.bringSubview(toFront: yourView)
Send view to back:-
SWIFT 4+ UPDATE
self.view.sendSubviewToBack(yourView)
SWIFT 3 UPDATE
self.view.sendSubview(toBack: yourView)
SWIFT 4+ UPDATE - INSERT VIEW ON SPECIFIC LOCATION IN THE STACK
parentView.insertSubview(yourView, belowSubview: requiredViewOnStack)
parentView.insertSubview(yourView, aboveSubview: requiredViewOnStack)
Swift 5.1+
UIKit draws views back to front, which means that views higher up the stack are drawn on top of those lower down. If you want to bring a subview to the front, there's a method just for you: bringSubviewToFront(). Here's an example:
parentView.bringSubviewToFront(childView)
This method can also be used to bring any subview to the front, even if you're not sure where it is:
childView.superview?.bringSubviewToFront(childView)
In Swift 5
To bring a subview to front
self.view.bringSubviewToFront(yourView)
To send a subview to back
self.view.sendSubviewToBack(yourView)
You can take a control over the order of subviews using methods: bringSubviewToFront and sendSubviewToBack from the superview.
You can access all the subviews contained by superview using self.view.subview array.
The method has been updated since swift 3
What has worked for me and hopefully for you is using :
YourView.bringSubview(toFront: yourelementA)
YourView.bringSubview(toFront: yourelementB)
Alternatively you could use the following to send the object that is in the front:
YourView.sendSubview(toBack: yourelementC)
I hope this helps
Swift 5.4
views in UIKit are drawn from the back towards the front (like adding icing onto a cake). This means that the new views will be placed on top/over the previously placed views. (e.g. Icing is the new view and the base of the cake being the old view.
You can use the following to manipulate the views Z-position using,
Forward
parent.bringSubviewToFront(child)
Backward
parent.sendSubviewToBack(child)
bringSubViewToFront did not work in my case, Take a look
As I wanted this notification count comes before image, bringSubViewToFront did not work, So I just drag this label below to stack view of my imgae and bottom label, it worked for me.
I hope this will work for all

+[UIView transitionFromView:toView:...] with multiple views

So here's the situation:
I have let's say 20 views who are all subviews of the same view. Now I want to remove and add new views in an animated matter.
I previously did this by using regular UIView animations and fading them out or in respectively. The problem is though that the animation isn't flawless when the new subview who is to be inserted overlaps with the subviews who are fading out. So I tried using the +[UIView transitionFromView:toView:...] animation block to make the animation cross dissolve. This works well, animation looks good.
This basically solves my issue. The only problem is that it might be that I want to replace 2 subviews with one bigger subview. This doesn't really work out as I can't just pas nil to the transition method.
So my question basically is how I can simultaneously cross dissolve multiple subviews no matter how many views are animated?
Thanks for your help!
Have you tried putting the views to remove inside a transparent bigger view? So you just call transitionFromViewToView using the container with the 2 little ones inside and the big one that is entering?
You can use + [UIView transitionWithView:duration:options:animations:completion:], passing the common superview (usually self.view of your view controller) to perform all animations at once.
Excerpt from the doc:
This method applies a transition to the specified view so that you can
make state changes to it. The block you specify in the animations
parameter contains whatever state changes you want to make. You can
use this block to add, remove, show, or hide subviews of the specified
view. If you want to incorporate other animatable changes, you must
include the UIViewAnimationOptionAllowAnimatedContent key in the
options parameter.

Bring previously added view to front

My problem is the following:
I have a view and to that view I add 3 subViews(view1,view2,view3) in that order. The views slightly overlap. I want to bring the first view to the top but I just can't get it to work.
I tried adding the views with insertSubview:atIndex: and giving view1 a larger index and I tried using addSubview: and then bringSubviewToTop but nothing seems to work.
Any ideas?
P.S. I can't add the views in a different order. They have to be added in this order.
bringSubviewToFront should work, just make sure you're using it correctly. The usage is.
[parentView bringSubviewToFront:view1];
You can try the method bringSubviewToFront:
Moves the specified subview so that it appears on top of its siblings.
- (void)bringSubviewToFront:(UIView *)view
Parameters
view: The subview to move to the front.

Resources