一對一直播系統開發如何在頁面內實現掃描二維碼功能

二維碼功能方便快捷，深受使用者喜愛，本文為大家簡單介紹，一對一直播系統開發想要實現在APP 內實現掃描二維碼功能，需要以下幾步。

 

一、 首先是二維碼的獲取和分析，需要一對一直播系統開發原始碼獲取手機攝像頭使用許可權，設定掃描範圍，進入二維碼介面後，會對介面進行初始化。

 

2.    // 1 、獲取攝像裝置

3.    AVCaptureDevice *device = [AVCaptureDevice defaultDeviceWithMediaType:AVMediaTypeVideo];

4.    

5.    // 2 、建立攝像裝置輸入流

6.    AVCaptureDeviceInput *deviceInput = [AVCaptureDeviceInput deviceInputWithDevice:device error:nil];

7.    

8.    // 3 、建立後設資料輸出流

9.    AVCaptureMetadataOutput *metadataOutput = [[AVCaptureMetadataOutput alloc] init];

10.    [metadataOutput setMetadataObjectsDelegate:self queue:dispatch_get_main_queue()];

11.    [metadataOutput setRectOfInterest:CGRectMake((self.view.frame.size.height - 220)*0.5/UIScreen.mainScreen.bounds.size.height,

12.                                          (self.view.frame.size.width - 220)*0.5/UIScreen.mainScreen.bounds.size.width,

13.                                          220/UIScreen.mainScreen.bounds.size.height,

14.                                          220/UIScreen.mainScreen.bounds.size.width)];

15.    // 設定掃描範圍（每一個取值 0 ～ 1 ，以螢幕右上角為座標原點）

16.    // 注：微信二維碼的掃描範圍是整個螢幕，這裡並沒有做處理（可不用設定） ;

17.    // 如需限制掃描框範圍，開啟下一句註釋程式碼並進行相應調整

18.    //    metadataOutput.rectOfInterest = CGRectMake(0.05, 0.2, 0.7, 0.6);

19.    

20.    // 4 、建立會話物件

21.    _session = [[AVCaptureSession alloc] init];

22.    // 並設定會話採集率

23.    _session.sessionPreset = AVCaptureSessionPreset1920x1080;

24.    

25.    // 5 、新增後設資料輸出流到會話物件

26.    [_session addOutput:metadataOutput];

27.    

28.    // 建立攝像資料輸出流並將其新增到會話物件上 ,  --> 用於識別光線強弱

29.    self.videoDataOutput = [[AVCaptureVideoDataOutput alloc] init];

30.    [_videoDataOutput setSampleBufferDelegate:self queue:dispatch_get_main_queue()];

31.    [_session addOutput:_videoDataOutput];

32.    

33.    // 6 、新增攝像裝置輸入流到會話物件

34.    [_session addInput:deviceInput];

35.    

36.    // 7 、設定資料輸出型別 ( 如下設定為條形碼和二維碼相容 ) ，需要將資料輸出新增到會話後，才能指定後設資料型別，否則會報錯

37.    metadataOutput.metadataObjectTypes = @[AVMetadataObjectTypeQRCode, AVMetadataObjectTypeEAN13Code,  AVMetadataObjectTypeEAN8Code, AVMetadataObjectTypeCode128Code];

38.    

39.    // 8 、例項化預覽圖層 , 用於顯示會話物件

40.    _videoPreviewLayer = [AVCaptureVideoPreviewLayer layerWithSession:_session];

41.    // 保持縱橫比；填充層邊界

42.    _videoPreviewLayer.videoGravity = AVLayerVideoGravityResizeAspectFill;

43.    CGFloat x = 0;

44.    CGFloat y = 0;

45.    CGFloat w = [UIScreen mainScreen].bounds.size.width;

46.    CGFloat h = [UIScreen mainScreen].bounds.size.height;

47.    _videoPreviewLayer.frame = CGRectMake(x, y, w, h);

48.    [self.view.layer insertSublayer:_videoPreviewLayer atIndex:0];

49.    

50.    // 9 、啟動會話

51.    [_session startRunning];

 

二、 新增一對一直播系統開發原始碼掃描塗層，設定掃描蒙版，檢測邊框、鏤空、二維碼圖示的四個角角落。

 

// 懵層

- (UIView *)hudView

{

    if (!_hudView) {

        _hudView = [[UIView alloc] initWithFrame:CGRectMake(0, 64+statusbarHeight, _window_width, _window_height-64-statusbarHeight)];

        CGFloat x = (self.view.frame.size.width - 220)*0.5;

        CGFloat y = (self.view.frame.size.height - 220)*0.4;

        CGFloat height = 220;

        // 鏤空

        CGRect qrRect = CGRectMake(x,y,height, height);

        UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:self.view.frame cornerRadius:0];

        UIBezierPath *circlePath = [UIBezierPath bezierPathWithRect:qrRect];

        [path appendPath:circlePath];

        [path setUsesEvenOddFillRule:YES];

        CAShapeLayer *fillLayer = [CAShapeLayer layer];

        fillLayer.path = path.CGPath;

        fillLayer.fillRule = kCAFillRuleEvenOdd;

        fillLayer.fillColor = [UIColor colorWithRed:0/255.0 green:0/255.0 blue:0/255.0 alpha:0.4].CGColor;

        fillLayer.opacity = 0.5;

        [_hudView.layer addSublayer:fillLayer];

        

        // 白色矩形

        UIBezierPath *bezierPath = [UIBezierPath bezierPathWithRect:CGRectMake(x, y, height, height)];

        CAShapeLayer *shapLayer = [CAShapeLayer layer];

        shapLayer.backgroundColor = UIColor.clearColor.CGColor;

        shapLayer.path = bezierPath.CGPath;

        shapLayer.lineWidth = 0.5;

        shapLayer.strokeColor = UIColor.whiteColor.CGColor;

        shapLayer.fillColor = UIColor.clearColor.CGColor;

        [_hudView.layer addSublayer:shapLayer];

        

        // 紅色四個角落

        UIBezierPath *cornerBezierPath = [UIBezierPath bezierPath];

        

        [cornerBezierPath moveToPoint:CGPointMake(x, y+30)];// 左上角

        [cornerBezierPath addLineToPoint:CGPointMake(x, y)];

        [cornerBezierPath addLineToPoint:CGPointMake(x+30, y)];

        

        [cornerBezierPath moveToPoint:CGPointMake(x+height-30, y)];// 右上角

        [cornerBezierPath addLineToPoint:CGPointMake(x+height, y)];

        [cornerBezierPath addLineToPoint:CGPointMake(x+height, y+30)];

        

        [cornerBezierPath moveToPoint:CGPointMake(x+height, y+height-30)];// 左上角

        [cornerBezierPath addLineToPoint:CGPointMake(x+height, y+height)];

        [cornerBezierPath addLineToPoint:CGPointMake(x+height-30, y+height)];

        

        [cornerBezierPath moveToPoint:CGPointMake(x+30, y+height)];// 左上角

        [cornerBezierPath addLineToPoint:CGPointMake(x, y+height)];

        [cornerBezierPath addLineToPoint:CGPointMake(x, y+height-30)];

        

        CAShapeLayer *cornerShapLayer = [CAShapeLayer layer];

        cornerShapLayer.backgroundColor = UIColor.clearColor.CGColor;

        cornerShapLayer.path = cornerBezierPath.CGPath;

        cornerShapLayer.lineWidth = 3.0;

        cornerShapLayer.strokeColor = [UIColor redColor].CGColor;

        cornerShapLayer.fillColor = UIColor.clearColor.CGColor;

        [_hudView.layer addSublayer:cornerShapLayer];

        

    }

    return _hudView;

}

 

三、 掃描完成，對掃描結果進行分析和處理。一般一對一直播原始碼的掃描結果分為兩種。

1、 掃描結果分析成功，跳轉相關頁面

2、 掃描結果解析失敗，顯示暫未識別出掃描結果。

 

- (void)captureOutput:(AVCaptureOutput *)captureOutput didOutputMetadataObjects:(NSArray *)metadataObjects fromConnection:(AVCaptureConnection *)connection {

    if (metadataObjects != nil && metadataObjects.count > 0) {

        AVMetadataMachineReadableCodeObject *obj = metadataObjects[0];

        NSDictionary *infoDic = [self convertJsonStringToNSDictionary:[obj stringValue]];

        NSLog(@"sweepcodeVC--------:%@",infoDic);

        if ([[infoDic valueForKey:@"scope"] isEqual:@"laolaiwang"]) {

            if ([minstr([[infoDic valueForKey:@"data"] valueForKey:@"type"]) isEqual:@"1"]) {

                [_session stopRunning] ;

                otherUserMsgVC  *person = [[otherUserMsgVC alloc]init];

                person.userID = minstr([[infoDic valueForKey:@"data"] valueForKey:@"uid"]);

                [self.navigationController pushViewController:person animated:YES];

            }else if ([minstr([[infoDic valueForKey:@"data"] valueForKey:@"type"]) isEqual:@"2"]){

                [self loginManagerWithDic:infoDic];

            }

 

        }

    } else {

        NSLog(@" 暫未識別出掃描的二維碼 ");

    }

}

 

以上就是一對一直播原始碼開發的掃描二維碼功能的大體流程實現，該功能對於提高使用者感受和方便使用者使用都有幫助，在萬物皆可掃一掃的時代背景下，開發這個功能能夠加強一對一直播原始碼開發增強社交性、互動性，滿足人們的社交需求。