In Project6 we make a copy of Project2 (The "Guess the Flag" app) and add new constraints to the buttons in order to make them fit on the screen even when the device is rotated to landscape mode.

I followed the instructions, and it makes the flags fit on the screen, but the borders around each button do not resize properly along with the flags after the device is rotated.

I can still see the borders on each flag, but they are not around the edges. On the first button, the border is inset on all sides. On the second 2 buttons the borders are inset vertically, but not horizontally.

Does anybody know how to fix this?

We have only been taught to add the borders by adding code like this in our viewDidLoad() function

override func viewDidLoad() {
        super.viewDidLoad()

        navigationItem.rightBarButtonItem = UIBarButtonItem(barButtonSystemItem: .pause, target: self, action: #selector(showScore))

        countries += ["estonia", "france", "germany", "ireland", "italy", "monaco", "nigeria", "poland", "russia", "spain", "uk", "us"]

        button1.layer.borderWidth = 1
        button2.layer.borderWidth = 1
        button3.layer.borderWidth = 1

        button1.layer.borderColor = UIColor.lightGray.cgColor
        button2.layer.borderColor = UIColor.lightGray.cgColor
        button3.layer.borderColor = UIColor.lightGray.cgColor

        askQuestion()
}

So, I don't know of any way to modify them after the device orientation changes and the buttons are resized.

I have the same issue

Same, too.

If someone still experiences this issue please post a pic :) by checking the possibilities it might be the gray color mixes with flag borders making it seem as insetted or offsetted by small bit. Try to make the border thicker e.g. borderWidth = 2 Also if this is not the issue try to add ->

view.setNeedsLayout()
view.layoutIfNeeded()

inside viewDidLoad()

setNeedsLayout() - this method informs the system that the current layout is invalid and it should be updated in the next drawing cycle. layoutIfNeeded() - this method asks the system to update the layout.

I have the same part of the code as posted above and it works fine. There are tiny insets visible in simulagtor but I suspect it is just how the color mixes with flag :)

Did anyone ever find a solution to this? I have the same problem.

did you try this? https://www.hackingwithswift.com/forums/100-days-of-swift/day-19-project-2-constraints-and-button-padding/10249/12273

Thanks @ygeras I tried that but it made things worse. When switching to landscape, the borders were all squeezed together at the top and the flags were no longer in line.

When button2.height = button1.height and button3.height = button2.height is not set button1 and button2 border is correctly positioned but button3 border are inside the flag. closest I reached to the soln: without height constraints When button2.height = button1.height and button3.height = button2.height is set button1, button2, button3 borders are inside the flag. tutorial preview: with height constraints borderWidth = 2 and inside viewDidLoad():
view.setNeedsLayout() view.layoutIfNeeded() even tried ygeras' soln: nothing worked🥲

Finally found the Solution:

• Change the button setting in attribute inspector for all the buttons

• type should be custom (not System)

• Style should be Default (not Plain) and remove any title text if given

• text color default is white in type: custom (it was blue as default in type: System)

NOTE: if you have not changed the type then you will see all blue flags