Button size varies in iphone 4 and iphone 6 - ios

I have one project where there is one button.
Which seems so big in iphone 4 as per the size in iphone 4 resolution
and same button looks small in iphone6 as per the size of the iphone 6 resolution.
I had used autolayout.
But is there any solution to manage it by autolayout or constraint.
Instead of managing size i.e hieght and width programmatically ?

Give that button an equal width constraint with its super view.
Select that equal width constraint and give multiplier value as (width of button)/(width of superview)
then give aspect ratio to the button.
Now the width of button varies with the width of device and height will change in proportion with its width.
I use this method and it works good.

If you want to manage size of your button, with the ratio of iPhone/iPad screen,
First you need to set equal width and height constraint to your button in storyboard.
Then in code, you have to add two IBOutlet of NSLayoutConstraint and connect them to respective constraint in storyboard, then update yourButtonWidthConstrant.constant and yourButtonHeightConstrant.constant from code according to the ratio.

Related

Rescale UIImageView proprtionally in Launch Screen Storyboard

I have a UIImageView that needs to be centered and have a width that's equal to the screen width and some height that grows proportionally with the width. So for instance, for the iPhoneXR I have:
And on the iPad 9.7 it would be:
So basically the image just scales proportionally with each screen size. I have already figured out how to center it using constraints, but I'm lost on how to get it to scale proportionally. I've played around with the auto resizing options and constraints to no avail. I struggle so badly with these storyboards, wish I could just code it! Is this even possible in a LaunchScreen storyboard?
You can't execute any code inside launch screen. However, you can make it with constraints.
Set center equal to superview, then set width equal to superview. Now, you can add aspectRatio which is like 1:1, so you imageView height would always be equal to its width or any other ratio you want.
Example:
By adding proper constraint you will get your expected result. Add aspectRatio constraint to imageView.
All constraints as per
You can not give constraints to a view w.r.t viewController in LaunchScreen.storyboard because our view hierarchy has not loaded till that point of time.
You can give an imageView constraints w.r.t itself. CTRL drag on the imageView and select height, width or aspect ratio.
Though the recommended way will be to use another viewController that will work as LaunchScreen with some delay in segue.

Xcode how to make flexible constraint in Autolayout

hello everyone I've get stuck in Auto-layout issues
I have login storyboard that contains three Items Image-view , Stack-view , Button like the first image below
I've tried to add constraints using two ways:
The first way I've added "pinned" constraint to Image-view as shown in Photo1 below but when I've changed to landscape the Image was disappeared as the second photo below.
please notice I haven't got any warnings
The second Way I've tried by wrap the Image-view using view then i added
"Pinned" constraint to view
finally i added fixed width & height to Image-view and Horizontal & vertical in container but I've got this result as third and fourth photo
what should i do to make my Image-view Adaptive for all Screens ?
thanks
Photo1
Photo2
Photo3
Photo4
As when changing to landscape screen height changing a lot. the problem with your design with Autolayout is it's not adaptive with landscape and portrait mode because you are give fixed hight and width to your layout.
to make your image-view Adaptive for all screens give your image-view height to superview height in percentage so when in landscape mode height will change your image-view will still gets the height from superview height in exact same percentage.
have a look at this demo hope this will help.
Autolayout
First drop UIImageView into ViewController.
Give it a top constraint and Align it horizontally to it's SuperView.
As now it's only required height and width.
Then Ctrl drag from ImageView to itself and select aspect ratio. give
a aspect ration 1:1 (it's just telling storyboard if any of height or
width is available i want the other to be the same like if width is
given then height should be the same as width, vice versa for height) as you may want
perfect square shape for your profile ImageView.
Now Ctrl drag from ImageView to SuperView and select Equal height.
As now your ImageView got the height to SuperView Height.
give your ImageView proportional height (percentage, Aspect
Ration or Multipiler) to SuperView how much you wanted to give like
so.
At the end your UIImageView will get the height proportional to SuperView height, vice versa for width.

Is it possible to set width and height for different iPhone screens?

I'm working with my project on the storyboard and I have a problem with screen sizes. It looks simple to solve but not for me. I have an imageView, and its width and height are looking good for iPhone 7/7+ screens. But It is not looking good for 5 or SE Screens.
Can I set different width and height for 5 screens? for example, while 7 and 7 pluses run with 200 width and height, iPhone 5 screens will run with 100 width and height. Or is it possible to squeeze the imageView? When I set the constraints imageView it also needs width and height for looking well, but it prevents to squeeze the imageView as well.
If you want the imageView to squeeze, you shouldn't give it a static width or height in the constraits.
One way to go is to set the leading, trailing, top and bottom constraints for it ==> no need for a width or height constraints.
Another way is to give it a proportional width and height, and this can be done by giving the image view an equal width and equal height constraints to its parent view for example, and then set the multipliers of these constraints to some number, 0.5 for example, this way the image view will always take half of the parent view's width and half of its height.

Height of UIViews proportional to height of Screen (Auto Layout)

I would like to make the height of the UITextFields and one UIButton I have into my view proportional when the height of the screen changes. The default height of the textfields and uibutton is 55, but I realised that in iPhone 4, this height doesn't fit propertly the screen.
How would you approach this thing with Auto Layout?
iPhone 4.7 inch
iPhone 4.5 inch
Thanks!
I'm definitely not sure changing the height of textfields is the right approach to addressing your layout issues, but if you actually want to do so, it's as simple as creating an "Equal Height" constraint between your textfield and the view, and changing the multiplier so you get the value you want.

Proportional distance to top in autolayout and device rotation

I have an UIImageView in an iPAd Screen. The three Auto Constrains are
1) centered horizontally in the container
2) fixed width
3) fixed height
I have another constrain which tells the image view to be 100 points under the top of the screen.
If the device goes to landscape mode, I want to have this value 70 (the numbers 100 and 70 are imaginary, can be others, relations, proportions etc.)
What should I do for this without solving it programmatically, pure auto layout in the storyboard interface builder.
Thanks for helps.
Use the multiplier of a constraint, accessible by selecting the constraint in the XIB.

Resources