欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

iOS 刻度尺 滑动标尺 横向标尺自定义控件

程序员文章站 2022-06-07 15:38:57
...

iOS 刻度尺 滑动标尺 横向标尺自定义控件


写在前面

项目中有需求,多个地方用到了不用样式的刻度尺,找了一些别人写的,感觉都不太符合需求。就想用collectionView自己定义一个。然后将所有的参数实现自定义,来满足项目中多个地方的不同使用。

使用方法

用collectionView自定义实现的滑动刻度尺控件,其中颜色、大小位置、对齐方式等等都可按照自己的需求可进行自定义。
以下为主要的使用方式:

 -(void)setupTwoRuler{

    // 变速区域
    LZDividingRulerView * rulerView = [[LZDividingRulerView alloc]initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.frame), 51)];
    //使用刻度尺常规模式
    rulerView.isCustomScalesValue = NO;
    //不显示刻度尺上的文案
    rulerView.isShowScaleText = NO;
    //显示刻度尺中当前值文案
    rulerView.isShowCurrentValue = YES;
    //最大值
    rulerView.maxValue = 1000000;
    //最小值
    rulerView.minValue = 100;
    //单元值
    rulerView.unitValue = 100;
    //默认值
    rulerView.defaultValue = 10100;
    //两个刻度文案之间的刻度格数
    rulerView.scalesCountBetweenScaleText = 5;

    //结束滚动
    [rulerView setDividingRulerDidEndScrollingBlock:^NSString *(CGFloat value) {
        return [NSString stringWithFormat:@"%.f",value];
    }];
    //滚动中
    [rulerView setDividingRulerDidScrollBlock:^NSString *(CGFloat value,CGPoint rulerContentOffset) {
        return [NSString stringWithFormat:@"%.f",value];
    }];
    [rulerView setFrame:CGRectMake(0, 160, CGRectGetWidth(self.view.frame), 52)];
    [rulerView updateRuler];
    [self.view addSubview:rulerView];
}

注意如果在修改参数,必须调用 [rulerView updateRuler]来刷新数据,否则不会生效。

本尺子主要分为两种类型来使用,通过isCustomScalesValue来控制:
第一种是知道最大值、最小值、单元值和默认值的类型,数值是根据单元刻度递增的。这种类型即传maxValue、minValue、unitValue、defaultValue来实现即可。
第二种是每个刻度格的数值变化为非递增关系的,比如是1/8,1/4,2/1,2,4,8这种格式。可以直接通过设定需要多少刻度格和默认选中的刻度格来实现。

然后讲下代码中的主要block回调:

主要分为三种回调,自定义刻度格式和常规刻度格式分别有三个回调:
常规格式的是:

//刻度尺在结束滑动时回调,参数为当前值,block返回值用于刻度尺中当前值显示,
//是否显示刻度尺中间当前值Label可用参数isShowCurrentValue控制
@property (nonatomic,copy)   NSString * (^dividingRulerDidEndScrollingBlock)(CGFloat value);
//刻度尺在滑动中回调,value为滑动中的当前值,offset为刻度尺的偏移量。block返回值用于刻度尺中当前值显示,
//是否显示刻度尺中间当前值Label可用参数isShowCurrentValue控制
@property (nonatomic,copy)   NSString *(^dividingRulerDidScrollBlock) (CGFloat value,CGPoint rulerContentOffset);
//刻度尺上文本显示内容回调,此回调的用途时,刻度尺里面只会给你返回当前的刻度格或者是当前值,然后让你自己来控制显示文本格式。 
//具体的间距几个刻度格来显示文本,可通过参数scalesCountBetweenLargeLine来控制。block返回值用于刻度尺中刻度上文案显示,
//是否显示刻度尺每个刻度上文案显示,可用参数isShowScaleText控制
@property (nonatomic,copy)   NSString *(^scaleTextFormatBlock)(CGFloat currentValue,NSInteger scaleIndex);

自定义刻度格式对应的三个分别是:

@property (nonatomic,copy)   NSString * (^customScaleTextFormatBlock)(CGFloat currentCalibrationIndex);
@property (nonatomic,copy)   NSString * (^dividingRulerCustomScaleDidEndScrollingBlock)(CGFloat index);
@property (nonatomic,copy)   NSString * (^dividingRulerCustomScaleDidScrollBlock)(CGFloat index);

最后

具体代码还是比较简单的,如果刻度尺的已有的功能无法满足你的需求,可直接在当前代码基础上进行修改。如果demo有帮助到你,不要吝啬你的star哦~
代码地址:https://github.com/FirstStepzz/DividingRuler.git