I'm trying to organize a complex xib into multiple view.
Suppose the following scenario:
I have the main view (the green one) that contains two subviews (the red and the yellow ones).
Actually I can create three xib and add the subviews programmatically.
I found a solution a bit smarter: I define two IBOutlet in the main view (green) and connect them to the subviews.
#property (nonatomic, weak) IBOutlet RedView * redView;
#property (nonatomic, weak) IBOutlet YellowView * yellowView;
In the main view implementation, programmatically, I add the subviews:
- (void)awakeFromNib
{
[super awakeFromNib];
self.redView.frame = self.frame;
self.redView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
self.yellowView.frame = self.frame;
self.yellowView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
[self addSubview:self.redView];
[self addSubview:self.yellowView];
}
As you can see, I need to set the current frame size, the autoresizingMask and add the subViews to the parent.
The question:
is there a nice way to perform these operations directly from the xib?
I want to load the xib ("loadNibNamed") and obtain the main view (green) already filled with the subviews.
I've tried some solutions but neither works...
edit:
I don't want to add the red and yellow view as subviews directly in IB.
The two subviews are as big as the parent and this make complex to work with Interface Builder (hide the yellow view and work on the red, then hide the red and work on the yellow...).
I'd like to have separate views in the same xib but being able to "compose" them in parent-child tree...
Instead of creating the red and yellow views by dragging a view into the open space. Drag the view onto the green view. It will then be added as a subview.
You can move your existing views only by using the list on the left. Drag the row in the list that corresponds to the red view onto the row in the list that is the green view.
Related
Can somebody tell me why none of the buttons under the "License Agreement View" UIView object in my .xib file are triggering an action? It seems that the Scrollview object is messing up the behavior. When the buttons are directly under the "Scroll View" object (as opposed to the "License Agreement View" UIView object), then they function properly. But, I need to group my buttons under the UIViews as shown in the view hierarchy below.
Here's the view layout:
Here's my view hierarchy:
Here's the corresponding .m file:
#interface MYViewController ()
- (IBAction)licenseAgreementPressed:(id)sender;
- (IBAction)legalDisclaimerPressed:(id)sender;
- (IBAction)privacyStatementPressed:(id)sender;
#property (strong, nonatomic) IBOutlet UIView *licenseAgreementView;
#property (weak, nonatomic) IBOutlet UIButton *legalDisclaimerButton;
#property (strong, nonatomic) IBOutlet UIButton *privacyStatementButton;
#end
#implementation MYViewController
- (IBAction)licenseAgreementPressed:(id)sender
{
NSLog(#"Pressed A");
}
- (IBAction)legalDisclaimerPressed:(id)sender
{
NSLog(#"Pressed B");
}
- (IBAction)privacyStatementPressed:(id)sender
{
NSLog(#"Pressed C");
}
#end
Make sure you have made connection between IBAction(code) and UIButton(in xib) , please check this post How do I name and link an IBAction button created in a storyboard
Did you connect your actions to the elements in interface builder by control-dragging it?
If your actions are connected you will see a little filled out circle on the left of the line in your editor.
Check this tutorial for further information on how to connect your storyboard elements to your code.
It is because none of the buttons are inside the bounds of the license agreement view. A button outside its superview's bounds is untappable.
So the problem was the links, buttons, and text fields were not actually located within the bounds specified the parent views because the original .xib file didn't have the required constraints pinned to those elements. I discovered this by checking the "clip to bounds" checkbox in the Attributes Inspector pane. Whenever "clip to bounds" was checked, the app was NOT displaying any of the above view objects; I could only see links, buttons, and text fields when "clip to bounds" was unchecked but unfortunately, those elements were not clickable at that point. After setting the necessary constraints, however, the view elements were correctly placed within the bounds of their parent views and the text fields, labels, and buttons became clickable. I'm attaching the constraints that I used to fix the problem. Note: the constraints that are not expanded only include a height constraint.
I had an UIViewControllerA created with xib for view reusability.
In the xib I simply added another red view to it and set its constraints to top,leading,trailing, and bottom space to red view's superview (which is my A's view).
Add A to another UIViewController B as B's ChildViewController by doing so:
// UIViewControllerB.m
UIViewControllerA *A = [UIViewControllerA alloc] initWithNibName:#"UIViewControllerA" bundle: nil]];
[A.view setFrame:CGRectMake(0,0, self.view.size.width, self.view.size.height/2)];
[self addChildViewController:A];
[self.view addSubview:A.view];
[self.A didMoveToParentViewController:self];
Nothing red or whatever showed up.
I did try [self.A.view setTranslatesAutoresizingMaskIntoConstraints:NO]; though
that seemed to make my constraints useless and actually did not bring up the red view.
Do I have to code the whole thing (UI elements & constraints creation) when I'm working with xib and need some extra view with autolayout?
Thanks for any advice!
The problem is this line:
[A.view setFrame:CGRectMake(0,0, self.view.size.width, self.view.size.height/2)];
Instead, give this view constraints.
When you insert a set of views that uses autolayout into a set of views that uses autolayout, you must use autolayout to position it.
I am using Storyboards with autolayout where I have a viewcontroller full of views, buttons, labels, a table...
I want to create a new View at the top of this view, below the navigationbar, when a button is clicked, and hide it after clicking again over it.
I want to do this programatically. This means that this view will appear at the top and the rest of the views will have to move down the height of that new view. When this view disappears the views will move up again.
What'd be the best approach to do this? I've tried to create a view in the storyboard with height = 0 and change the height in code. Is there a better way for this?
Hi as you are using auto layout I would suggest taking an IBOutlet for the height constraint of the view that you want to put below the navigation bar and change it in code
Here is a sample
//IBOutlet for height constraint of view
#property (weak, nonatomic) IBOutlet NSLayoutConstraint *conHeightTopView;
- (void)changeHeight:(BOOL)change{
if (change) {
_conHeightTopView.constant = 50;//Height of view when shown
}else{
_conHeightTopView.constant = 0;
}
}
All the views that need to be moved down should be put in one UIView. And your code should have an IBOutlet for this view.
When you create your new view programmatically, you will know it's height.
Now you can call setFrame of your first view and move it down.
I have a view with some UI components and a button on it, upon touch of a button I want to show a half view with some textfields on it overlapping the initial view, the initial view should be visible partly , the overlapping view will cover only half screen from bottom. Is this possible ?
I don't have any code as I am unable to figure out what it needs to be done, as we show any view it covers the entire screen.
Thanks
there are several ways you can do this, here are two:
1) add a popover controller that gets displayed on your button press:
here's some apple documentation on popovers: https://developer.apple.com/Library/ios/documentation/WindowsViews/Conceptual/ViewControllerCatalog/Chapters/Popovers.html
2) add the new view as a subview to your UIViewController
PROGRAMICALLY:
in the viewDidLoad function you can do the following to initialize the halfScreenView
GLfloat topOffset = self.view.frame.size.height/2;
UIView halfScreenView = [[UIView alloc] initWithFrame: CGRectMake(0, topOffset , [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height - topOffset)
[self.view addSubview:halfScreenView];
-more logic might be needed if you support Landscape orientation, you can always re-assign the location of the view with halfScreenView.frame.origin and halfScreenView.frame.size
-initially you can have this view be hidden
halfScreenView.hidden = YES;
-when you click the button it will show the overlaying view:
halfScreenView.hidden = NO;
USING STORYBOARD:
you can also set up your overlaying view in the storyboard if you have one
-drag a UIView into your UIViewController and set it up where you want it to be located
-initialize the view to be hidden by checking the hidden box in the attribute inspector
-add the view as a property to your view
-manage when to show this view with self.halfScreenView.hidden
-this technique allows you to customize what is inside the new view within the storyboard which is nice
FOR BOTH:
-be careful with layers, you don't want your view to show up behind the one you already present. In the storyboard the last thing inserted goes on top. With in the code you can always access/change the views z position with halfScreenView.layer.zPosition (higher z values are on top)
First create a new class subclassing UIViewController called SecondView (or whatever you want), then design the UI the way you want (in its .xib file)
Then go to your main view controller's file and make an IBAction for that button.
In that method, write:
SecondView* second = [[SecondView alloc] initWithFrame:CGRectMake(0, [[UIScreen mainScreen] bounds].size.height/2, height, width);
[self.view addSubview:second.view];
This will add it to the bottom half of the screen. Put your own parameters for its height and width. When you want to dismiss the view, you can do this inside your SecondView class
[self.view removeFromSuperview];
You can deal with the textFields from within the SecondView class and have them communicate with your other view by doing the following in SecondView.h
#property IBOutlet UITextField* textField;
Hope this helps!
Yes, assuming you are using Interface Builder, go ahead and build the overlapping view and hook up all of the IBOutlets and IBActions. Say this view is called myView. Set myView.hidden = YES and myView.enabled = NO. This hides and disables myView so that it isn't even there from the user's perspective. In the appropriate button's IBAction, change the hidden and enabled properties to YES. That will make the view visible and active again.
I've created a UIView programmatically that embeds several UIControls (UIButtons, UISwitchs and UILabels mainly). I set in the -(id)initWithFrame: of this class the background color.
I have created a message to add the UIControls in the view in order to put inside of my custom view. It's something like that:
-(void) CreateGuiObjects
{
UIView *container = self;
//create uiswitch
mOnOffSwitch = [[UISwitch alloc] initWithFrame:CGRectMake(10, 20, 0, 0)];
mOnOffSwitch.translatesAutoresizingMaskIntoConstraints = NO; //used for constraint testing
//add parent view (self)
[container addSubview: mOnOffSwitch];
/*
other stuff like above
*/
}
then in my view controller there is an event handler for an external button; the action is to add the above custom view in an empty UIView created with Storyboard Interface Builder in Xcode.
the code is like the following:
-(void)CreateButton
{
MyCustomView *view = [MyCustomView alloc] initWithFrame:CGRectMake(20,20,300,200)];
[self.view addSubview: view];
//now call my create method
[view CreateGuiObjects];
}
now, the problem is that it draws the controls, but it seems to position them in a different place...i set the frame origin for the container view in (20,20) and then put the switch in (10,20) where this point is relative to the custom view origin. Instead of that position the view seem to be far away from that position and the second problem is that the background color (gray) set in the initWithFrame is totally ignored.
If i remove every call to addSubview inside the CreateGuiObjects, it draws the empty view with the correct background color and in the correct position.
Edit:
if remove `mOnOffSwitch.translatesAutoresizingMaskIntoConstraints = NO; it works fine...but if i put again it doesn't work. Need to understand deeply the meaning of this property.
Could someone can help me? i think it is a silly question but i'm new to iOS development :(
thanks in advice
Method translatesAutoresizingMaskIntoConstraints = YES means that the UIView is using Auto Layout.
The fundamental building block in Auto Layout is the constraint.
Constraints express rules for the layout of elements in your
interface; for example, you can create a constraint that specifies an
element’s width, or its horizontal distance from another element. You
add and remove constraints, or change the properties of constraints,
to affect the layout of your interface.
When calculating the runtime positions of elements in a user
interface, the Auto Layout system considers all constraints at the
same time, and sets positions in such a way that best satisfies all of
the constraints.
read more about Auto Layout Concepts
If you don't know how to use Auto Layout I would recommend you to turn it off.