Giter Site home page Giter Site logo

contentloader's Introduction

ContentLoader  Logo

Version License Swift 5.0 Platform Twitter


Display awesome animated placeholder loading to your content. Use your custom views to generate low-contrast blocks, with the same shapes, positions. Make beautiful animations using your own format as Slack, Instagram, or Facebook does. ContentLoader is written in Swift 5 with iOS customizable and easy to use.


ContentLoader

ContentLoader

  • Awesome animations on loading
  • Totally customizable
  • Use it also in your own tables and collection views
  • Easy usage
  • Supports iOS, developed in Swift 5

Table of Contents

Installation

ContentLoader is available through CocoaPods. To install it, simply add the following line to your Podfile and run pod install:

pod 'ContentLoader'

Then you can import it when you need

import ContentLoader

Usage

In the example you will see some custom content loaders that can be used in your project. Once you've installed the pod, follow next steps. It's really simple:

ContentLoader in your View

Select one of your custom view controllers. Choose the views inside this viewcontroller where would like to make Loadable and set isLoadable view property to true. Those views will convert to loadable objects when ContentLoader is loading. If you are using xibs / storyboards, you can see new editable Is Loadable property.

Screenshot 1

Using Table or Collection views?

If you are using Table or Collection views, you can make the same with your cells. Make Loadable the views you want. Then, you must implement ContentLoaderDataSource to complete some data ContentLoader needs to draw loader objects. It's really simple:

extension TableViewController: ContentLoaderDataSource {

    /// Number of sections you would like to show in loader
    func numSections(in contentLoaderView: UIView) -> Int {
        return 1
    }

    /// Number of rows you would like to show in loader
    func contentLoaderView(_ contentLoaderView: UIView, numberOfItemsInSection section: Int) -> Int {
        return 10
    }

    /// Cell reuse identifier you would like to use (ContenLoader will search loadable objects here!)
    func contentLoaderView(_ contentLoaderView: UIView, cellIdentifierForItemAt indexPath: IndexPath) -> String {
        return "MyCellReuseIdentifier"
    }
}

Format

You can format ContentLoader with your own parameters. See default values:

var format = ContentLoaderFormat()

/// Loader objects color
format.color = UIColor.lightGray

/// Loader objects corner radius
format.radius = 5

/// Loader animation type
format.animation = .fade

Start and Stop Loading

Simple ;)

view.startLoading()
// or
view.startLoading(format: format)
view.hideLoading()

In case of table or collection views

tableView.startLoading()
// or
tableView.startLoading(format: format)
tableView.hideLoading()

Animation Types

Fade

This type will make fade animation when content is loading

ContentLoaderAnimation.fade

Gradient

This type will make gradient animation when content is loading (coming soon)

ContentLoaderAnimation.gradient(UIColor, UIColor)

(Start color, End color)

Apps using ContentLoader

If you use ContentLoader I'd love to hear about it and feature your app here!

FashTime

Author

Alberto Aznar, [email protected] Based on Skeleton View by Juanpe Catalán.

Contributing

Feel free to collaborate with ideas 💭, issues ⁉️ and/or pull requests 🔃.

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

License

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

Libraries by @alberdev

AnimatedField  Logo ContentLoader  Logo CiaoTransitions  Logo DateScrollPicker  Logo EmptyStateKit  Logo GridTimerView  Logo PaintCodeKit  Logo

contentloader's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

contentloader's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.