어떻게 완전한 iOS 생방송 앱을 신속하게 개발합니까] (좋아요 기능)

클라이언트 코드

  • 작은 하트를 누르면 socket을 서버에 보내고 방 키를 서버에 전달하며 어느 아나운서에게 좋아요를 누르는지 알려주면 대응하는 그룹 socket에 전송됩니다
  • 방 키를 어떻게 전달하는지, 방 키는 아나운서 인터페이스에 있고 일반적인 클라이언트가 한 방만 만들어서 socket 대상에 기록할 수 있다
  • 업무 논리: 사용자가 작은 하트를 누르면 작은 하트가 위로 천천히 떠오른다..
  • 실현 원리: 사실은 애니메이션..
  • 어떻게 실현: UIVIew로는 할 수 없다. 왜냐하면 작은 붉은 마음은 불규칙한 좌우 진동이기 때문에 천천히 올라간다..
  • 핵심 애니메이션(CALayer 만들기), CABasicAnimation, CAKeyframeAnimation을 사용하여 그룹 그룹에 배치할 수 있습니다
  • CABasicAnimation: 애니메이션을 점점 표시하고 투명도를 수정합니다
  • CAKeyframeAnimation: 경로 애니메이션을 해서 작은 붉은 마음의 경로를 묘사하고 이 경로를 따라 가세요.
  • x는 너비에서 무작위 값을 얻고 y값은 매번 감소합니다

  • 애니메이션이 완성되었습니다. 제거하는 것을 기억하십시오. 애니메이션 사무류로 애니메이션이 완성되었는지 감청할 수 있습니다. 코드는 반드시 맨 앞에 두어야 합니다
  • XMGLiveOverlayViewController.m
    
    - (IBAction)clickUpvote:(id)sender {
        
        //  
        [[SocketIOClient clientSocket] emit:@"upvote" with:@[[SocketIOClient clientSocket].roomKey]];
        
    }
    
    
    XMGUpVoteViewController.m
    - (void)viewDidLoad {
        [super viewDidLoad];
        // Do any additional setup after loading the view.
        
        [[SocketIOClient clientSocket] on:@"upvote" callback:^(NSArray * _Nonnull data, SocketAckEmitter * _Nonnull ack) {
           //  , 
            [self setupVoteLayer];
        }];
        
    }
    
    - (void)setupVoteLayer
    {
        CALayer *layer = [CALayer layer];
        layer.contents = (id)[UIImage imageNamed:@"hearts (1)"].CGImage;
        [self.view.layer addSublayer:layer];
        layer.bounds = CGRectMake(0, 0, 30, 30);
        layer.position = CGPointMake(self.view.width * 0.5, self.view.height);
        
        [self setupAnim:layer];
    }
    
    - (void)setupAnim:(CALayer *)layer
    {
        [CATransaction begin];
        
        [CATransaction setCompletionBlock:^{
            [layer removeAllAnimations];
            [layer removeFromSuperlayer];
        }];
        
        //  basic 
        CABasicAnimation *alphaAnim = [CABasicAnimation animation];
        alphaAnim.keyPath = @"alpha";
        alphaAnim.fromValue = @0;
        alphaAnim.toValue = @1;
        
        //  
        CAKeyframeAnimation *pathAnim = [CAKeyframeAnimation animation];
        pathAnim.keyPath = @"position";
        pathAnim.path = [self animPath].CGPath;
        
        
        //  
        CAAnimationGroup *group = [CAAnimationGroup animation];
        group.animations = @[alphaAnim,pathAnim];
        group.duration = 5;
        [layer addAnimation:group forKey:nil];
        
        
        
        [CATransaction commit];
    }
    
    
    - (UIBezierPath *)animPath
    {
        UIBezierPath *path = [UIBezierPath bezierPath];
        
        CGFloat y = self.view.height;
        CGFloat x = self.view.width * 0.5;
        while (y > 0) {
            x = arc4random_uniform(self.view.width - 20) + 20;
            if (y == self.view.height) {
                [path moveToPoint:CGPointMake(x, y)];
            } else {
                [path addLineToPoint:CGPointMake(x, y)];
            }
            y -= 20;
        }
        
        
        return path;
    }

    작가: 원봉
    링크:https://www.jianshu.com/p/ac17fe0af5ae
    출처: 약서
    저작권은 작가의 소유이다.상업 전재는 작가에게 연락하여 권한을 얻으십시오. 비상업 전재는 출처를 밝히십시오.

    좋은 웹페이지 즐겨찾기