Beginning Auto Layout - Part 5: Nesting Stack Views | Ray Wenderlich

Stack views can contain other stack views, which lets you create complex, flexible layouts. You’ll learn how to make nested stack views play nicely with each other.


This is a companion discussion topic for the original entry at https://www.raywenderlich.com/3937-beginning-auto-layout/lessons/5

I really wish that this video would have included a walkthrough of creating the layout shown in the challenge. Even looking at the downloaded project I can’t get my layout to work properly (when starting a new layout from scratch).

Hi latencykills … where are you running into issues when putting together the layout?

I’m so sorry, I don’t know how I missed your post. Yeah, if you let me know where you’re stuck, I’ll see if I can help.

Agreed. Or have more explanation in the PDF.

if you follow the course, you should not be stuck. Maybe watch again
edit : start with the smaller stack views, and then put them into the bigger stack views

He’s not the only one that feels the same. I watched all the vids up to his point, I do not have a problem with stacks views, but after looking at the finished project, I doubt I could have figured out that work flow either. Is there more than one way to achieve the same results, i.e. a different setup with constraints or stack views?

I agree it would be nice to see an actual solution step by step.

Wow, having loads of fun here! My challenge project started getting an attitude after adding stack views and constraints and was literally dragging ass when trying to select items in the storyboard. Was like a 15 sec delay when selecting anything. Tried deleting derived data in the project and did not help. Now reinstalling 4.52 g worth of Xcode 8.3.1, I hope this fixes the problem.

I spent 8 hours today trying to duplicate this challenge. I watched the vids over and over and I seem to keep missing the in-depth part on constraints. I can duplicate the stack views properly but the constraint part is a no go! I cannot find any other tuts online even remotely close to duplicating that setup. I keep stretching everything out of proportion.

I think a few intermediate challenges would have been more productive and allowed a smoother transition to this one.

Would be nice to see a step by step at least on PDF, is this possible?

Much appreciated for any feedback!

I’ll see if I can put something together to help with this. Thanks for the feedback, I’m so glad you’re enjoying it!

Hi Jerry! That would be greatly appreciated! I am not understanding the dynamics between stack views and constraints. I can some what duplicate the layout but I end up with a lot more constraints than you do. I am sure its something simple and I know there is a logical progression that needs to be followed. Thx!

Got stuck here as well … And you can see the example project uses constraints in order to work , not only stackviews …

1 Like

I scoured the net the entire weekend and all I could find were tuts showing constraints on basic layouts and a few nested stack views but of course not enough detailed explanation whats going on under the hood.

I did resolve the problem , the only issue I believe is you need to use constraints in order to resolve the problem , probably this challenge is in the wrong session …

Yes I am aware it has constraints, the issue is how to duplicate them to match the completed project so that all nested stacks are anchored and not stretched out of proportion and not adding more constraints than necessary.

I can get it to match somewhat but I have extra constraints.

Do you care to share the steps here?

Interesting note: I have had other experienced iOS developers try to duplicate this without showing the solution and they also end up with too many constraints, so I don’t feel so bad! I’m going nuts trying to figure this out!

One problem I’ve noticed on a separate project is I have five button views all contained within a stack view. I can’t get the buttons to shrink so that they always appear on the screen for say an SE. I have made the button size smaller with PS but stack view always seems to make them larger…

Have yet to figure this out.

I posted a walkthrough here: http://www.fivepackcreative.com/flexibility-auto-layout-nested-stack-views-augmented-constraints/

Let me know if you have any questions or if the walkthrough could be improved.

cc @latencykills, @reddrum, @anm8tr, @andydelarge

1 Like

It sounds like the key to your solution is constraints on the stack view to its superview.

1 Like

Jerry is too awesome and very generous! Thank you very much! Really enjoying these lessons!

This should be cool! I want to compare the steps and results with other experienced developers who have showed me
their solutions. Most looked good until you turned the screen sideways.

I’ve also had others tell me to nix the stack views, a lot of people give up apparently and go back to setting constraints only.