Code Monkey home page Code Monkey logo

segmentedprogressbar's Introduction

Swift Version twitter: @dylan36032

SegmentedProgressBar

A simple little control that animates segments like Snapchat or Instagram Stories.

Screenshot

Requirements

  • iOS 8.0+
  • Xcode 8

Installation

Drag and drop SegmentedProgressBar.swift into your project. That's it.

Usage

let spb = SegmentedProgressBar(numberOfSegments: 3, duration: 5)
spb.frame = CGRect(x: 15, y: 15, width: view.frame.width - 30, height: 4)
view.addSubview(spb)

spb.startAnimation()

Additional Stuff

Delegate:

spb.delegate = self // has to conform to SegmentedProgressBarDelegate

func segmentedProgressBarChangedIndex(index: Int) {
}

func segmentedProgressBarFinished() {
}

Styling:

spb.topColor = UIColor.white
spb.bottomColor = UIColor.white.withAlphaComponent(0.25)
spb.padding = 2

Pausing / Resuming

spb.isPaused = true
spb.isPaused = false

Skip / Rewind

spb.skip()
spb.rewind()

segmentedprogressbar'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  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  avatar  avatar  avatar  avatar  avatar  avatar

segmentedprogressbar's Issues

Change number of segments?

Is it possible to change the number of segments after initialize an SPB instance? For example, a user could delete an item in middle of viewing, thus, segment should update to reflect number of viewing items.

Thanks for a fantastic library btw!

When app came from background to foreground

Suppose timer have 6 screns eqch having its own duration and now user is on 3 screen and goes in background, and when coming bck to foreground so in that case how to open timer from same screen with same duration. Please confirm.

Gesture/taps : an enhancement

Hi, this is an enhancement suggestion for this library.

We can have tap to each of the segment to move to that part as well as have tap gesture on the left edge and right edge of the screen to move between segments.

In addition to this, when doing long press on screen, the transition can pause and when finger is lifted, the transition can resume.

Inspired from status option in whats app.

Regards
Hooda

Configure duration of each segment?

The only workaround I can think of at the moment without testing it is initializing multiple SegmentedProgressBars and laying them out in the view, but that's pretty inefficient. Is there a way to modify the duration of each bar itself?

Using with collection view

Hello , I am using this progress in collection view cell because of reloading cell it is not working as instagram. Sometimes the progress bar is not moving. Can any one help me in this.

Thanks

Rewind one story

I am trying to load a previous story but cannot manage to do so.

Here is the function I am trying to implement which should be the opposite action to skip() :

func rewindOne() {
let currentSegment = segments[currentAnimationIndex]
currentSegment.topSegmentView.frame.size.width = 0
currentSegment.topSegmentView.layer.removeAllAnimations()

var newIndex = self.currentAnimationIndex - 1
    if newIndex < 0 { newIndex = 0 }
    
    if newIndex >= 0 {
        self.delegate?.segmentedProgressBarChangedIndex(index: newIndex)
        self.animate(animationIndex: newIndex)
    }

}

The animation does not stop, I have 3 items, tried:
segments.forEach {
$0.topSegmentView.layer.removeAllAnimations()
}
The segment keeps being animated.

Remove particular segment

I am trying to delete particular data from its index but at that time segmented progress bar not reload or reset , it shows previous index data. please let me know remove data from particular index and move to next.
I had used all functionalities of skip, pause and previous. all these functionalities works awesome.

I want to use this like Instagram stories.

I had trying method for delete is give as below

func delete() {
let currentSegment = segments[currentAnimationIndex]
currentSegment.topSegmentView.frame.size.width = currentSegment.bottomSegmentView.frame.width
let newIndex = max(currentAnimationIndex - 1, 0)
if newIndex < self.segments.count {
self.delegate?.segmentedProgressBarChangedIndex(index: newIndex)
self.animate(animationIndex: newIndex)
} else {
self.delegate?.segmentedProgressBarFinished()
}
}

If any changes let me know

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.