Next, add a button to the top right of each view controller. For both buttons, double-click and press backspace to set the button title to an empty string.
Also set each button’s background color to black.
Now it’s time to position the buttons with Auto Layout. Select the button on the first view controller, then select the Pin button in the lower-right corner, and configure it as follows:
Click the light red brackets for the top and right, and set them each to 10
Set the Width and Height to 44
Set Update Frames to Items of New Constraints
Click Add 4 Constraints, and the button will resize. Repeat this for the other button as well.
The last thing to configure is the shape of the buttons — you need to make them circular by setting a corner radius. Rather than painstakingly coding it, switch to the Identity Inspector and use the User Defined Runtime Attributes to define the key path and set the cornerRadius
for the button’s layer.
Interface Builder will not reflect the circular shape of the buttons, but build and run your app and you’ll see a black circle in the top right corner.
