What's the UIScrollView contentInset property for?

Can someone explain to me what the contentInset property in a UIScrollView instance is used for? And maybe provide an example?

Solution 1:

It sets the distance of the inset between the content view and the enclosing scroll view.

Obj-C

aScrollView.contentInset = UIEdgeInsetsMake(0, 0, 0, 7.0);

Swift 5.0

aScrollView.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 7.0)

Here's a good iOS Reference Library article on scroll views that has an informative screenshot (fig 1-3) - I'll replicate it via text here:

  _|←_cW_→_|_↓_
   |       | 
---------------
   |content| ↑
 ↑ |content| contentInset.top
cH |content|
 ↓ |content| contentInset.bottom
   |content| ↓
---------------
  _|_______|___ 
             ↑


   (cH = contentSize.height; cW = contentSize.width)

The scroll view encloses the content view plus whatever padding is provided by the specified content insets.

Solution 2:

While jball's answer is an excellent description of content insets, it doesn't answer the question of when to use it. I'll borrow from his diagrams:

  _|←_cW_→_|_↓_
   |       | 
---------------
   |content| ↑
 ↑ |content| contentInset.top
cH |content|
 ↓ |content| contentInset.bottom
   |content| ↓
---------------
   |content|    
-------------↑-

That's what you get when you do it, but the usefulness of it only shows when you scroll:

  _|←_cW_→_|_↓_
   |content| ← content is still visible
---------------
   |content| ↑
 ↑ |content| contentInset.top
cH |content|
 ↓ |content| contentInset.bottom
   |content| ↓
---------------
  _|_______|___ 
             ↑

That top row of content will still be visible because it's still inside the frame of the scroll view. One way to think of the top offset is "how much to shift the content down the scroll view when we're scrolled all the way to the top"

To see a place where this is actually used, look at the build-in Photos app on the iphone. The Navigation bar and status bar are transparent, and the contents of the scroll view are visible underneath. That's because the scroll view's frame extends out that far. But if it wasn't for the content inset, you would never be able to have the top of the content clear that transparent navigation bar when you go all the way to the top.