2017-06-02 16:16:07 tfy_2425482491 阅读数 2938

一、简介

      这几年,AR技术得到很多科技公司的青睐,各个应用产品相继推出,例如:在2017年的年初,支付宝的扫福,集福卡功能,正是运用了AR技术。作为一名iOS开发人员,如何集成AR功能呢?小编在项目中运用的是wikitude第三方,非常简单易用,我们只需要注册,获取密钥(此时获取的密钥是免费版的,只用于调试之用,等项目时,就需要购买了),上传我们的识别图,并下载对应的wtc文件即可;现在就和小编一起进入AR开发之旅。

二、wikitudeSDK的获取

1.在浏览器中搜索AR IN CHINA,进入其官网;http://www.arinchina.com/

2.AR IN CHINA中包括各种AR资源,可以获取,点击又下方的wikitude导航按钮,如图所示:


点击

3.进入其官网,如图所示:


点击进入官网

4.获取wikitudeSDK,如图所示:


点击进入

下载javascript版本的API

三、wikitude的注册和license的获取

1.wikitude的注册和license的获取。


点击进入license

登录账号,或注册

                                               注:在注册完毕后,会向你注册的邮箱发送登录密码,注意查收

3.下载key值


此处获取的key值是免费的

四、开发指导资源

1.中文开发指南:http://dev.arinchina.com/73/1

2.开发视频教程:http://www.arinchina.com/video/list/150/

五、开发流程图

1.识别图和wtc文件

识别图:顾名思义,即需要识别的图片。

wtc文件:存储识别图的信息,用于识别识别图,开发中我们需要引用wtc文件。



注:wikitude网站是指:https://targetmanager.wikitude.com

六、官网文档解

1、打开wikitude官方下载的SDK,



2017-06-02 16:18:20 tfy_2425482491 阅读数 4620

一、说明

  Wikitude 官方网址 点击打开链接

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

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

  1. 咱们上传的图片不能是透明的,具体要求,可以在下面的链接中查看,点击进入
  2. 上传识别图,点击这里进入。

    1.png


    2.png


    3.png


    4.png


    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的识别文件

添加识别文件.gif
  1. 并替换01_ImageRecognition_1_ImageOnTarget/assets 文件下的magazine.wtc为我们自己下载的wtc文件,并重新命名为magazine.wtc.

添加自己下载的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,在手机上运行我们的程序,扫描我们自己的识别图,就可以了

没有更多推荐了,返回首页