Software Dev

At a glance: frames and bounds πŸ–ΌοΈ

Next up in the iOS fundamentals at a glance series: frames and bounds.

This is such a fundamental idea that there are a ton of articles and videos on this topic. But here’s the most basic idea…

Unlike some previous concepts, the term frame is perfect here because it’s just like a frame on a wall.

A frame (subview) is placed on the wall (superview). The frame has a location, defined by its origin in the upper-left, and a size, plus an x/y coordinate system.

Simple enough, right?

Bounds gets a little more confusing. It should probably be called “window” since it defines what part of a potentially larger view you see, but that term was already taken, so here we are with “bounds”.

Like its frame, a bounds also has its origin in the top-left, plus a size and its own x/ycoordinate system. Oddly enough, the y-axis works opposite of the frame. πŸ€¦πŸ»β€β™‚οΈ They do this just to make programming hard, right?

Here we can see that the frame above only showed us part of a bigger picture; what we see is defined by the bounds.

This concept is especially useful for scroll views, which essentially let you move the bounds around to look at different parts of the view.

I hope that helps. And if you ever get confused, remember a frame picture of a wall, like this one at the local coffee shop.

Quotes

“I’m cute, and I can rhyme my ass off. No wonder they want to destroy me.”

Trying to challenge myself and write some original songs instead of just doing covers, I’ve found that the lyrics come a lot easier than the music. Putting together some new and interesting musical chords or, heaven forbid, a melody? That’s hard. But I can rhyme all day.

So I thought it was funny when Keeley Jones, the soccer (aka “football”) team’s vivacious marketing honcho on Ted Lasso, said this on S1E3.

I’m cute, and I can rhyme my ass off. No wonder they want to destroy me.

Kudos to Keeley for that laugh and for giving me something a little lighter to post here today.

Back to your regularly scheduled philosophy quotes, tech sketches, artsy photos, and amateur ramblings later.

Software Dev

At a glance: flow layout βŽ“

Continuing with the iOS at a glance series, we’re still digging our way though the old fundamentals of layout.

Introduced way back in iOS 6 with the initial collection view offering, the flow layout gave developers a more natural and fluid way to lay out views than the OG table view.

A flow layout lets your subviews flow just like words on a page (at least in English), from left to right and top to bottom, as the blue pencil line shows below.

The blue pencil lines here illustrate the flow layout working, but of course what the user actually sees is just the subviews.

Flow layouts support landscape or portrait scrolling and have a variety of options such as making all the items different sizes or the same size, adding sections (below), adding section headers and footers, and controlling spacing and alignment.