Applying Custom Slider in Interface Builder

Question

I want to create a custom slide, however I do not know how to apply it in IB.

.h

@interface MainViewController : UIViewController <AVAudioPlayerDelegate> {
    UISlider                *customSlider;
}

@property (nonatomic, retain, readonly) UISlider *customSlider;

@end

.m

#define kSliderHeight            7.0
#define kViewTag                1  

@implementation MainViewController

- (UISlider *)customSlider
{
    if (customSlider == nil)
    {
        CGRect frame = CGRectMake(174, 12.0, 120.0, kSliderHeight);
        customSlider = [[UISlider alloc] initWithFrame:frame];
        [customSlider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];
        customSlider.backgroundColor = [UIColor clearColor];   
        UIImage *stetchLeftTrack = [[UIImage imageNamed:@"orangeslide.png"]
                                    stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
        UIImage *stetchRightTrack = [[UIImage imageNamed:@"yellowslide.png"]
                                     stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
        [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;

        [customSlider setAccessibilityLabel:NSLocalizedString(@"CustomSlider", @"")];

        customSlider.tag = kViewTag;
    }
    return customSlider;
}

All I need to know is how I apply it in IB. As its an succesful build.

Thanks

Answer 1

You could make a custom class that is a subclass that inherits UISlider that does this setup in the init methods.

From there in interface builder just drop a normal UISlider in and on the Identity tab of the Inspector window change the class to your custom class.

in your MySlider.h:

@interface MySlider : UISlider
{

// Anything relevant you might want to change

}
@end

And in the .m file:

@implementation MySlider

- (id)init
{
    self = [super init];
    self.backgroundColor = [UIColor clearColor];   
        UIImage *stetchLeftTrack = [[UIImage imageNamed:@"orangeslide.png"]
                                    stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
        UIImage *stetchRightTrack = [[UIImage imageNamed:@"yellowslide.png"]
                                     stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0];
        [self setThumbImage: [UIImage imageNamed:@"slider_ball.png"] forState:UIControlStateNormal];
        [self setMinimumTrackImage:stetchLeftTrack forState:UIControlStateNormal];
        [self setMaximumTrackImage:stetchRightTrack forState:UIControlStateNormal];
        self.minimumValue = 0.0;
        self.maximumValue = 100.0;
        self.continuous = YES;
        self.value = 50.0;

        [self setAccessibilityLabel:NSLocalizedString(@"CustomSlider", @"")];

    return self;
}
@end