WLEmptyState
  • October 16, 2023

Table of Content


Overview


WLEmptyState is an iOS based component that lets you customize the message when the dataset of UITableView or UICollectionView is empty. We created a sample project with the WLEmptyState component to show how you can use it.

Running an Example Project


To run the Example project:

  1. Clone the repo with the following command:

    git clone git@github.com:wizeline/WLEmptyState.git

  2. Move to the Example directory and run the following command:

    pod install

Installing WLEmptyState

CocoaPods

WLEmptyState is available through CocoaPods. To install it, add the following command to your Podfile:

pod ‘WLEmptyState’

Carthage

Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks. To integrate WLEmptyState into your Xcode project using Carthage, specify it in your Cartfile:

github “wizeline/WLEmptyState”

Configuring WLEmptyState

The WLEmptyState component uses Method Swizzling. Therefore, to configure WLEmptyState, follow these steps:

  1. Import the module in the AppDelegate class by adding import WLEmptyState.

  2. Call the static method configure() on application(_ application:, didFinishLaunchingWithOptions:) method.

    Your AppDelegate class should look like this:

import WLEmptyState

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
WLEmptyState.configure()
return true
}

Using WLEmptyState

Once you have configured WLEmptyState, you can use it for your UITableViewController or UICollectionViewController. You need to conform the WLEmptyStateDataSource protocol. For example,

class YourTableViewController: UITableViewController, WLEmptyStateDataSource {

override func viewDidLoad() {
super.viewDidLoad()
tableView.emptyStateDataSource = self
}

}

After you run your project with an empty dataset for your entity, you’ll be able to see a default WLEmptyState view.

Default Image

Customizing Default WLEmptyState


If you want to customize the text, description, or image, of the default component you need to implement the WLEmptyStateDataSource function. You can find the code for customization in the following list:

  • Customize Image

func imageForEmptyDataSet() -> UIImage? {
return UIImage(named: “bubble_icon”)
}

  • Customize Title

func titleForEmptyDataSet() -> NSAttributedString {
let title = NSAttributedString(string: “No messages”, attributes: [NSAttributedString.Key.font: UIFont.preferredFont(forTextStyle: .headline)])
return title
}

  • Customize Description

func descriptionForEmptyDataSet() -> NSAttributedString {
let title = NSAttributedString(string: “There’s no messages to show.”, attributes: [NSAttributedString.Key.font: UIFont.preferredFont(forTextStyle: .caption1)])
return title
}

Customized Image

Creating your own EmptyState


Using customViewForEmptyState() allows you to provide your own implementation for Empty State.

func customViewForEmptyState() -> UIView? {
let activityIndicatorView = UIActivityIndicatorView()
activityIndicatorView.startAnimating()
activityIndicatorView.color = .purple
return activityIndicatorView
}

Disable scroll


You can disable the scroll when the Empty State is showing. You only need to conform the WLEmptyStateDelegate protocol and return false in the enableScrollForEmptyState() function:

// Conform the WLEmptyStateDelegate protocol
class YourTableViewController: UITableViewController, WLEmptyStateDataSource, WLEmptyStateDelegate {

override func viewDidLoad() {
super.viewDidLoad()

tableView.emptyStateDataSource = self
tableView.emptyStateDelegate = self // Set your delegate
}

func enableScrollForEmptyState() -> Bool {
// To enable/disable the scroll return true or false
return false
}

}

GitHub


View Github

#autolayout #cocoa #cocoapod #cocoapods #cocoatouch #collection #collectionkit #collectionview #collectionviewcell #collectionviewlayout #customlayout #dynamic #emptydataset #emptystate #expandabletableview #flowlayout #hashtag #hashtags #ibinspectable #instagram #instagramanimation #ios #iosanimation #iosdevelopment #iossdk #iosswift #iosthirdparty #lightboxalgorithm #objectivec #placeholder #swift #swiftanimation #swiftcollection #swiftimage #swiftlibrary #swiftpackagemanager #swiftui #swiftuicomponents #table #tableview #tableviewcell #taglistview #tags #tagsview #uicollectionview #uicollectionviewanimation #uicollectionviewcell #uicollectionviewflowlayout #uicollectionviewlayout #uikit #uitableview #uitableviewcell #uitableviewcocoapods #uitableviewcontroller #xcode
YOU MIGHT ALSO LIKE...
exyte

     

camerakit-ios

CameraKit helps you add reliable camera to your app quickly. Our open source camera platform provides consistent capture results, service ...

HybridCamera

[video width="192" height="416" mp4="https://swiftgit.com/wp-content/uploads/2024/12/68747470733a2f2f7261776769742e636f6d2f7374796c656b69742f696d672f6d61737465722f7669645f6564697465645f325f326d622e676966.mp4"][/video]

TakeASelfie

An iOS framework that uses the front camera, detects your face and takes a selfie. This api opens the front ...

iOS-Depth-Sampler

Code examples of Depth APIs in iOS