I have a UIDatePicker in my view with certain constraints on it. When looking at the iPhone 5/5s and 6, it looks fine. However, on the 4s and 6+, the minimum and maximum height of the datepicker destroys my layout. Is there any way of overriding these min/max values, or do you have any other suggestions for taking care of these situations?
Here's the constraints I have on the datepicker:
Align Center X to Superview
1:1 ratio
Bottom Space to View Equals: 33
Top Space to Label Equals: 5
Here's (my guess at) what happens:
When the DatePicker is placed on the screen, it tries to satisfy the top & bottom constraints. Then it sets the width to match the height. However, on the iPhone 6+, this height is too large, and it shrinks it to a maximum height. This creates large gaps in my design. On the 4s, it does the opposite: The height is too small, so it increases it. The DatePicker then overlaps my Label, and the space to the bottom View is too small. In both cases, the DatePicker ends up being not a square (!= 1:1).
Does anyone know if I can override these max/min values, or what I can do make sure it keeps its 1:1 ratio? And then fix the layout issues by shrinking the 33p bottom space constraint, but not the 5p top space constraint?
I managed to solve this by simply wrapping the UIDatePicker in a separate UIView with the same constraints, and then setting Clips subviews to YES.
Seems to be the only way of making the UIDatePicker a custom size, as it has certain bounds it conforms to.
Related
I have a imageview at the start and below there are series of buttons placed vertically one below the other. So, while designing the screen, I placed all the views in the view controller and added to vertical stack. Centred stack view horizontally and vertically. For all the buttons, I have set equal width. And in stack view, I have given equal spacing. In all iPhones, it is working correctly with ui elements arranged correctly with equal spaces except iPhone4. In iPhone 4 it is all touching each other. Please find the attachment. What constraint am I missing here?
The problem is the content cannot be fitted in given height.
Let me explain.
Assume small device has height of 480. UIImageView height(intrinsic ) is say 200. You have 4 UIButton of height say 80. UILabel of height say 100. So that sums up to 620.
Views of height 620 cannot fit(all visible without clipping) on a view of height 480.
You need.
Scrollview(To show more content than the available width and/or height)
Reduce the size of you content to fit in 480. To do this you can pin the height of any/some/all to make this height sum less than or equal to 480.
It's because the screen size for iPhone 4 is 480. Your UI seems to be higher than 480. So only the constraints adjusted according to screen height.
Just add height constraint to all button and remove height constraint for image view if added.
Add Height and margin constraints for Buttons and only margin constraints to image view. It will resize according to screen size.
Hope it helps.
Basically I have one view with some height x
and 4 other views with same height y all these 5 views are vertically one after another with 10 px space
all these views have again some child views which depends on them.
For this scenario stackview is ideal but it support starts from iOS 9 unfortunately I have to support from iOS 6
so basically I fixed all the views with leading,trailing,top,bottom and height constraint...
it works good in iPhone 7s ... but in iphone 4s the view gets overlapped on each other
in iphone se the views are very much congested..
I was always thinking the height will change according to the screen size for iPHone 4s but that didn't happen
How can I work this out ?
There are two ways to solve the problem you are facing.
First:
Instead of giving a fixed height to any of your UIView you can use a proportional height constraint. Select your UIView and control + drag from your UIView to the main superview. Select equal height constraint. Now, double click the height constraint and set the multiplier to 0.15 or any value you seem nice. This will ensure the view thus created is always 0.15 times the entire view's height. Now you can create your other views either proportional to this view following the same steps or to the superview.
Second:
(I prefer this approach as for items as sometimes you need to create forms the above approach might still push elements off the screen).
This will use a UIScrollView. To your main view add a UIScrollView and add a leading, trailing, top and bottom constraint to your superview. Add a UIView to this UIScrollView and give it a leading, trailing, top and bottom as well. Additionally give it a equal height and width constraints to the superview of the UIScrollView with a low priority of like say 250. Now add all your elements inside this UIView however you seem fit. With fixed height, proportional height whatever and happily run it. But ensure you add a bottom of >= a minimum value for your bottom most view.
The screen will automatically become scrollable if the content will go off screen otherwise it won't be scrollable at all.
fixed all the views with leading,trailing,top,bottom and equal height constraint instead of only height(not give fixed height to any view)
I am using auto layout for my ViewController I know how to define the gap between two views using constraints programmatically. What I want to do now is when the screen size increase, increase the gap also. Because my UIViewsare positioned properly in iphone 4s and 5s but in 6 and 6 plus they are positioned in a small area of the screen. I know adding multiplier we can set the aspect ratio of a view but, how to increase the gap between 2 views when the screen hight increase.
UPDATE
Let say this image,, there is a logo above this please login label.
This is my verticle position constraint
V:|-70-[Title]-130-[lblFirst]-0-[lblSecond]-20-[textusername]-10-[txtpassword]-10-[btnLogin]
this Title is an image 130pix above to this Please Login label. I want to increase this 130 when it comes to iphone 6 and 6 plus
Take a UIView with alpha 0 and clear color and use it instead of the gap and use aspect ratio to the view used for gap and top and bottom or left and right whatever your situation to the views between whom you want to make the gap dynamic. And also you need to add some more alignment constraints to the gapView but it will work. I could not found any other method to do this easily so i have used this method everywhere in all projects and all working fine. I think UIView with clear color and alpha 0 will not effect the screen or performance in any way. We can use this.
Here is an example like if you have two text fields vertically and you want to increase the gap between them dynamically then take a view between then with the exact same width of text field and add those constraints.
1) Top of GapView to upper text field.
2) Bottom of GapView to below text field.
3) Equal width to any text field or leading and trailing to superview or main view.
4) Proportional Height to main view(you can add this constraint by adding equal height from subview to any of superview and then by changing the multiplier);
And your GapView will increase and decrease accordingly.
I'm using autolayout and my UILabel doesn't seem to get bigger when the app is opened on the iphone 6 and 6+. I have the following constraints on the label:
-Vertical spacing to top layout guide
-Vertical spacing to image below label
-Center horizontally in container
I also tried setting an aspect ratio constraint to itself and then a equal widths constraint with the parent view (with multiplier ratio) so that when the width of the parent view expands so would the label but no luck.
Are there settings that I should be implementing to allow this to happen? I thought labels have intrinsic sizing so they would get larger on their own as the parent view grows.
No, they have intrinsic sizing so they would get larger as their content grows (i.e. how much text they contain). That is what intrinsic sizing means. It means that the size is intrinsic.
Also, resizing a label physically (e.g. making it taller and wider) changes the size of the label. This will be evident if your label has a distinct colored background, for instance. It has no direct effect whatever, though, on the size of its text's font.
I want to use AutoLayout to position controls with proportional vertical spacing between them (avoid cropping on a 3.5" screen, avoid blank bottom space on a 4" screen).
As suggested in other answers, I can use spacer views with "Equal Height" constraints, changing multiplier where necessary. However, the final layout is not pixel-perfect, so the engine can't position them consistently.
The symptoms:
When I do an "Update All Frames" in IB, it doesn't fix misplaced views, but merely replaces them with other set of misplaced views.
More importantly, at run time, I can see the controls momentarily jump a few pixels up or down, whenever I enter the view.
How to I achieve the same consistent layout every time?
Set Height constraints for the the controls which you want to place on the screen vertically
Create outlets for the height constraints.
For 3.5 inch and 4 inch screen, change the value of height constraints' constant.
If changing the height doesn't solve the purpose, create Vertical Space Constraints and set their values accordingly.