iOS 简易游戏操作控制盘设计

大家无论在玩王者荣耀，还是绝地求生。刺激战场等手机版的游戏时，都会遇到游戏操作控制盘。

基于此，个人开发了一个简易的操作盘，主要包括两个部分：操作控制台背景 和 中间操作圆球。

基于此，定义：consoleBGImageView，放置一张初始Image；定义中间操作圆球为：rotateButton

通过约束条件，来控制rotateButton只能在consoleBGImageView范围内转动

通过UIPanGestureRecognizer添加rotateButton拖动手势，当转动到不同的方向时，修改相应的背景图，这样可以知道转动到哪个方向。

通过如下代码，控制手指触碰的点限制在圆盘内部

 

-(void)rotateLocation:(CGPoint)pLocation {
    if([self IfYuntaiViewIsIntheBigView:pLocation]){
        self.rotateButton.center = CGPointMake(pLocation.x, pLocation.y);
        
        CGPoint tranPoint = CGPointMake(pLocation.x - centerViewX, pLocation.y - centerViewY);
        ELPCircleConsoleMoveDirection direction = [self determineCameraDirection:tranPoint];
        currentDirection = direction;
    } else {
        CGFloat radius = self.traceView.size.width * 0.5;
        CGPoint pointc = self.consoleBGImageView.center;
        CGPoint changePoint = [self CirclePoint:radius withCenterCircle:pointc withCurrentPoint:pLocation];
        
        self.rotateButton.center = CGPointMake(changePoint.x, changePoint.y);
        
        CGPoint tranPoint = CGPointMake(changePoint.x - centerViewX, changePoint.y - centerViewY);
        ELPCircleConsoleMoveDirection direction = [self determineCameraDirection:tranPoint];
        currentDirection = direction;
    }
    
    CGFloat xValue = fabs(self.rotateButton.centerX - centerViewX);
    CGFloat yValue = fabs(self.rotateButton.centerY - centerViewY);
    
    CGFloat currentRadiusValue = xValue * xValue + yValue * yValue;
    CGFloat bgImgRadiusWith = self.consoleBGImageView.width * 0.5 * 0.5;
    if(currentRadiusValue > bgImgRadiusWith * bgImgRadiusWith * 0.6) {
        [self sendRotateButtonRotateCmd];
    } else {
        [self resumBackgroundImgToNormal];
    }
}

 

效果图如下：

 

 

 

 

 

详细代码详见如下链接，如果对你有帮助，麻烦star一个，谢谢。

https://github.com/ElsonPeng/ELPCircleConsoleView