OC_UISlider

1,294 阅读2分钟

UISlider 是一个可以用来设置一个限定在一定范围内的值的UI控件。

UISlider示意图

上图为官方文档中的 UISlider 示意图,UISlider 包含以上几个部分,我们在设置 UISlider 的时候可以对这几个部分进行自定义。

UISlider 的常用属性

属性 类型 解释
value float 设置当前 UISlider 的所在的值
minimumValue float UISlider 可以滑动的最小值
maximumValue float UISlider 可以滑动的最大值
continuous BOOL 是否可以连续滑动,如果设置为 NO 就只会触发一次响应方法
minimumValueImage UIImage 设置不同状态下的最小值处的图片
maximumValueImage UIImage 设置不同状态下的最大值处的图片
minimumTrackTintColor UIColor 设置 Thumb 左侧的 Track 颜色
maximumTrackTintColor UIColor 设置 Thumb 右侧的 Track 颜色
currentMinimumTrackImage UIImage 只读,当前状态下的最小值处图片
currentMaximumTrackImage UIImage 只读,当前状态下的最大值处图片
thumbTintColor UIColor 设置 Thumb 的颜色
currentThumbImage UIImage 只读,当前状态下 Thumb 的图片

UISlider 的常用方法

  • 设置 UISlider 的值

- (void)setValue:(float)value animated:(BOOL)animated;

  • 获取 UISlider 在不同状态下的最小值图片

- (UIImage *)minimumTrackImageForState:(UIControlState)state;

  • 设置 UISlider 在不同状态下的最小值图片

- (void)setMinimumTrackImage:(UIImage *)image forState:(UIControlState)state;

  • 获取 UISlider 在不同状态下的最大值图片

- (UIImage *)maximumTrackImageForState:(UIControlState)state;

  • 设置 UISlider 在不同状态下的最大值图片

- (void)setMaximumTrackImage:(UIImage *)image forState:(UIControlState)state;

  • 获取 Thumb 在不同状态下的图片

- (UIImage *)thumbImageForState:(UIControlState)state;

  • 设置 Thumb 在不同状态下的图片

- (void)setThumbImage:(UIImage *)image forState:(UIControlState)state;

  • 获取最大值图片的尺寸

- (CGRect)maximumValueImageRectForBounds:(CGRect)bounds;

  • 获取最小值图片的尺寸

- (CGRect)minimumValueImageRectForBounds:(CGRect)bounds;

  • 获取 Track 的尺寸

- (CGRect)trackRectForBounds:(CGRect)bounds;

  • 获取 Thumb 的尺寸,这里 Boundsslider 的尺寸,trackRect 即为 track 尺寸, valuecurrentValue

- (CGRect)thumbRectForBounds:(CGRect)bounds trackRect:(CGRect)rect value:(float)value;

自定义UISlider技巧

在设置 maximumTrackImage/minimumTrackImage时,可以对图像进行拉伸操作。 在调用方法设置图片之前,我们可以调用以下方法来设置图片的拉伸区域:

- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;

这个方法的后两个参数可以设置这张图片被拉伸时左边和上放不被拉伸的尺寸,当图片被拉伸时,这个尺寸内的图像不被拉伸,而超过这范围的图像将被拉伸。