how to create a slider?

Question

How can I create a slider in customized slider in iPhone. Currently I am using the slider selected from "xib"(Interface Builder) but it is showing me normal slider.But I need slider with customized with my own button and showing text

Slide To Start

How can I do this please help me out .

possible duplicate of [UISlider, slide to unlock](http://stackoverflow.com/questions/816891/uislider-slide-to-unlock) — Brad Larson, Dec 08 '11 at 17:19

score 1 · Answer 1 · edited May 23 '17 at 11:43

1

See following links http://www.applausible.com/blog/?p=250

http://iphone4developer.blogspot.com/2010/12/custom-uislider.html

Change iPhone UISlider bar image

http://jainmarket.blogspot.com/2010/06/customize-default-uislider-in-iphone.html

http://www.xprogress.com/post-35-uislider-tutorial-example-how-to-use-slider-in-iphone-sdk-xcode/

http://www.obsessivecode.com/projects/ocprogress/

edited May 23 '17 at 11:43

Community

1
1

answered Aug 30 '11 at 07:56

Tirth

7,801
9
55
88

score 0 · Answer 2 · edited Jul 04 '12 at 17:51

UISlider *objslider = [[UISlider alloc] initWithFrame:CGRectMake(14, 249, 290, 22)];

UIImage *stetchLeftTrack = [[UIImage imageNamed:@"slider_fill.png"] stretchableImageWithLeftCapWidth:0.0 topCapHeight:0.0];

UIImage *stetchRightTrack = [[UIImage imageNamed:@"slider.png"]
                                 stretchableImageWithLeftCapWidth:0.0 topCapHeight:0.0];

[objslider setThumbImage: [UIImage imageNamed:@"slider_ball.png"]forState:UIControlStateNormal];

[objslider setMinimumTrackImage:stetchLeftTrack forState:UIControlStateNormal];

[objslider setMaximumTrackImage:stetchRightTrack forState:UIControlStateNormal];

objslider.minimumValue = 0.0;

objslider.maximumValue = 100.0;

objslider.continuous = YES;

objslider.value = 0.0;

[self.view addSubview:objslider];

score 0 · Accepted Answer · edited Aug 30 '11 at 08:27

you can accomplish like

UISlider *mySlider;
mySlider = [[UISlider alloc]init];
/* Slider Customization */
[mySlider setThumbImage:[UIImage imageNamed:@"yourimage.png"] forState:UIControlStateNormal];
/*the above line will sets a custom image for your slider ball i.e; thumb image*/

/* the below code will make your slider line custom */
UIImage *sliderLeftTrackImage = [[UIImage imageNamed: @"lineImage.png"] stretchableImageWithLeftCapWidth: 9 topCapHeight: 0];
UIImage *sliderRightTrackImage = [[UIImage imageNamed: @"lineImage.png"] stretchableImageWithLeftCapWidth: 9 topCapHeight: 0];

[mySlider setMinimumTrackImage: sliderLeftTrackImage forState: UIControlStateNormal];
[mySlider setMaximumTrackImage: sliderRightTrackImage forState: UIControlStateNormal];
/* end of Slider Customization */
[mySlider release];

score 0 · Answer 4 · answered Aug 30 '11 at 08:13

You will need to use stretchable images for the customization, and load them with the following methods:

setMinimumTrackImage:forState:
setMaximumTrackImage:forState:
setThumbImage:forState:

The minimum track image is the part on the left of the thumb (by default colored blue), and the maximum track image is on the right side.

Here is an example for the customization:

UIImage *minimumTrackImage = [UIImage imageNamed:@"sliderMin.png"];
UIImage *stretchableMinimumTrackImage = [minimumTrackImage stretchableImageWithLeftCapWidth:6 topCapHeight:6];
[slider setMinimumTrackImage:stretchableMinimumTrackImage forState:UIControlStateNormal];

UIImage *maximumTrackImage = [UIImage imageNamed:@"sliderMax.png"];
UIImage *stretchableMaximumTrackImage = [maximumTrackImage stretchableImageWithLeftCapWidth:6 topCapHeight:6];
[slider setMaximumTrackImage:stretchableMaximumTrackImage forState:UIControlStateNormal];

UIImage *handle = [UIImage imageNamed:@"sliderHandle.png"];

[slider setThumbImage:handle forState:UIControlStateNormal];

how to create a slider?

4 Answers4