What is the effect of having a UIView act as a child of another UIView in the scoreboard?
Using AVCam as an example, in the storyboard of the project, the components are layered out as following:
Observe that the 3 Button components act as children of “Cam Preview View”.
I’ve made an experiment and managed to get them to be children of “View”. This does not break any UIButton outlet functionality that I’ve managed to notice.
This is a design time choice by the developer. This changes how the controls can be moved by the constraints or other layout controls like springs and strut). Moving them around will not break any wired outlets however can introduce logical errors.
That said it's possible that there is no significant effect for this demo code.
In the first image you posted, those buttons are added as subviews of the Cam Preview View. It is the same as saying
[camPreviewView addSubview:button];
In the second image instead of the buttons subviews of the Cam Preview View, they are subviews of the View at the top of the hierarchy.
This is a design choice made by the developer. Clearly s/he wanted a view with three buttons contained inside as subviews. That way, you can move the Camera Preview View around and the buttons stay in their relative locations within the view.
Related
I don't like being limited by the built-in screen navigation and storyboards are severely limited so I use this "core window" model I came up with long ago, where one window acts as a foundation. I load another view controller but load a nested UIView inside the main view, I call this the core and animate it over everything but the controls I want to remain onscreen, e.g. status bar and tab bar.
In the past I avoided auto layout because there were only two screen sizes, I just created one resource for each one. Now there are at least four and avoiding auto layout isn't an option. But when I do my nested view trick in XCode with auto layout turned on I can't see the controls in the nested UIView, infuriating, and the interface builder is very limited with AutoLayout.
Changing transparency, Z order, removing size classes, no joy. It's only putting the controls in the nested UIView back in the main view that makes them visible.
I can get around this by scrapping the nested view and making the view controller's main view free form, then coding the controls that AutoLayout doesn't handle well after viewDidlayoutSubviews is called. This works.
But I would really like to know why controls in nested UIViews are invisible in IB. They weren't before.
Edit: the loaded nested UIView does work at runtime.
I designed about 40 view controllers using a 5.5 inch storyboard layout. After all of that I tested it on the iPhone 4S...big mistake. everything is jumbled together being for a larger screen size. I was able to fix one view controller up using Size Classes. I am wondering if there is any way I can adjust all 40 at the same time, or at least avoid doing this for every single one. It is really frustrating finding this out now. Thanks!
This is a relatively complicated issue you are attempting to solve, but I have two potential solutions. Both suggestions are based on moving your current interface into containing UIScrollView instances
If you are using storyboards, then for each of your view controller scenes, put a UIScrollView as a descendent of the view controller's view. From there, provided your subviews are contained within other views (like a container view for a set of buttons), you can move those into your scroll view. You will have to setup constraints to define the size of the scroll view's content, but this will allow the size of the device to have a smaller impact on the interface as you will get scrolling as needed.
If you are using nib files (.xib) then it is essentially the same thing, but easier. In this case, move a UIScrollView onto the canvas, but not as a subview of the default view. Once that is out there, move the original view to be a subview of the scroll view and set constraints to be 0 from the subview to the scroll view. Finally, right click drag from the File's Owner icon to the scroll view and set that as the view outlet.
Hopefully one of these will help you.
I made an app that has a lot of content on its view (images, buttons, text labels, etc.) and is optimized for the iPhone 5 display. However, the part of the view that is missing when viewed on an iPhone 4 screen is just additional settings, and is perfectly acceptable to be hidden until scrolled to.
So, how do I made my entire view scrollable for iPhone 4 users? I tried just dragging and dropping a UIScrollVIew object over the top of the whole view, but it doesn't add scrolling capability.
I have worked with UIScrollView before, but it was always something I added to the view before anything else, and don't know how to go about adding it to my view now that there are already bunches of objects. Hopefully there is some easy solution that doesn't require manually addig every object as a subView, etc.
Thanks for the suggestions!
I don't know how your views are created, but the easiest thing would be to change the class of the main view from UIView to UIScrollView.
From the InterfaceBuilder you can select all your content views (images, buttons, text labels, etc.) and then select Editor > Embed in > ScrollView.
This will create a UIScrollView containing al the views selected.
WARNING: you will lose all constraints between these subviews and the superview or the layout margin. Relative constraints (from subview to subview) will remain.
This approach is very useful when you wan to make only some content scrollable.
Let's say that I have a xib with a stack of UIViews on top of each other:
The bottom UIView(A) with a UIButton on it and when the button is pressed,
this layer is hidden and the next one is shown and put on top.
The next UIView(B) contains a clock counting down from 5 to 0
and when 0 is reached this UIView is hidden and the one described above is
moved to front and shown instead.
So just to make it more clear:
the composition of the xib:
A B
--Z direction-->
update: screenshot attached at the bottom of page.
So to my problem:
When (re)positioning the button or the clock using mouse in Xcode they tend to stick to the wrong
UIView. The more the Objects and "stacked" UIViews the greater the problem.
The Question:
Is there any way to, as with the layer "eye" in photoshop, isolate the UIViews and work on them one by one?
Observe!
I am aware that there are o there ways of achieving this swapping between view BUT this is not the issue. The real problem here is to actually position the button and the clock in the Xcode wysiwyg editor with the least hassle.
Observe!
-------- Added for clarification --------
Screenshot
I would like to isolate the views visually so when working on one of them, all the others are hidden and not open for interaction.
You can drag the second view (B) out of the main view hierarchy and place it below it (on the same level of the main view). That way you'll be able to edit each view separately.
Then you connect that view (B) to an outlet in your viewcontoller inorder to be able to add it to your main view during runtime...just set the frame and add it as a sub view.
I have an existing view with several elements, I was thinking of how to include a scrollview to contain all the existing elements without having to go through redesigning one by one the elements,
My objective is, that when my orientation changes to landscape, the elements behind can be scrollable specially when a keyboard is currently displayed.
Can this be done manually or programmatically, and how? Or is there any best approach for this type of scenario's?
*Edit (for clarity)
My apologies for the lack of clarity with the initial question;
I have a view with 3 Textfield, A button and 2 switch, Initially my app only supported the "Portrait" orientation, however, recently I have decided to add "Landscape" orientation support, I already did this. Now my problem is when I'm on landscape the view elements gets covered by the keyboard (specifically). So I was thinking if I could include a scrollview and put the views existing elements(objects) without having to re-design the nib, what I have done already;
I drag a scrollview into the view then making all the existing elements as children of the scrollview so the hierarchy looks like;
--view
--scrollview
--textfield
--button
The end product I get with this approach is that all the elements stacks on top of the other, so I've lost my original design.
So this is what Im asking, is there anyway, to add a scrollview without having to go through the design phase again.
TIA
If your view is designed in a nib, from IB you can select all the elements of the view and then go to Editor->Embed in->Scroll View from the menu.
Following are the steps-
1.Add the scrollview to the main view as subview.
2.create a new view which contains all your elements for the scrollview.
3.add the new view to the scrollview as subview.
4.set the content size of the scrollview as the size of the new view.
Change the frame of the newView accordingly on orientation and repeat step 4.
Thats all you need to do..