iOS之AR开发--demo制作篇：图片识别

一时失言乱红尘 2022-06-14 19:59 249阅读 0赞

## 一、说明 ##

Wikitude 官方网址  [点击打开链接][Link 1]

*  wikitude使用javascript来控制AR的实现，因此，开发者必须要有一定的js基础。
 *  在制作demo之前，要获取wikitude的license，获取方式，我已经在[初始篇][Link 2]说过了，可以去了解一下。

## 二、提交自己的识别图和获取wtc文件 ##

1.  咱们上传的图片不能是透明的，具体要求，可以在下面的链接中查看，[点击进入][Link 3]。
2.  上传识别图，点击[这里][Link 4]进入。  
    
    
    ![1240][]  
    
    
    1.png
    
      
    
    
    ![1240 1][]  
    
    
    2.png
    
      
    
    
    ![1240 2][]  
    
    
    3.png
    
      
    
    
    ![1240 3][]  
    
    
    4.png
    
      
    
    
    ![1240 4][]  
    
    
    5.png
3.  ok,准备工作已经完成，开始在Xcode创建工程，上代码。

## 三、准备工作 ##

1.  创建新的工程
2.  引入WikitudeSDK.framework,并添加以下框架到工程中:
    
     *  Accelerate.framework
     *  AssetLibrary.framework
     *  AVFoundation.framework
     *  CFNetwork.framework
     *  CoreGraphics.framework
     *  CoreLocation.framework
     *  CoreMedia.framework
     *  CoreMotion.framework
     *  CoreVideo.framework
     *  JavaScriptCore.framework
     *  Foundation.framework
     *  MediaPlayer.framework
     *  OpenGLES.framework
     *  Photos.framework
     *  QuartzCore.framework
     *  SafariServices.framework
     *  Security.framework
     *  SystemConfiguration.framework
     *  UIKit.framework
     *  libc++.tbd
     *  libz.tbd
3.  设置Bulid Setting 中的Other Linker Flags，添加-Objc。
4.  在info.plist中设置访问摄像头的描述：Privacy - Camera Usage Description。
5.  引入wikitude的识别文件

![strip][]

添加识别文件.gif

1.  并替换01\_ImageRecognition\_1\_ImageOnTarget/assets 文件下的magazine.wtc为我们自己下载的wtc文件，并重新命名为magazine.wtc.

![strip 1][]

添加自己下载的wtc文件.gif

## 四、代码实现 ##

通过以上的配置，我们已经配置好了项目，并将自己生成的wtc文件添加到了项目中，下面就进行代码实现。

#import "ViewController.h"
    #import <WikitudeSDK/WikitudeSDK.h>
    #import <WikitudeSDK/WTArchitectViewDebugDelegate.h>
    @interface ViewController ( ) <WTArchitectViewDelegate, WTArchitectViewDebugDelegate>
    
    @property (nonatomic, strong) WTArchitectView           *architectView;
    
    @property (nonatomic, weak) WTNavigation                    *architectWorldNavigation;
    
    @end
    
    @implementation ViewController
    
    - (void)dealloc
    {
       //移除所有通知
        [[NSNotificationCenter defaultCenter] removeObserver:self];
    }
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        NSError *deviceSupportError = nil;
    /***WTArchitectView是现实的视图 @ WTFeature_ImageTracking:使WTArchitectView具有图片追踪的功能 **/
    
    //判断WTArchitectView是否具有图片追踪的功能
        if ( [WTArchitectView isDeviceSupportedForRequiredFeatures:WTFeature_ImageTracking error:&deviceSupportError] ) {
    
            self.architectView = [[WTArchitectView alloc] initWithFrame:CGRectZero motionManager:nil];
            self.architectView.delegate = self;
            self.architectView.debugDelegate = self;
    
            [self.architectView setLicenseKey:"此处是我们下载的license"];
    
    //载入识别文件
            NSURL *url=[[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html" subdirectory:@"01_ImageRecognition_1_ImageOnTarget"];
            self.architectWorldNavigation = [self.architectView
                                            loadArchitectWorldFromURL:url withRequiredFeatures:WTFeature_ImageTracking];
    
    
                [[NSNotificationCenter defaultCenter] addObserverForName:UIApplicationDidBecomeActiveNotification object:nil queue:[NSOperationQueue mainQueue] usingBlock:^(NSNotification *note) {
                    if (self.architectWorldNavigation.wasInterrupted) {
                    [self.architectView reloadArchitectWorld];
               }
                [self startWikitudeSDKRendering];
            }];
            [[NSNotificationCenter defaultCenter] addObserverForName:UIApplicationWillResignActiveNotification object:nil queue:[NSOperationQueue mainQueue] usingBlock:^(NSNotification *note) {
    
                /* Standard WTArchitectView rendering suspension when the application resignes active */
                [self stopWikitudeSDKRendering];
            }];
    
            /* Standard subview handling using Autolayout */
            [self.view addSubview:self.architectView];
            self.architectView.translatesAutoresizingMaskIntoConstraints = NO;
    
            NSDictionary *views = NSDictionaryOfVariableBindings(_architectView);
            [self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"|[_architectView]|" options:0 metrics:nil views:views] ];
            [self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_architectView]|" options:0 metrics:nil views:views] ];
        }
        else {
            NSLog(@"This device is not supported. Show either an alert or use this class method even before presenting the view controller that manages the WTArchitectView. Error: %@", [deviceSupportError localizedDescription]);
        }
    }
    
    #pragma mark - View Lifecycle
    - (void)viewWillAppear:(BOOL)animated {
        [super viewWillAppear:animated];
    
        self.tabBarItem.title=@"图片";
        [ self.tabBarItem setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor redColor], NSForegroundColorAttributeName, nil] forState:UIControlStateNormal];
        [ self.tabBarItem setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor greenColor], NSForegroundColorAttributeName, nil] forState:UIControlStateSelected];
        /* WTArchitectView rendering is started once the view controllers view will appear */
        [self startWikitudeSDKRendering];
    }
    
    - (void)viewDidDisappear:(BOOL)animated {
        [super viewDidDisappear:animated];
    
        /* WTArchitectView rendering is stopped once the view controllers view did disappear */
        [self stopWikitudeSDKRendering];
    }
    
    - (void)didReceiveMemoryWarning {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    #pragma mark - View Rotation
    - (BOOL)shouldAutorotate {
    
        return YES;
    }
    
    - (NSUInteger)supportedInterfaceOrientations {
    
        return UIInterfaceOrientationMaskAll;
    }
    
    - (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
    
        /* When the device orientation changes, specify if the WTArchitectView object should rotate as well */
        [self.architectView setShouldRotate:YES toInterfaceOrientation:toInterfaceOrientation];
    }
    
    #pragma mark - Private Methods
    
    /* Convenience methods to manage WTArchitectView rendering. */
    - (void)startWikitudeSDKRendering{
    
        /* To check if the WTArchitectView is currently rendering, the isRunning property can be used */
        if ( ![self.architectView isRunning] ) {
    
            /* To start WTArchitectView rendering and control the startup phase, the -start:completion method can be used */
            [self.architectView start:^(WTStartupConfiguration *configuration) {
    
    
                /* Use the configuration object to take control about the WTArchitectView startup phase */
                /* You can e.g. start with an active front camera instead of the default back camera */
    
                // configuration.captureDevicePosition = AVCaptureDevicePositionFront;
    
            } completion:^(BOOL isRunning, NSError *error) {
    
                /* The completion block is called right after the internal start method returns. NOTE: In case some requirements are not given, the WTArchitectView might not be started and returns NO for isRunning. To determine what caused the problem, the localized error description can be used. */
                if ( !isRunning ) {
                    NSLog(@"WTArchitectView could not be started. Reason: %@", [error localizedDescription]);
                }
            }];
        }
    }
    
    - (void)stopWikitudeSDKRendering {
    
        /* The stop method is blocking until the rendering and camera access is stopped */
        if ( [self.architectView isRunning] ) {
            [self.architectView stop];
        }
    }
    
    /* The WTArchitectView provides two delegates to interact with. */
    #pragma mark - Delegation
    
    /* The standard delegate can be used to get information about: * The Architect World loading progress * architectsdk:// protocol invocations using document.location inside JavaScript * Managing view capturing * Customizing view controller presentation that is triggered from the WTArchitectView */
    #pragma mark WTArchitectViewDelegate
    - (void)architectView:(WTArchitectView *)architectView didFinishLoadArchitectWorldNavigation:(WTNavigation *)navigation {
        /* Architect World did finish loading */
        NSLog(@"******originalURL=%@\n*****finalURL=%@",navigation.originalURL,navigation.finalURL);
    }
    
    - (void)architectView:(WTArchitectView *)architectView didFailToLoadArchitectWorldNavigation:(WTNavigation *)navigation withError:(NSError *)error {
    
        NSLog(@"Architect World from URL '%@' could not be loaded. Reason: %@", navigation.originalURL, [error localizedDescription]);
    }
    
    /* The debug delegate can be used to respond to internal issues, e.g. the user declined camera or GPS access. NOTE: The debug delegate method -architectView:didEncounterInternalWarning is currently not used. */
    #pragma mark WTArchitectViewDebugDelegate
    - (void)architectView:(WTArchitectView *)architectView didEncounterInternalWarning:(WTWarning *)warning {
    
        /* Intentionally Left Blank */
    }
    
    - (void)architectView:(WTArchitectView *)architectView didEncounterInternalError:(NSError *)error {
    
        NSLog(@"WTArchitectView encountered an internal error '%@'", [error localizedDescription]);
    }
    @end

ok，在手机上运行我们的程序，扫描我们自己的识别图，就可以了

[Link 1]: http://www.wikitude.com
[Link 2]: http://www.jianshu.com/p/e11a9ab05697
[Link 3]: http://dev.arinchina.com/73wz/ar6754/6754/
[Link 4]: https://targetmanager.wikitude.com/
[1240]: /images/20220615/4ce0f65e86194978abbb2c68df6af1f1.png
[1240 1]: /images/20220615/bf4bc18803d14ae19f0c6c4351ce90ef.png
[1240 2]: /images/20220615/6f0da0fa2ead4389b3bce54d2fff270a.png
[1240 3]: /images/20220615/1579185740f44b7ea396d86b953a4d6b.png
[1240 4]: /images/20220615/65224a8d740e4fcaa4c708ef7dd05283.png
[strip]: /images/20220615/cda9168b06644a49aad92e74533ef69a.png
[strip 1]: /images/20220615/9d2a213921364cb282fb5e00b884b913.png