IFGCircularSlider 0.1.2

IFGCircularSlider 0.1.2

测试已测试
语言语言 Obj-CObjective C
许可 MIT
发布上次发布2015年9月

Emmanuel Merali维护。



  • Emmanuel Merali

用于 iOS 应用的可扩展圆形滑块。它从 https://github.com/eliotfowler/EFCircularSlider 克隆而来,仅仅是因为作者似乎不再维护此控件。

安装

在您的应用中使用 IFGCircularSlider 的最简单方法是通过 CocoaPods。有关更多信息,请参阅“入门”指南

Podfile

platform :ios, '7.0'
pod "IFGCircularSlider", "~> 0.1.0"

您还可以克隆项目并将 IFGCircularSlider/*.{h,m} 文件复制到您的项目中。

用法

为了将 IFGCircularSlider 添加到您的 UI 中,只需在 storyboard 中添加一个视图并设置类为 IFGCircularSlider。valueChanged 事件与其他控件一样可用。

或者,您可以在代码中添加 IFGCircularSlider

- (void)viewDidLoad {
    ...
    CGRect sliderFrame = CGRectMake(110, 150, 100, 100);
    IFGCircularSlider* circularSlider = [[IFGCircularSlider alloc] initWithFrame:sliderFrame];
    [slider addTarget:self action:@selector(newValue:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:circularSlider];
    ...
}

选项

IFGCircularSlider 被设计成非常容易定制和样式化。

属性

minimumValue:(float) - 默认: 0.0f

当滑块位于最顶部位置时,它将 currentValue 设置为这个值。

您可以通过以下操作设置最小值

circularSlider.minimumValue = 1.0f;

maximumValue:(float) - 默认 100.0f

随着 IFGCircularSlider,currentValue 随着顺时针拖动滑块而增加。因此,当滑块处于最顶部位置的左侧时,它将接近(但永远不会达到)这个值。

您可以通过以下操作设置最大值

circularSlider.minimumValue = 100.0f;

currentValue:(float) - 默认 0.0f

每当滑块改变位置时,此值将改变。它将是基于最小值和最大值属性的归一化值。

您可以通过以下操作获取 currentValue

float val = circularSlider.currentValue;

lineWidth:(int) - 默认 5

这决定了组成滑块的弧形的宽度。这将同时设置未填充的弧(背景)和显示滑块已滑过多少的弧形。当前,将 lineWidth 更改超过几像素会导致不良的副作用,主要是与手柄相关。

您可以通过以下操作修改 lineWidth

circularSlider.lineWidth = 6;

handleColor:(UIColor*) - 默认 [UIColor redColor]

滑块的手柄是您用手指拖动的部分。

使用以下内容修改手柄的颜色

CGFloat hue = ( arc4random() % 256 / 256.0 );
CGFloat saturation = ( arc4random() % 128 / 256.0 ) + 0.5;
CGFloat brightness = ( arc4random() % 128 / 256.0 ) + 0.5;

circularSlider.handleColor = [UIColor colorWithHue:hue saturation:saturation brightness:brightness alpha:1];

handleType:(IFGHandleType) - 默认 IFGSemiTransparentWhiteCircle

IFGCircularSlider提供了5种类型的手柄

  • CircularSliderHandleTypeSemiTransparentWhiteCircle
  • CircularSliderHandleTypeSemiTransparentBlackCircle
  • CircularSliderHandleTypeDoubleCircleWithOpenCenter
  • CircularSliderHandleTypeDoubleCircleWithClosedCenter
  • CircularSliderHandleTypeBigCircle

您可以使用以下内容更改handleType

circularSlider.handleType = CircularSliderHandleTypeDoubleCircleWithClosedCenter;

unfilledColor:(UIColor*) - 默认 [UIColor blackColor]

当滑块设置为最小值时,将显示此颜色。

您可以修改unfilledColor

circularSlider.unfilledColor = [UIColor purpleColor];

filledColor:(UIColor*) - 默认 [UIColor redColor]

这将是最小值和currentValue之间显示的颜色。

您可以修改filledColor

circularSlider.unfilledColor = [UIColor purpleColor];

labelFont:(UIFont*) - 默认 [UIFont systemFontOfSize:10.0f]

如果您决定设置内部标记标签(更多信息请向下滚动),则是标签将具有的字体。

您可以修改labelFont

circularSlider.labelFont = [UIFont systemFontOfSize:14.0f];

注意,如果没有传递您要添加的标签,则此将没有效果

snapToLabels:(BOOL) - 默认 NO

如果设置为YES,则在完成滑动后,滑块将自动跳转到最近的标签,并相应地将当前值设置为该标签处的值,而不是您拖动的位置。

您可以使用以下内容设置滑块跳转到标签

circularSlider.snapToLabels = YES;

注意,如果没有传递您要添加的标签,则此将没有效果

函数

-(void)setInnerMarkingLabels:(NSArray*)labels

您可以为此方法发送一个标签数组,它们将显示在滑块的内部。当前无法指定标签之间的间距,因此它们将均匀分布。如果您选择在滑块上包含标签,则可以设置标签的字体以及滑动值更改后是否应将滑块跳转到最近的标签位置。

第一个标签将出现在12点位置(如果是一个时钟的话)。

如果您想让滑块看起来像时钟,您可以这样做

NSArray* hoursArray = @[@"12", @"1", @"2", @"3", @"4", @"5", @"6", @"7", @"8", @"9", @"10", @"11"];
[circularSlider setInnerMarkingLabels:hoursArray];

闹钟演示设计

闹钟演示设计是从Dribbble上的Micael Sambora的设计实现版本,可以在这里找到。

关于Michael Sambora的更多信息可以在他的个人网站找到。

关于开发者

如果您喜欢此控件,请在Twitter上关注@EliotFowler并告诉我!

许可证(MIT)

版权(c)2015 Emmanuel Merali

本软件及其相关文档文件(以下简称“软件”)的副本使用人,经许可,免费使用该软件,并无限制地处理该软件,包括但不限于使用、复制、修改、合并、发布、分发、再许可和/或销售软件副本的权利,并允许将软件提供给他人进行上述操作,但前提是必须遵守以下条件:

上述版权声明和本许可声明应包含在软件的所有副本或实质性部分的副本中。

软件按“现状”提供,不提供任何形式的明示或暗示保证,包括但不限于适销性、适用于特定用途和侵犯版权的保证。在任何情况下,作者或版权所有者不对任何索赔、损害或其他责任负责,无论是因为合同、侵权或其他行为,不论索赔、损害或其他责任是由软件本身、使用或以其他方式与软件相关联而引起的。