Giter VIP home page Giter VIP logo

mmsegmentslider's Introduction

MMSegmentSlider

Pod Platform Pod License Pod Version Carthage compatible Travis build

MMSegmentSlider is an easy-to-use IBDesignable animated slider for iOS 7+ written in Objective-C.

MMSegmentSlider

Installation

From CocoaPods

CocoaPods is a dependency manager for Objective-C, which automates and simplifies the process of using 3rd-party libraries like MMSegmentSlider in your projects. First, add the following line to your Podfile:

pod 'MMSegmentSlider'

If you want to use the latest features of MMSegmentSlider use normal external source dependencies.

pod 'MMSegmentSlider', :git => 'https://github.com/MedvedevMax/MMSegmentSlider'

This pulls from the master branch directly.

Second, install MMSegmentSlider into your project:

pod install

Carthage

Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks.

You can install Carthage with Homebrew using the following command:

$ brew update
$ brew install carthage

To integrate MMSegmentSlider into your Xcode project using Carthage, specify it in your Cartfile:

github "MedvedevMax/MMSegmentSlider"

Run carthage update to build the framework and drag the built MMSegmentSlider.framework (in Carthage/Build/iOS folder) into your Xcode project (Linked Frameworks and Libraries in Targets).

Manually

  • Drag the MMSegmentSlider folder into your project.
  • Enjoy it

Usage

(see sample Xcode project in /demo)

MMSegmentSlider is completely IBDesignable and IBInspectable. This means you can customise it right in the Interface Builder and see the changes immediately.

MMSegmentSlider

Interface Builder

The simplest way to use MMSegmentSlider is to add an empty view and set the class to MMSegmentSlider. Then you can customise its appearance right in the Attribute Inspector. Though you should note that the font for labels can only be customised from the code:

segmentSlider.labelsFont = [UIFont fontWithName:@"HelveticaNeue-Light" size:14.0f];

Using the code

You can also instantiate MMSegmentSlider like any other UIControl right from the code and use the following properties to change the look of the slider:

@property (nonatomic, strong) UIColor *basicColor;
@property (nonatomic, strong) UIColor *labelColor;
@property (nonatomic, strong) UIColor *selectedValueColor;
@property (nonatomic, strong) UIColor *selectedLabelColor;
@property (nonatomic) NSInteger circlesRadius;
@property (nonatomic) NSInteger textOffset;
@property (nonatomic, strong) UIFont *labelsFont;

Values and labels

To set values for items use:

segmentSlider.values = @[@"$19", @"$99", @"$199", @"$299"];

This values are not visible and will only be returned when you retrieve the selected value:

priceLabel.text = (NSString *)segmentSlider.currentValue;

To set labels for these values use:

segmentSlider.labels = @[@"1 month", @"6 months", @"1 year", @"2 years"];

You can also get the index of the selected item using the following property:

@property (nonatomic) NSInteger selectedItemIndex;

Note that it's not readonly, so you can change current value using it. If you want to animate changing use this method instead:

- (void)setSelectedItemIndex:(NSInteger)selectedItemIndex animated:(BOOL)animated;

License

MMSegmentSlider is distributed under the terms and conditions of the MIT license.

Credits

MMSegmentSlider is brought to you by Max Medvedev. If you're using MMSegmentSlider in your project, attribution would be very appreciated.

mmsegmentslider's People

Contributors

craftedbymax avatar rafaellage avatar

Watchers

 avatar

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.