Giter Club home page Giter Club logo

ttrangeslider's Introduction

TTRangeSlider

Build Status Version License Platform

A slider, similar in style to UISlider, but which allows you to pick a minimum and maximum range.

Screenshot

Installation

TTRangeSlider is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "TTRangeSlider"

Note that this control uses IB_DESIGNABLE, so for it to work well and not get warnings in Interface Builder, you should use the latest version of CocoaPods, and add the use_frameworks! line. So your podfile may look something like

source 'https://github.com/CocoaPods/Specs.git'
use_frameworks!

pod “TTRangeSlider”

Usage

Add the TTRangeSlider like you would with any other UIControl. Either:

  • Add a view in your storyboard/class and change it’s type to TTRangeSlider. As long as you’re using >= XCode6 you can now use this control like any other, you can set all the properties in the Attributes Inspector and see a live preview:

Interface Builder Screenshot

or

  • Create the TTRangeSlider in code using [TTRangeSlider alloc] init] then add it as a subview to your code and set the relevant autolayout properties or frame.

The default slider ranges from 0->100 and has 10 preselected as the minimum, and 90 as the maximum.

Values that the user has selected are exposed using the selectedMinimum and selectedMaximum properties. You can also use these properties to change the selected values programatically if you wish.

Getting updates

To be notified when the slider’s value changes, register your action method with the UIControlEventValueChanged event. At runtime, the slider calls your method in response to the user changing the slider’s value.

Alternatively you can implement the TTRangeSliderDelegate protocol and respond to changes in the rangeSlider:didChangeSelectedMinimumValue:andMaximumValue: method.

Other customisation of the control is done using the following properties:

tintColor

The tintColor property (which you can also set in Interface Builder) sets the overall colour of the control, including the colour of the line, the two handles, and the labels.

It is safe to change the tintColor at any time, if the control is currently visible the colour change will be animated into the new colour.

tintColorBetweenHandles

The tintColorBetweenHandles property sets the color of the line between the two handles.

minValue

The minimum possible value to select in the range

maxValue

The maximum possible value to select in the range

selectedMinimum

The preselected minumum value (note: This should be less than the selectedMaximum)

selectedMaximum

The preselected maximum value (note: This should be greater than the selectedMinimum)

numberFormatterOverride

Each handle in the slider has a label above it showing the current selected value. By default, this is displayed as a decimal format.

You can override this default here by supplying your own NSNumberFormatter. For example, you could supply an NSNumberFormatter that has a currency style, or a prefix or suffix.

If this property is nil, the default decimal format will be used. Note: If you want no labels at all, set this value to be (NSNumberFormatter *)[NSNull null] (as opposed to nil), to specifically mark that you want no labels

hideLabels

When set to YES the labels above the slider controls will be hidden. Default is NO.

minDistance

The minimum distance the two selected slider values must be apart. -1 for no minimum. Default is -1.

maxDistance

The maximum distance the two selected slider values must be apart. -1 for no maximum. Default is -1.

minLabelColour

The colour of the minimum value text label. If not set, the default is the tintColor.

maxLabelColour

The colour of the maximum value text label. If not set, the default is the tintColor.

disableRange

If true, the control will mimic a normal slider and have only one handle rather than a range.

In this case, the selectedMinValue will be not functional anymore. Use selectedMaxValue instead to determine the value the user has selected.

enableStep

If true the control will snap to point at each step (property) between minValue and maxValue. Default value is disabled.

step

If enableStep is true, this controls the value of each step. E.g. if this value is 20, the control will snap to values 20,40,60...etc. Set this is you enable the enableStep property.

handleImage

If set the image passed will be used for the handles.

handleColor

If set it will update the color of the handles. Default is tintColor.

handleDiameter

If set it will update the size of the handles. Default is 16.0.

selectedHandleDiameterMultiplier

If set it update the scaling factor of the handle when selected. Default is 1.7. If you don't want any scaling, set it to 1.0.

lineHeight

Set the height of the line. It will automatically round the corners. If not specified, the default value will be 1.0.

lineBorderWidth

Sets an optional border on the outer lines (not the line inside the range) of the slider. Default is 0.

lineBorderColor

If lineBorderWidth, set the colour of the line here.

handleBorderColor

If set it will update the color of the handle borders. Default is tintColor.

handleBorderWidth

If set it will update the size of the handle borders. Default is 0.0

labelPadding

If set it will update the size of the padding between label and handle. Default is 8.0

Author

Tom Thorpe

License

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

ttrangeslider's People

Contributors

696grocuttt avatar alasker avatar andrewbellay avatar andreyvit avatar cameroncooke avatar chingjun avatar claudiotsm avatar codiophile avatar corentinfoure avatar dangthaison91 avatar ened avatar felipowsky avatar fiantinangon avatar finalevil avatar ftp27 avatar guillaumealgis avatar holgersindbaek avatar jonathantron avatar livoras avatar lpenaflor avatar rameezhandel avatar readmecritic avatar redcapua avatar relevante avatar statemachinejunkie avatar templeman15 avatar tomthorpe avatar vortec4800 avatar

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

ttrangeslider's Issues

Accessing text labels

Hello,

I'm using your library, it's awesome and fits all my needs. I wanted to ask is there any possibility to access text label in order to change text?

One more note, I'm using slider via bridging header and swift.

Color changes when opening action sheet.

I am using the slider in a view that has an action sheet. When opening the action sheet the color of the slider line and the handles changes. Only the slider line between the handles doesn't change. When closing, the color changes back to the tint color that I had set, but I set a custom color for the handles and I don't want to use the tint color for the handles.

Preferably, opening an action sheet shouldn't change the colors, but at the very least, the colors shouldn't permanently change after closing the action sheet.

initialState problem

Hi... I am using TTRangeSlider in my app. I am instering the state of the TTrangeslider (min, max) to a table in FMDB in order to preserve its state whenever the users open the app again...
However, I am having problem with it. The delegate always update it to 10,90.. I checked the TTRangeSlider.m file and in that class, u set these values as selectedmin and selectedmax in initialiseControl method.
Now i ask that how could i request an sql selection in TTRanfeSlider class and set the selectedmin and selectedmax values to the values in the table?
Thanks

TTRangeSlider not work in Swift

I tried to import TTRangeSlider in my Swift project but unfortunately not work. Give error the file for TTRangeSlider.h not found in Bridge Header

Handle size width, height or maybe custom view?

I can change only circle diameter with "handleDiameter".
But if I want square, parallelogram or other figure? I can change it in code but will be great to use custom view for handle.

Thanks a lot.

TTRangeSliderDelegate It not Working

How to get Min Max Value at the Sliding time please help me
I have to try this by using below code but it's never called...

public func rangeSlider(_ sender: TTRangeSlider!, didChangeSelectedMinimumValue selectedMinimum: Float, andMaximumValue selectedMaximum: Float) {
print(selectedMinimum)
print(selectedMaximum)
// updateLabelsValues(selectedMinimum, max: selectedMaximum)
}

And I have Also Extent my class by TTRangeSliderDelegate

Thanks in Advance.

Slider freeze issue.

Hi.
The Slider control are very useful, and very nice.
But I found an issue.
If I open several viewcontrollers, the slider is working on first viewcontroller without no issue, but on top viewcontroller slider freeze, and animate irregularly.
For example, I push 3 viewcontrollers. then on the first viewcontroller is working fine, but on the third controller is not working well.
Can you fix the issue?
Thanks.

Implement init method

I cannot use it with PureLayout because initForAutolayout calls init on UIViews. Could you implement init method?

Implement intrinsicContentSize

It would be good to implement intrinsicContentSize. My current use case is self-sizing cells, for the time being I have to manually fix the height of range slider, but I guess control could do that itself.

When 'minDistance' isn't set, TTRangeSlider redraw bug

This happens when minDistance isn't set and an alert controller is presented/dismissed within the view controller.

screen shot 2016-05-03 at 3 16 18 pm

I have 5 UITableViewCells, each having a TTRangeSlider inside of it within scope; some have a min/max range on the control and some don't. This happens to all of the range sliders within each cell when we present a UIAlertController and the user dismisses it (presses OK).

I prevented this by forcing the 'minDistance' property, with a default value of zero for the controls that we do not use to enforce but curious if anyone has experienced this issue themselves?

Changing the thumb image differently

hello sir,
its really nice and easy to use library for ranging with a awesome animation but as you have describe to change the thumb image which changes both the thumb image, so is it possible to change the first and second thumb image differently for the first thumb image will be x.png and second will be y.png

any suggesting will always be helpful
Thank you

How to set time range?

Thanks for the awesome TTRangeSlider. But can you tell me how to set time range?
like 10:00 AM to 10:00 PM

Breaking Interface Builder

***.xib: error: IB Designables: Failed to render and update auto layout status for UIView (i5M-Pr-FkT): dlopen(TTRangeSlider.framework, 1): no suitable image found. Did find:
TTRangeSlider.framework: required code signature missing for 'TTRangeSlider.framework'

Detect change value

How to detect value change in Range Slider?
Add target for value changed does not work.

Some properties are not public

At least handleBorderWidth and handleBorderColor are not accessible with pod integration.
It must be because they are not explicitly public, and btw, internal by default.

non-linear steps

I was trying to figure out how to add this in a PR, but couldn't see where is best

If the min,max is 1 and 100,000,000 and I want to pick a range for 1 to 100, it is hard.

if the steps are not linear or exponential, smaller selected values get a finer resolution than the higher values

similarly, might be also good to input an array of not even steps like [1,12,100,400,1000,10000,123545, 100000] for possible options to choose instead of linear steps or step by 1

Urgent Question

hello thank you for this good library but i have question possible to set min value on right side and max value on the left side ?

Best Regards

lbl position erro

when I enable the step, I set the selectedMinValue and selectedMaxValue, which they only in one step,the left label position is always at originPosttion.

Cocoapods, iOS 7 and IBDesignable

Hey,

due to the issue in cocapods (tobihagemann/THLabel#28) IBDesignables would not work in projects with iOS Version <= 7. Other projects maintain a branch without IBDesignables integrated.

Can you pls do the same? The compile error in Interface builder really makes problems :-(

Slider not working

Hello! Just installed the pod and an UIView, set its class to TTRangeSlider. The problem is that when i want to change the value the slider its glitchy and does not slide more than 5-6 units with the animation on the slider thumb staying zoomed in. Do you have any ideas why this is happening?

Slider gets laggy on large numbers

I tried to use the slider with 1,000 as min value and 5,000 as max value, and the sliding process is so laggy 😐 is the valid max range only 0 to 100?

Thanks in advance! 😄

Handle stays enlarged when tapped during drag of parent view

As the title says, if you tap a handle during drag of parent view, it will stay enlarged until tapped or dragged again.

Steps to reproduce:

  1. Create ViewController with ScrollView and ContentView
  2. Add TTRangeSlider to ContentView
  3. Enable alwaysBounceVertical on ScrollView
  4. Drag ScrollView up or down to bounce it and while it returns to original position, try to tap or drag a handle

Feature request: Shadow support for handles

Really impressed with this library, love the attention to detail.

Just one feature missing for me is the ability to add a shadow to the handles. Just needed to expose those CALayer properties and this would be perfect.

Thanks.

BUG: minLabel does not reappear after re-enabling range.

First off, thanks for a very nice project. Secondly, I could see this being a low priority since it might be a bit of an edge case.

My use case involves another UI element that toggles on and off the range functionality of TTRangeSlider. Think of a switch that just toggles the disableRange property of TTRangeSlider.

Repro Steps:

  1. Setup TTRangeSlider with the disableRange left at the defaults value of false.
  2. Set disableRange to true.
  3. Set disableRange back to false.

What happens:
The min handle reappears but the minLabel does not.

UI Feature Request

This is not functional but mostly UI -

Have the range between the min and max to be in a custom color and maybe thicker

Improvement in handles

There are two handles. The minimum and maximum. If I want to set two different images to both of them like minus icon and plus icon, I can't.

Vertical position and change label

  1. When I try to rotate Slider from horizontal to vertical position, it is stop working.
    Perhaps it depends from gesture recognizer?
  2. I want to change label and add % or some other value. How can I do that?

PS. Thanks a lot for the great work and TTRangeSlider.

Label positions problem

If a range between selectedMinimum and selectedMaximum is very small, labels position are incorrect. This situation happened when I have created cell from a nib with TTRangeSlider with my own minValue, maxValue, selectedMinimum and selectedMaximum. But if the range between selectedMinimum and selectedMaximum are bigger, all is correct.

incorrect
correct

Init with frame

When use it programmatically rightHandle is not shown and seems like the slideeLine width is greater than screen size

here is my code
self.rangeSlider = [[TTRangeSlider alloc] initWithFrame:CGRectMake(0, 0, self.rangeSliderContainer.frame.size.width, self.rangeSliderContainer.frame.size.height)];
[self.rangeSliderContainer addSubview:self.rangeSlider];
self.rangeSlider.delegate = self;
self.rangeSlider.minValue = attribute.minimum;
self.rangeSlider.maxValue = max;
self.rangeSlider.selectedMinimum = currentMin;
self.rangeSlider.selectedMaximum = currentMax;
self.rangeSlider.step = attribute.sliderSteps ? attribute.sliderSteps : 1;
self.rangeSlider.enableStep = YES;

untitled 2

Non-continuous callback

Is there a way to not get continuous callback when the slider is changed? I want to the delegate method to be fired only when the finger is released from slider.

Improvements

Hi,

First of all great control, really love it. I'd like to suggest to introduce blocks API and a flag to fix min and max labels on corresponding sides of control.

Cheers,
Andrej

Please fix divide by 0

In TTRangeSlider.m, line 315, you have:

if (self.enableStep && self.step>=0.0f){
_selectedMinimum = roundf(self.selectedMinimum/self.step)_self.step;
_selectedMaximum = roundf(self.selectedMaximum/self.step)_self.step;
}

If self.step == 0.0, then there is a divide by zero setting selectMinimum and selectMaximum to NaN.
Hope this helped.

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.