Now, abstractly we might see this as a diagram like here on the left
where the root element is the window, or the thing that has responsibility for
the entire IOS screen.
And maybe within that there's a Navigation Controller that's managing
moving from one view to another.
The Navigation Controller within its boundaries,
within its container, has a view.
And maybe that view has a Navigation bar at the top and a slider in the middle.
So, we can think about it abstractly in terms of a tree structure like this.
And what we'll see often when we work in Xcode is that this abstract hierarchy
which I've displayed here as boxes and arrows gets represented in something that
looks like a file chooser, or a file picker.
Something that you can navigate through with accordion views that you can open and
close.
We'll see that when we start to implement some of these things in Xcode.
Although we represent these as box and arrows here on the left, when you actually
lay it out, it gets laid out according to the properties of the element itself.
So, we might see that this structure on the left gets drawn
something more like the structure on the right.
Now, on the right one what I done is I've separated out the layers that get drawn,
that would eventually get sort of all smooshed together
according to the properties of each of the layers.
Now, this layering, if you'll recall back, speaks to the high level design concept
of layering that the human interface guidelines,
the Apple human interface Interface guidelines, referred to.
And it was through this layering that they suggested it was possible to do some
interesting and exciting kind of animations that could delight the user.
So, in this case we see that the window forms the background.
It is the parent, and
all the other elements are drawn within the boundaries of the window.
The navigation controller also draws over the entire contents of the window.
The view is gonna draw over the entire contents of the navigation controller in
this abstract example.
Then, the navigation bar might be drawn at the top of the view and
the slider at the bottom of the view.
When this is fully rendered, all those will be layered on top of
each other like you might see if you've used Photoshop layers or
you've used maybe layers in an HTML layout.
Same sort of effect here.
A tree structure rendered as layers that get flattened together.
