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

2018-03-04  本文已影响0人  PengCL

大家无论在玩王者荣耀,还是绝地求生等升级版的游戏时,都会遇到游戏操作控制盘。

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

基于此,定义: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

效果图如下:


screenshot.png Simulator Screen Shot - iPhone 8 Plus - 2018-03-04 at 22.43.55.png
上一篇 下一篇

猜你喜欢

热点阅读