1/4

iOS Assignment

AutoLayout

Please conduct the following tasks alone. For implementation details you can refer to the lecture slides or the Apple developer website. Please do not hesitate to ask me or the tutor if you have any questions. Under “Tip” you can find some hints for the task. The “Checklist” specifies what should happen when your implementation is correct.

2/4

Tasks

  1. Login View for different devices
  2. Using StackViews to create flexible layouts
3/4

1. Login View for different devices

Create a new app with the following screen layout in a ViewController using StoryBoards:

center 60%

Tip

The NavigationBar should have a constraint defining its width to be the same as the superviews width. Add the same constraint for the Textfields but have the width reduced by 20 pixels on each side by constraining it to the margins of the superview. All views (Labels, Textfields and Button) should be positioned relative to each other on the y-axis by defining the distance constraint to each other. Have the Labels and Textfields aligned to each other using the alignment function. Use the fix issues button to add missing constraints or fix the positions of the views.

Checklist
Use the preview function of Xcode to check the views on different devices and orientations. The result should look like the one above.
4/4

2. Using StackViews to create flexible layouts

Create a second ViewController that contains a Label on the top, an ImageView in the middle and two Buttons at the bottom like shown here:

center 70%

Tip

Use two StackViews to create this flexible layout. One StackView contains the two Buttons the other one contains the Label, the ImageView and the first StackView. Play around with the alignment and distribution parameters until you have the corresponding result.

Checklist
The position of the view adapts like shown in the screenshot above to any device and orientation, automatically