模仿荷包的一個小小的滑動塊

一直在用荷包這App,感覺這個App整體真的不錯,一直想做一個滑塊,無意中看到這個,今天有時間就做了一個小Demo ,話不多說,上圖片。。。。

效果圖

EA680F65C7FE37C7036D814398DFBC5A.jpg

效果圖 

2.gif

部分代碼 自定義的CustomSlider.H

/** 回調 */
@property (nonatomic,copy)changeValueBlock block;

/**
 初始化

 @param frame       位置
 @param defaultIndx 默認選中那個點

 */
- (instancetype)initWithFrame:(CGRect)frame WithDefaultIndx:(CGFloat)defaultIndx WithDefaultPicName:(NSString *)PicNameStr;

部分代碼 自定義的CustomSlider.M

- (instancetype)initWithFrame:(CGRect)frame WithDefaultIndx:(CGFloat)defaultIndx WithDefaultPicName:(NSString *)PicNameStr
{
    if (self = [super initWithFrame:frame  ]) {
        picName = PicNameStr;
        [self setUpSubViews];
        self.defaultIndx=defaultIndx;
    }
    return self;
}

#pragma mark  ====================== 創建子控件 ======================
- (void)setUpSubViews
{
    UILabel * bgLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, CustomHeight/2,CustomWidth , 2)];
    bgLabel.backgroundColor = [UIColor orangeColor];
    bgLabel.userInteractionEnabled = YES;
    CGFloat smallLableWidth = PointWidth;
    for (int i =0; i< PointNum; i++) {
        UILabel * smallPoitLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0,8, 8)];
        smallPoitLabel.center = CGPointMake(DistanceWidth + (smallLableWidth * i) , 1);
        smallPoitLabel.layer.cornerRadius = 4;
        smallPoitLabel.clipsToBounds = YES;
        smallPoitLabel.backgroundColor =[UIColor orangeColor];
        [bgLabel addSubview:smallPoitLabel];

    }
    [self addSubview:bgLabel];

    //圖片
    UIImageView * sliderImageView = [[UIImageView alloc]initWithFrame:CGRectMake(0, CustomHeight/2 +1, 40, 40)];
    sliderImageView.image = [UIImage imageNamed:picName];
    [self addSubview:sliderImageView];
    self.sliderImageView = sliderImageView;

}


-(void)setDefaultIndx:(CGFloat)defaultIndx{
     CGFloat withPress=defaultIndx/(PointNum -1);
    //設置默認位置
    self.sliderImageView.center  = CGPointMake(DistanceWidth + (PointWidth)*(defaultIndx -1), CustomHeight/2 +1);
     _pointX=withPress*PointWidth;
    _sectionIndex=defaultIndx;
}



-(BOOL)beginTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{

    [self changePointX:touch];
    _pointX=_sectionIndex*(PointWidth) + DistanceWidth;
    [self refreshSliderFrame];
    return YES;
}

- (BOOL)continueTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{
   [self changePointX:touch];
   [self refreshSliderFrame];
   [self sendActionsForControlEvents:UIControlEventValueChanged];
    return YES;
}

-(void)endTrackingWithTouch:(UITouch *)touch withEvent:(UIEvent *)event{
   [self changePointX:touch];
   _pointX=_sectionIndex*(PointWidth) + DistanceWidth;
    if (self.block) {
        self.block((int)_sectionIndex);
    }
    [self refreshSliderFrame];

}

-(void)changePointX:(UITouch *)touch{

    CGPoint point = [touch locationInView:self];
    _pointX=point.x;
    if (point.x<DistanceWidth) {
        _pointX=DistanceWidth;
    }else if (point.x>CustomWidth - DistanceWidth ){
        _pointX=CustomWidth  - DistanceWidth;
    }
    //四舍五入
    double pX = (int)_pointX;
    double pY = (int)PointWidth;
    _sectionIndex= round(pX / pY);
}

-(void)refreshSliderFrame{
    [UIView animateWithDuration:0.5 animations:^{
        self.sliderImageView.center=CGPointMake(_pointX, CustomHeight/2 + 1);
    }];
}

部分代碼 控制器

CustomSlider * customSlider = [[CustomSlider alloc]initWithFrame:CGRectMake(20, 100,[UIScreen mainScreen].bounds.size.width-40 , 100) WithDefaultIndx:2 WithDefaultPicName:@"4"];
    customSlider.backgroundColor = [UIColor clearColor];
     customSlider.block = ^(int index){
        //做自己想做的事情
         NSLog(@"當前index-->>>==%d",index);

    };

    [self.view addSubview:customSlider];

來自：http://www.jianshu.com/p/44cce6d646ca