Skip to content
Get packs

Guide · Open source

How to use SkeletonView: show loading placeholders in iOS apps

Updated · written with AI from the project's own documentation and checked against our catalogue data

SkeletonView is an open-source Swift library for iOS apps. While data loads, it covers chosen views with solid or animated placeholder shapes, so users can see roughly what content is coming. This guide shows how to install it, mark views as skeletonable, and call one of the four show methods, including the table and collection view setup.

SkeletonViewJuanpe/SkeletonView · ★ 12.9k · MIT

Quick start

  1. 1Add the package. Add SkeletonView to your project with Swift Package Manager or CocoaPods, using the lines shown in the installation section.
  2. 2Import the library. Add import SkeletonView in the Swift file where you want the loading placeholders.
  3. 3Mark the views. Set isSkeletonable to true on the views that should become placeholders, or mark them in Interface Builder.
  4. 4Call a show method. Call showSkeleton, showGradientSkeleton, showAnimatedSkeleton or showAnimatedGradientSkeleton on the container view.
  5. 5Set up table or collection views. For lists, conform to SkeletonTableViewDataSource or the collection equivalent and implement the cell identifier method.

Install SkeletonView with Swift Package Manager or CocoaPods

The README lists several install methods: Swift Package Manager, CocoaPods and Carthage. For Swift Package Manager, add the package to the dependencies in your Package.swift file. For CocoaPods, add the pod to your Podfile.

The README notes that since version 1.30.0 the library supports XCFrameworks. If you want to install it as an XCFramework, the README points to a separate repository instead.

  • Swift Package Manager: add the dependency to Package.swift
  • CocoaPods: add the pod to your Podfile
  • Carthage is also listed in the README
.package(url: "https://github.com/Juanpe/SkeletonView.git", from: "1.7.0") pod 'SkeletonView'

Import SkeletonView and mark views as skeletonable

Start by importing the library in the file where you want to show the placeholders. Then tell SkeletonView which views should become placeholders. You can do this in code or in Interface Builder and Storyboards.

The README says all UIViews are skeletonable, so you choose which ones to include rather than every view on screen.

  • In code, set isSkeletonable to true on each view you want to cover
  • In Interface Builder or Storyboards, mark the view using the storyboard option shown in the README
import SkeletonView avatarImageView.isSkeletonable = true

Show the skeleton with one of four methods

Once the views are marked, call one of four show methods on a view or its container. The README describes them as solid, gradient, solid animated and gradient animated. Choose the style that fits your design.

SkeletonView is recursive. If you want the skeleton on every skeletonable view, call the show method once on the main container, for example a UIViewController's root view, rather than on each view separately.

  • showSkeleton(): solid
  • showGradientSkeleton(): gradient
  • showAnimatedSkeleton(): solid animated
  • showAnimatedGradientSkeleton(): gradient animated
view.showSkeleton() view.showGradientSkeleton() view.showAnimatedSkeleton() view.showAnimatedGradientSkeleton()

Use SkeletonView with UITableView and UICollectionView

SkeletonView works with UITableView and UICollectionView. For a table view, conform to the SkeletonTableViewDataSource protocol. The README says this protocol inherits from UITableViewDataSource, so you can use the skeleton protocol in place of the standard one.

Most methods have defaults. The number of rows per section is calculated at runtime so the table fills its space. You must implement the cell identifier method yourself, because it has no default. If you return UITableView.automaticNumberOfSkeletonRows from the row-count method, the default behaviour is used.

  • numberOfRowsInSection: has a default that fills the table view
  • cellIdentifierForRowAt: required, no default
  • skeletonCellForRowAt: optional, lets you adjust a cell before the skeleton appears
  • prepareCellForSkeleton: lets the library dequeue cells and you configure them
  • Headers and footers can be skeletonized by conforming to SkeletonTableViewDelegate
func collectionSkeletonView(_ skeletonView: UITableView, cellIdentifierForRowAt indexPath: IndexPath) -> ReusableCellIdentifier { return "CellIdentifier" }

What people use it for

  • Showing placeholder rows in a UITableView while a network request loads
  • Showing a grid of placeholder cells in a UICollectionView before data arrives
  • Covering a profile screen with placeholder avatar and text shapes while the user's details load
  • Giving a loading state for iPhone and iPad apps without writing custom animation code

Frequently asked questions

Is SkeletonView free to use?

SkeletonView is released under the MIT licence, as stated in the project's README. Check the LICENSE file in the repository for the full terms before using it in a commercial app.

How do I install SkeletonView?

The README lists Swift Package Manager, CocoaPods and Carthage. For Swift Package Manager, add the package URL with from: 1.7.0 to your Package.swift dependencies. For CocoaPods, add pod 'SkeletonView' to your Podfile.

Does SkeletonView work with SwiftUI?

The README only describes UIView, UITableView and UICollectionView usage in Swift. It does not mention SwiftUI, so check the repository before assuming support.

Does SkeletonView support Android or web?

No. The README only covers iOS. For Android or cross-platform projects, you need a different library.

Why does my skeleton not appear in a table view?

The README says table views need the SkeletonTableViewDataSource protocol and a cell identifier method, which has no default. Make sure you implement that method and that the cells are marked skeletonable.

What are the alternatives to SkeletonView?

Comparable projects named in the analysis include ShimmerView, SkeletonUI and Shimmer. Compare them on the platforms and layouts you need before choosing.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

SkeletonView suits iOS developers who load data over the network and want placeholders that match their layout without writing animation code. It is a poor fit for Android, web or cross-platform projects, and for teams that only need a simple spinner.

Install options & downloads