CODEWITHSUNDEEP
iosxcodeuiimageviewstoryboardconstraints
David P
David P

Reputation: 1043

Positioning Button over Image

I have a full screen ImageView (margins constraints) with an Image in "Aspect Fit Mode" and I need to have a button to be over a specific part of that image on all devices.

I have tried to put constraints in different ways, but without any good result.

I hope someone could help me.

Here you can find a screenshot of what I want:

https://www.dropbox.com/s/krl5rp47w2rxl0g/Schermata%202015-09-12%20alle%2015.15.43.png?dl=0

The yellow block is the button and I want it to be over the shoulder for any screen size.

This is iOS 8.

Upvotes: 3

Views: 4913

Answers (3)

Omid Abutorab
Omid Abutorab

Reputation: 43

just have to add center vertically & center horizontally and equal height and equal width to image and then play with multipliers to make it where you want.

Upvotes: 0

Ishai
Ishai

Reputation: 165

If both element on the same view, just drag the button bellow the image in the View Controller Scene, and you are done.enter image description here

Upvotes: 1

Irfan
Irfan

Reputation: 5130

Try proportional Constraints. Add the following 4 constraints to your button (values are not exact)

  1. Give your button a proportional width constraint with ImageView. So button width will become 10% of ImageView width for example.
  2. Give your button a proportional height constraint with ImageView. So button height will become 10% of ImageView height for example.
  3. Now center y of button is 40% of center y of ImageView(value is approx.) Try different value to get your goal
  4. Now center x of button is 80% of center x of ImageView.

Apple recommend using proportional constraints. Try to change the percent values slightly to fit the button on shoulder. Once you fit the button on shoulder with these constraints It will look fine on all device . Thanks

Upvotes: 5

Related Questions