導(dǎo)語:

之前公司在做一個應(yīng)急的項目，需要是在首頁做一個類似建行轉(zhuǎn)盤手動滾動的視圖，網(wǎng)上大部分都是安卓的demo，于是參考其思想寫了一份iOS版的建行轉(zhuǎn)盤效果。

1.實現(xiàn)思路

1.自定義一個UIView，view里添加button控件；
2.給父視圖添加一個UIPanGestureRecognizer手勢，根據(jù)手勢的狀態(tài)來獲取用戶的觸摸位置和旋轉(zhuǎn)弧度，刷新UI。

gif5新文件.gif

2.具體實現(xiàn)代碼

給外界提供一個方法(需要子控件button對應(yīng)的圖片、文字以及中心圖片)

#pragma mark - 轉(zhuǎn)動手勢
- (void)zhuanPgr:(UIPanGestureRecognizer *)pgr{
    if(pgr.state==UIGestureRecognizerStateBegan) { //開始時重置mTmpAngle和觸摸開始時間
        mTmpAngle = 0;
        beginPoint = [pgr locationInView:self];//第一觸碰點
        startTouchDate = [NSDate date];

    } else if (pgr.state == UIGestureRecognizerStateChanged) { //獲取觸摸點所在的區(qū)間來計算旋轉(zhuǎn)的角度和抬起時旋轉(zhuǎn)的角度，不斷去改變mStartAngle，更新UI
        float StartAngleLast = mStartAngle;
        movePoint= [pgr locationInView:self]; //第二觸碰點
        float start = [self getAngle:beginPoint];   //獲得起始弧度
        float end = [self getAngle:movePoint];     //結(jié)束弧度
        
        if ([self getQuadrant:movePoint] == 1 || [self getQuadrant:movePoint] == 4) {
            mStartAngle += end - start;
            mTmpAngle += end - start;
        } else { // 二、三象限，角度值是負(fù)值
            mStartAngle += start - end;
            mTmpAngle += start - end;
        }
        [self layoutBtn];
        
        beginPoint = movePoint;
        speed = mStartAngle - StartAngleLast;

    } else if (pgr.state==UIGestureRecognizerStateEnded) {  // 計算每秒移動的角度，如果達(dá)到mFlingableValue的大小，則認(rèn)為需要自動滾動
        NSTimeInterval time= [[NSDate date] timeIntervalSinceDate:startTouchDate];
        anglePerSecond = mTmpAngle*50/ time;
   
        if (fabsf(anglePerSecond) > mFlingableValue && !_isPlaying) {
            _isPlaying = YES;
            flowtime = [NSTimer scheduledTimerWithTimeInterval:0.02 target:self selector:@selector(autoflow) userInfo:nil repeats:YES];
        }
    }
}

//根據(jù)觸摸的位置，計算角度 
- (float)getAngle:(CGPoint)point {
    double x = point.x - mRadius;
    double y = point.y - mRadius;
    return (float) (asin(y / hypot(x, y)));
}

/**
 * 根據(jù)當(dāng)前位置計算象限
 *
 * @return point
 */
- (int)getQuadrant:(CGPoint) point {
    int tmpX = (int) (point.x - mRadius);
    int tmpY = (int) (point.y - mRadius);
    if (tmpX >= 0) {
        return tmpY >= 0 ? 1 : 4;
    } else {
        return tmpY >= 0 ? 2 : 3;
    }
}
///自動滾動
- (void) autoflow {
    if ( fabs(speed) < 0.001 ) {//如果速度小于一定的值則結(jié)束滾動，關(guān)閉定時器
        _isPlaying = false;
        [flowtime invalidate];
        flowtime = nil;
        return;
    }
    
    // 不斷改變mStartAngle，更新UI
    mStartAngle += speed ;
    speed = speed/1.05;
    [self layoutBtn];
}

///更新子控件UI
- (void)layoutBtn {
        for (NSInteger i = 0; i<_numOfSubView ;i++) {
            CGFloat centerY= _frame.size.height/2 + sin((i/_numOfSubView)*M_PI*2+mStartAngle) * (self.frame.size.width/2 - _subViewSize.width/2 - margin);
            CGFloat centerX=_frame.size.height/2 + cos((i/_numOfSubView)*M_PI*2+mStartAngle) * (self.frame.size.width/2 - _subViewSize.width/2 - margin);
            UIButton *button=[btnArray objectAtIndex:i];
            button.center=CGPointMake(centerX, centerY);
        }
}

參考鏈接 Andorid建行轉(zhuǎn)盤