Friday, 24 February 2012

iPhone Development:Customize a UISlider in iphone sdk




Want to make a custom UISlider like shown in below image.

To made a  UISlider as shown in the figure, we can use given below code snippet




CGRect frame = CGRectMake(174, 12.0, 120.0, 40);
customSlider = [[UISlider alloc] initWithFrame:frame];
[customSlider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];
// in case the parent view draws with a custom color or gradient, use a transparent color
customSlider.backgroundColor = [UIColor clearColor];  
//giving image left track of UISlider
 UIImage *stetchLeftTrack = [[UIImage imageNamed:@"orangeslide.png"]                             stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];


//giving image right track of UISlider
UIImage *stetchRightTrack = [[UIImage imageNamed:@"yellowslide.png"]                              stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0]; 

stretchableImageWithLeftCapWidth, is deprecated, instead use resizableImageWithCapInsets


 UIImage *stetchLeftTrack = [[UIImage imageNamed:@"gray"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 10, 10, 0) resizingMode:UIImageResizingModeStretch];
        UIImage *stetchRightTrack = [[UIImage imageNamed:@"green"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0) resizingMode:UIImageResizingModeStretch];


//Setting thumb image for UISlider
[customSlider setThumbImage: [UIImage imageNamed:@"slider_ball.png"] forState:UIControlStateNormal];
[customSlider setMinimumTrackImage:stetchLeftTrack forState:UIControlStateNormal]; [customSlider setMaximumTrackImage:stetchRightTrack forState:UIControlStateNormal];
customSlider.minimumValue = 0.0;
customSlider.maximumValue = 100.0;
customSlider.continuous = YES;
customSlider.value = 50.0;
// Add an accessibility label that describes the slider.
[customSlider setAccessibilityLabel:NSLocalizedString(@"CustomSlider", @"")];  [self.view addSubview:customSlider]; customSlider.tag = 1;

No comments:
Write comments