Mastering Auto Layout - Part 4: Challenge: | Ray Wenderlich Videos

🎓 Courses & Articles
1

Create an Auto Layout-based treasure map using scroll views, combined with what else you've learned in this course.

This is a companion discussion topic for the original entry at https://www.raywenderlich.com/4260-mastering-auto-layout/lessons/4
2

This example was far too overwhelming, and I didn’t get much out of it.

3

@jessycatterwaul Do you have any feedback regarding this? Thank you - much appreciated! :]

4

Did something change in iOS 12 / Xcode 10 to break this challenge? It seems on the bottom and left side of the screen (where you see the “scroll indicators”) you cannot see the marker view. The top and left side of the screen appears to work fine.

5

I just tried it on two devices, and don’t seem to be having the issue you’re talking about. Perhaps you could upload a video of it, and your version of the project?

6

Hey Jessy, thanks for the response and sorry for my late response! I have no idea what changed in the last 11 days, but the simulator now seems to work fine for me. Maybe I should have tried restarting the computer before I posted :).

1 Like
7

I seriously didn’t get anything from this video. There should be a more detailed video on “How to work with auto layout constraints in scroll view”. Not to mention this is such a crucial topic for app development.

1 Like
8

@anon35070463 Thank you for your feedback - much appreciated! We’ll definitely take it into account when we update the course.

9

This took some time to figure out, the key being that there are 3 constraints that need to be set, from highest to lowest priority:

  1. The marker image view should be its intrinsic size
  2. The marker view (containing the image view) should be within the bounds of the the scroll view’s container. It helps to rename this view ‘Container’.
  3. The marker view should be as close to the treasure as possible, but without violating items 1) and 2).

Since the marker image view’s compression resistance is set to 999 in the challenge video, constraint priority for 3) must be lower, so 998 can be used. Using 1000 and 999 for priority values accordingly also works.

Side note: it’s ok to set the view width/height of a view like the marker image to 0, since update frames will fix this size after all constraints are properly applied.

1 Like
10

I have to agree with others that this is too many things all at once for a ‘challenge’. If anyone is following the iOS and Swift for Beginners learning path, this is course 6 in that journey. Scroll Views, are course 11. We are barely halfway there. At the top of this challenge video it says you can go do the Scroll View course. That seems out of line with having a learning path which develops from course to course. This essentially tells me to drop everything I’m learning, go take a separate 1+ hour course out of sync with the learning path, and then come back in order to do the challenge so that you can understand these instructions.

2 Likes
11

@catie @jessycatterwaul @jcatterwaul Can you please help with this when you get a chance? Thank you - much appreciated! :]

12

This problem is a holdover from when the courses were not in a learning path. We decided to include Mastering Auto Layout because constraints in code aren’t covered elsewhere, and they’re helpful for Beginning iOS Animations. When the next learning path update comes out, we should have this taken care of. As you’ve said, this challenge would make more sense in or after Scroll View School.

13

I literally feel like I didn’t have the tools to do this challenge? Am I missing a video or what happened? How are we expected to ever do this challenge with the knowledge gained from the previous videos? Feels so rushed


14

@flint Please let us know what you don’t understand exactly when you get a chance. Thank you!

16

Seems the Video is not updated for iOS 12.

Note:

Top/Bottom layout guide is deprecated since iOS 11.0

Instead of the constraints against Top/Botton layout guides you should set the constraints to safeArea.

2 Likes
17

@hamidra Thank you for the heads up - much appreciated! We will update the whole video course soon.

18

I am totally lost in this video, it was just overwhelming. first the whole idea of search for the treasure was scary. I have just finished basics and learned a little bit. and I was assigned to make this complicated thing. I know, I didn’t have to write any code but the idea of it was overwhelming. Please talk about the map a little bit, so we can get a little comfortable before we even try to do it Thanks?

1 Like
19

@c_nasir Thank you for your feedback - much appreciated!

20

Great Challenge! Loved to watch the solution. Can you please briefly describe why the arrow is compressed to zero size (video: 3:33) ? Trying to wrap y head around quite a few thoughts. Thanks in advance!!

1 Like
21

Without increasing its compression resistance, Auto Layout compresses its parent view (Marker) to zero in both dimensions.