How to constrain an object to full screen - swift

I want to know how to code an imageview to the full screen programmatically. Right now I know how to code an object to a specific size and position programmatically but I want to know how to get this object in the full screen no matter what device is being used.
FIRE.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
FIRE.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
FIRE.widthAnchor.constraint(equalToConstant: 400).isActive = true
FIRE.heightAnchor.constraint(equalToConstant: 700).isActive = true
FIRE.translatesAutoresizingMaskIntoConstraints = false

I'm assuming your object is FIRE and the parent view is view. You can do it with constraints as follows.
FIRE.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
FIRE.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0).isActive = true
FIRE.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0).isActive = true
FIRE.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 0).isActive = true
FIRE.translatesAutoresizingMaskIntoConstraints = false
Or you could do it using the auto-resizing mask
FIRE.frame = view.bounds
FIRE.autoresizingMask = [.flexibleWidth, .flexibleHeight]

Goal is to set leading, trailing, top and bottom constraints of your UIView equal to leading, trailing, top and bottom constraints of its superview
FIRE.translatesAutoresizingMaskIntoConstraints = false
FIRE.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0).isActive = true
FIRE.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 0).isActive = true
FIRE.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
FIRE.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0).isActive = true

Related

Creating scrollview with 20 labels with programmatically in Swift

I am pretty new in Programming Swift so I am trying to achieve a scrollable task includes 20 labels inside. I made it with storyboard but programmatically I failed..
Thanks in advance, a green view background and 20 labels orange. Can anyone show me how ?
So i am not very fond of advertising, but raywenderlich has an awesome tutorial on how to do this. It is quite easy, but it comes down to a scrollable view and a tableview with navigation links.
https://www.raywenderlich.com/5662524-your-second-ios-and-swiftui-app
Again, i am not advertising, just sharing some videos that really helped me understand Swift!
And for answering your question:
Use
Scrollview { put here your to-do code
} end of body
There is your scrollable view with all the labels!
Below code will print your label 20 times with scrollview.
import UIKit
class ViewController: UIViewController {
let scrollView = UIScrollView()
var a = 0
var COnstant: CGFloat = 20
override func viewDidLoad() {
super.viewDidLoad()
scrollView.translatesAutoresizingMaskIntoConstraints = false
scrollView.backgroundColor = .green
self.view.addSubview(scrollView)
scrollView.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 0).isActive = true
scrollView.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
scrollView.rightAnchor.constraint(equalTo: view.rightAnchor, constant: 0).isActive = true
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0).isActive = true
while a<20 {
let label = UILabel()
label.backgroundColor = .orange
label.translatesAutoresizingMaskIntoConstraints = false
label.textColor = .black
label.text = "I'm label \(a)"
label.textAlignment = .center
scrollView.addSubview(label)
label.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 0).isActive = true
label.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor, constant: 0).isActive = true
label.widthAnchor.constraint(equalTo: scrollView.widthAnchor, constant: 0).isActive = true
label.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: COnstant).isActive = true
COnstant += 40
a = a+1
if a >= 20 { // if bottomanchor is not set then our scroll view doesnot work
label.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor, constant: 0).isActive = true
}
}
}
}

Button Autolayout programmatically?

Hey guys I want to position my Button at the lower part of the Screen but I don't get the correct code. The button is too small, too big, at the right or left corner,... but It should be centred in the middle of the lower screen.
I tried it with these codes:
nextButton.translatesAutoresizingMaskIntoConstraints = false
nextButton.centerXAnchor.constraint(equalTo: view.centerXAnchor)
nextButton.centerYAnchor.constraint(equalTo: view.centerYAnchor)
nextButton.widthAnchor.constraint(equalTo: view.widthAnchor, constant: 97)
nextButton.heightAnchor.constraint(equalTo: view.heightAnchor, constant: 50)
or
backButton.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 20).isActive = true
backButton.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -20).isActive = true
backButton.heightAnchor.constraint(equalToConstant: 50).isActive = true
backButton.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
Can someone tell me what to do to make it work? I thought with the topAnchor it would be really easy:(
This will position it in bottom center of screen
nextButton.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
nextButton.centerXAnchor.constraint(equalTo: view.centerXAnchor),
nextButton.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant:-20),
nextButton.widthAnchor.constraint(equalToConstant: 50),
nextButton.heightAnchor.constraint(equalToConstant: 50)
])
The problem is that you are using centerYAnchor instead of bottomAnchor
Replace
nextButton.centerYAnchor.constraint(equalTo: view.centerYAnchor)
with
let spacingConstant = 10.0
nextButton.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -spacingConstant)

How to add a view an centered between and under two other views by constraint programmatically? Swift

How can I add bestChoiceImage in center of the distance under ratingLabel and rateButton?
Why, when I'm using print(anysubview.center.x) is it = 0.0, but in Simulator everything staying in its place?
/activate inside viewWillappear
let viewHeight = self.view.frame.height
let viewWidth = self.view.frame.width
NSLayoutConstraint.activate([
reebokClassic.topAnchor.constraint(equalTo: self.view.topAnchor, constant: viewHeight/12),
reebokClassic.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
modelName.topAnchor.constraint(equalTo: reebokClassic.bottomAnchor, constant: viewHeight/100),
modelName.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
sneakersImage.topAnchor.constraint(equalTo: modelName.bottomAnchor, constant: viewHeight/40),
sneakersImage.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
sneakersImage.widthAnchor.constraint(equalToConstant: viewWidth * 0.8),
sneakersImage.heightAnchor.constraint(equalToConstant: viewWidth * 0.8),
segmentedController.widthAnchor.constraint(equalToConstant: viewWidth),
segmentedController.topAnchor.constraint(equalTo: sneakersImage.bottomAnchor, constant: viewHeight/80),
segmentedController.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
segmentedController.heightAnchor.constraint(equalToConstant: viewHeight/23),
lastTimeWeared.topAnchor.constraint(equalTo: segmentedController.bottomAnchor, constant: viewHeight/40),
lastTimeWeared.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: viewHeight/100),
lastTimeWeared.widthAnchor.constraint(equalToConstant: viewWidth/3),
ratingLabel.topAnchor.constraint(equalTo: segmentedController.bottomAnchor, constant: viewHeight/40),
ratingLabel.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: -viewHeight/50),
ratingLabel.widthAnchor.constraint(equalToConstant: viewWidth/3),
slipOnButton.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant: -viewHeight/20),
slipOnButton.trailingAnchor.constraint(equalTo: self.view.trailingAnchor, constant: -viewWidth/20),
slipOnButton.widthAnchor.constraint(equalToConstant: viewWidth/5),
slipOnButton.heightAnchor.constraint(equalToConstant: viewHeight/20),
rateButton.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant: -viewHeight/20),
rateButton.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: viewWidth/20),
rateButton.widthAnchor.constraint(equalToConstant: viewWidth/5),
rateButton.heightAnchor.constraint(equalToConstant: viewHeight/20),
bestChoiceImage.widthAnchor.constraint(equalToConstant: viewWidth/3),
bestChoiceImage.heightAnchor.constraint(equalToConstant: viewWidth/3),
bestChoiceImage.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
bestChoiceImage.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant:
-(**rateButton.center.y - ratingLabel.center.y - bestChoiceImage.frame.height/2**))
])
Put ratingLabel and rateButton in a container view (e.g. a stack view) and constraints between bestChoiceImage and that container view.
You probably print it before the autolayout engine actually did its work. Try printing it in viewDidAppear for example.

Trying to get frame.height of one of the 2 views, that filled equally inside of a stackview

I have 2 views inside a vertical stackview(bothalf and tophalf). Their constraints dependent on that stackview.I have a horizontal stackview(containerStackView3) inside the botHalfView. Its constraints leading,trailing and height dependent on botHalfView. In debugging window i can see also on console, height of the bothalfview.frame.height=0 which i added as a constraint for horizontalstackview. Therefore horizontalstackview inside the bothalfview not showing any dimension. To which constraint i should assign the horizontalstackview's height? Or any other solution to this?
let containerStackView3 = UIStackView()
containerStackView3.translatesAutoresizingMaskIntoConstraints = false
containerStackView3.axis = .vertical
containerStackView3.distribution = .fillEqually
containerStackView3.spacing = 1
//adding views
containerStackView1.addArrangedSubview(botHalfView2)
botHalfView2.addSubview(containerStackView3)
//constraints bothalfview
botHalfView2.bottomAnchor.constraint(equalTo:
containerStackView1.bottomAnchor, constant: 0).isActive = true
botHalfView2.leadingAnchor.constraint(equalTo:
containerStackView1.leadingAnchor, constant: 0).isActive = true
botHalfView2.trailingAnchor.constraint(equalTo:
containerStackView1.trailingAnchor, constant: 0).isActive = true
// Constraints of the stack view inside the bothalfview
containerStackView3.leadingAnchor.constraint(equalTo:
botHalfView2.leadingAnchor, constant: 0).isActive = true
containerStackView3.trailingAnchor.constraint(equalTo:
botHalfView2.trailingAnchor, constant: 0).isActive = true
containerStackView3.bottomAnchor.constraint(equalTo:
botHalfView2.bottomAnchor, constant: 0).isActive = true
containerStackView3.heightAnchor.constraint(equalToConstant:botHalfView2.frame.height).isActive = true
If you need container heigh same as bot half then do this
// Constraints of the stack view inside the bothalfview
containerStackView3.leadingAnchor.constraint(equalTo:
botHalfView2.leadingAnchor, constant: 0).isActive = true
containerStackView3.trailingAnchor.constraint(equalTo:
botHalfView2.trailingAnchor, constant: 0).isActive = true
containerStackView3.bottomAnchor.constraint(equalTo:
botHalfView2.bottomAnchor, constant: 0).isActive = true
containerStackView3.topAnchor(equalTo:
botHalfView2.topAnchor, constant: 0).isActive = true

Autlo Layout issue

Set programatacally autlo layout to UIView but not set height constraint. I can't identify what is issue.
let viewSep = UIView()
viewSep.backgroundColor = UIColor.red
viewSep.translatesAutoresizingMaskIntoConstraints = false
viewInner.addSubview(viewSep)
viewSep.leftAnchor.constraint(equalTo: viewInner.leftAnchor, constant: 10).isActive = true
viewSep.topAnchor.constraint(equalTo: lblDate.bottomAnchor, constant: 5).isActive = true
viewSep.rightAnchor.constraint(equalTo: viewInner.rightAnchor, constant: -10).isActive = true
viewSep.heightAnchor.constraint(equalToConstant: 21)