Nik's
Nik's

Reputation: 690

how to create a slider?

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 .

Upvotes: 2

Views: 2903

Answers (4)

Hemant Dixit
Hemant Dixit

Reputation: 1145

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];

Upvotes: 0

George
George

Reputation: 352

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];

Upvotes: 0

antalkerekes
antalkerekes

Reputation: 2128

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];

Upvotes: 0

Related Questions