• Stars
    star
    314
  • Rank 133,353 (Top 3 %)
  • Language
    Swift
  • License
    MIT License
  • Created almost 6 years ago
  • Updated over 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

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

WLEmptyState_Banner WLEmptyState CI Version Carthage compatible Twitter MIT license

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 [email protected]: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

Default WLEmptyState

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
}

Simulator Screen Shot - iPhone X - 2019-07-24 at 16 07 43

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
    }

}

Contributing to WLEmptyState

We actively welcome your pull requests. We are trying to make contributions to this project as transparent and accessible as possible, please read our Contributing guidelines and follow the Code of conduct. If you face any problem with the code, please open an issue on GitHub.

List of Contributors. ⭐️

License

WLEmptyState is available under the MIT license. See the LICENSE file for more info.

More Repositories

1

sqlalchemy-pagination

Small utility to paginate SqlAlchemy queries.
Python
75
star
2

serverless-fullstack

Get started developing applications quickly with best practices using Serverless on AWS.
JavaScript
32
star
3

remix-project-lab

TypeScript
9
star
4

serverless-amplify-plugin

JavaScript
8
star
5

javascript-style-guide

JavaScript Style Guide
JavaScript
7
star
6

access-decision-manager

access-decision-manager
TypeScript
6
star
7

tea

Wizeline Design System
TypeScript
6
star
8

Cypress-Framework

JavaScript
6
star
9

project-lab

Proposal Hunt / Project Lab experimental repo
TypeScript
5
star
10

qa-buddy-program

QA on-boarding buddy program.
5
star
11

wizegames

Project created to learn rails and have fun :D
Ruby
5
star
12

wize-docs

3
star
13

xpub-xsub

multiple subscribers multiple publisher on netmq
C#
3
star
14

wize-q-remix

JavaScript
3
star
15

workshop_intro_scala

Jupyter Notebook
2
star
16

simple-apollo-android

Apollo wrapper with builder pattern, simple functions and returns
Kotlin
2
star
17

relayer

Relayer is a python library to emit events to kafka and aggregate application logs into a kafka topic.
Python
2
star
18

quantum-web-heads

Documentation for Quantum Reacters community
2
star
19

WizeIEX_backend

Wize-IEX - This internal project aims to provide wizeliners with a platform to contribute to and consult collective knowledge about interview experiences
2
star
20

android-viewstate

ViewState is an Android user interface element that can be used to hold a simple child with content, this element can be used to give visual feedback to the users, for instance is can be used to notify about the state of a network request.
Kotlin
2
star
21

CA-Microservices-Go

This project is a template generator based on Golang focused on a Rest-API.
Go
1
star
22

wordpress-migration-cli

Python
1
star
23

wizekit-slack-app

WizeKit Slack App, a collection of commands for enterprise workspace
JavaScript
1
star
24

random-roulette

Swift
1
star
25

react-apprenticeship

TypeScript
1
star
26

standard-cicd-pipeline

Standard Pipeline
Groovy
1
star
27

langchain-essentials-js

Basic examples for LangChain JS implementation
JavaScript
1
star
28

fe-python-sample

Frontend python automation.
Python
1
star
29

wizemoon

https://wizemoon.onrender.com/buy-token
TypeScript
1
star
30

fe-ios-xcuitest-mob-sample

Swift
1
star
31

stateless-auth-workshop-react

Base Curricula Workshop: Stateless authentication with React
JavaScript
1
star
32

nextjs-langchain-template-app

TypeScript
1
star
33

vividas-testCafe-suite

JavaScript
1
star
34

events-ms-stack

Events stack on Spring Boot, Axon, Java, Kotlin CQRS stack based on Sergey Kargopolov Udemy training
Kotlin
1
star
35

AI-DataScience-cc

Jupyter Notebook
1
star
36

aux

Accessibility and usability experience indicators for UX's and developers
1
star
37

lumiata-covid-hackathon

Prototype for the Lumiata COVID-19 hackathon
TypeScript
1
star
38

optimizely-sync

Infrastructure as Code for Optimizely
TypeScript
1
star
39

avalonbay-service-call-code-challenge

AvalonBay Web Service Call Code Challenge (Sang Huynh's Challenge)
JavaScript
1
star
40

JetpackCompose-Academy

Course with Jetpack compose
Kotlin
1
star
41

WizeIEX_frontend

A platform dedicated to collect, visualize and provide relevant data to better prepare benchers for their upcoming interviews.
1
star
42

fe-be-playwright-sample

This repository contains samples of the implementation of a Front-End and Back-End project using Playwright and TypeScript.
TypeScript
1
star
43

AcademyAlexaSwift

Demonstration of how to develop for the Amazon Echo. With this skill the user is capable to ask Alexa for the statistics of the enemy team in League of Legends the video game, and know what they should care about.
Swift
1
star