I am writing the application "Calculator". Set the size of the buttons for a 3.5 inch screen. I want to make a software "stretching" of the sizes to proportions 4, 4.7 and 5.5 inches. Everything works as it should when pressing the Button button, but when the screen is rebuilt (drawing numbers in the text field), the dimensions return to their original size.

How to "fix" the scaling occurred?

Also I can not understand how to make the resizing happen when the application starts. On the image above, the buttons should stretch and close the empty space on the right of the 4in screen.

target screen

class ViewController: UIViewController { @IBOutlet weak var Label1: UILabel! @IBOutlet var BTN: [UIButton]! override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } @IBAction func But(sender: AnyObject) { let screenSize: CGRect = UIScreen.mainScreen().bounds let scaleX = screenSize.width / 480 let scaleY = screenSize.height / 320 if scaleX == 1 && scaleY == 1 { return } for btn in BTN { btn.frame.origin.x *= scaleX btn.frame.origin.y *= scaleY btn.frame.size.height *= scaleY btn.frame.size.width *= scaleX } } 
  • If you want to align 2-3 elements - everything works fine and with the layout. I also have a lot of buttons of various sizes (service, also "zero" was twice as wide). When using alignments and bindings, the sizes of objects will change, but I would like to leave everything in its original form. - Alex
  • Use Size Classes: habrahabr.ru/post/235181 - Vitali Eller
  • The Size Class has only two options, 3.5, 4.0, 4.7 and 5.5 inches. And here it turns out that there should be 4 options each with their own alignment settings and element sizes. I understand, of course, that everyone started with such calculators. Maybe someone will post their source with an example of placing a large number of elements of different sizes? - Alex
  • @Alex in the example screen they are all the same. And what does it mean to keep it as it is? In any case, on different screens will be different. - VAndrJ

1 answer 1

Quickly sketched an example in IB.

Sources: https://github.com/VAndrJ/CalcExampleForSO

Brief instruction (I do not pretend that everything is correct, and it’s not a master to explain):

  1. Add the first item (result output) to View
  2. We place the Constraints: indents at the top, right and left.
  3. Add a third row of elements, set indents horizontally, for the first element we indent above the first row. All others are centered on the first. enter image description here
  4. Copy this row and paste it 3 times.
  5. Add the necessary padding vertically and from the borders.
  6. We arrange for the first elements enter image description here
  7. All elements of the series are leveled with respect to the first enter image description here
  8. For service (which is necessary) set the multiplier: enter image description here
  9. The result is the same on all devices:

enter image description here enter image description here

  • VAndrJ, thanks! Understood with scaling, everything is really simple and nothing needs to be done through the code - Alex