Dapp

Welcome!

This is a two part series on how you can create an Augmented Reality app using just Dapp and Layar.  As part of this series, I have also included the settings for a sample published Layar app for you to try out.

The first required step is that you download the Layar Player SDK - LayarPlayerSDK26May.zip

Alternatively, you can also download the latest Layar Player SDK at http://www.layar.com/tools/player/, just be careful with later versions as instructions might have changed and this tutorial might no longer be 100% correct.

Within the Layar Player SDK is also included the “LayarPlayer SDK 1.1 Documentation.PDF”.  Please open this file when working on the second part of the tutorial as this is the documentation I work from and can assist in getting everything correctly setup.

PART ONE

The first part shows us creating a simple Dapp app that we will export to Xcode.  This will form the basis of our Layar App.

PART TWO

Part two of this video tutorial involves us copying over our exported Dapp code into a new Xcode project.  Feel free to visit Creating an advanced Hello World Xcode 4 iPhone project with Dapp video tutorial for a more detailed rundown of copying over these files to Xcode.

This is my first Audio based Video Tutorial and I feel I might have moved a bit too quickly .  All good, just make sure you press the pause button often so you can keep up. Finally, feel free to view the video in full-screen 720p HD mode if you have any trouble seeing any of the code. Everything should then be perfectly clear .

Amendment: Throughout the video I included Release AND Debug symbols (as well as both the Debug and Release folders). Perfectly fine to use both during development but prior to release, please remove references to Debug symbols and the copied Debug folder from your project as they are no longer required.

The code that we insert during this second tutorial is:

- (void)loadLayarPlayerWithName:(NSString *)layarName key:(NSString *)consumerKey secret:(NSString *)consumerSecret {
    NSArray *oauthKeys = [NSArray arrayWithObjects:LPConsumerKeyParameterKey, LPConsumerSecretParameterKey, nil];
    NSArray *oauthValues = [NSArray arrayWithObjects:consumerKey, consumerSecret, nil];
    NSDictionary *oauthParameters = [NSDictionary dictionaryWithObjects:oauthValues forKeys:oauthKeys];
    NSArray *layerKeys = [NSArray arrayWithObject:@"radius"];
    NSArray *layerValues = [NSArray arrayWithObject:@"1000"];
    NSDictionary *layerFilters = [NSDictionary dictionaryWithObjects:layerValues forKeys:layerKeys];
    LPAugmentedRealityViewController *augmentedRealityViewController = [[[ LPAugmentedRealityViewController alloc] init] autorelease];
augmentedRealityViewController.delegate = nil;
    [self presentModalViewController:augmentedRealityViewController animated:YES];
    [augmentedRealityViewController loadLayerWithName:layarName oauthParameters:oauthParameters layerFilters:layerFilters options:LPMapViewDisabled | LPListViewDisabled];
}

 
Also, this is the sample Layer Player name, consumer key and secret key to use within the tutorial (if you don’t already have your own).

• Player Name: nestest
• Consumer Key: e4c775db9a1d90377764dd8ba06829
• Secret Key: 3e69effc36

 
Create an Augmented Reality app with Dapp and Layar Player SDK Dapp Auto-Generated Project Files
 
As a special treat I’m also attaching my complete Xcode project. Feel free to replace my Dapp generated files with your own, and use it as a starting template for future Layar SDK projects . The neat thing is that all the frameworks, include files and everything is already setup for you. Please Note: These include/release/debug folders would need to be replaced when using future versions of Layar Player SDK.
 
Create an Augmented Reality app with Dapp and Layar Player SDK Dapp Complete Project

Comments are encouraged as I’m keen to update this video tutorial wherever might be required.

Hello World!

I don’t think this type of tutorial needs an introduction. But, we are going to do it with Dapp! The following video will take us through the process… enjoy.

Note: Using Xcode 4? Then please view the Xcode 4 version of this video tutorial – Hello World Tutorial with Xcode 4

Note: Please ensure you select ‘iPhone’ as the Product option when creating a new project in Xcode.  The other two options, Universal and iPad will present a different folder structure to you.

Oh, and before i forget.. here are the project files.

Project Files – Hello World iPhone SDK Tutorial with Dapp

Till next time,
Cliff

Welcome to episode 2 of Creating on iPhone app with Dapp. I will be showing you how to build an iPhone app from scratch. At the end of these tutorials we will be submitting and releasing our funky new app on the app store.

In our last tutorial, we defined some requirements and created our mockups, which were then published to PDF. In this tutorial, we will export our mockups as code, drag and drop the code into a new Xcode project and then finally release a prototype of our app.  The very cool part is we are going to do this with ZERO code… I’m gonna go grab some coffee while you watch the tutorial.  Enjoy!

Note: Please ensure you select ‘iPhone’ as the Product option when creating a new project in Xcode.  The other two options, Universal and iPad will present a different folder structure to you.

Updates:

• File system folders were created in the OS and linked to the Xcode project to further neaten up the code.  This can be seen in the attached zipped project files.

Please find attached the exported code files and a copy of the Xcode project.

Bug Tracker Project Files – Episode 2

Bug Tracker Export to Code Files – Episode 2

Our next few tutorials will move away from Dapp … as disappointing as that is, I will be showing you guys how to:

• setup a SQLite database and how to interact with it
• create a layered design, which will be composed of a data layer and a business layer to interact with out database
• we will also be creating classes for our ‘Projects’.  I will explain this further in later tutorials
• Oh.. and the next tutorial will focus on button events and actions, and pushing new view controllers.  This will allow us to jump between our views that we created. Very cool!

Mmm…. the next tutorial will be called ‘Linking our view controllers’.  See you then.

Well, this is exciting.  I will be showing you how to build an iPhone app from scratch.  Using Dapp.  Oh!  And at the end of these tutorials we will be submitting and releasing our funky new app on the app store too.

Unfortunately, I’m not much of a writer (anyone offering free cheap writing courses? seriously…), but, hopefully I can be a better teacher. So… what shall we make?….

Originally, I had planned to build a Movie Catalog but that’s a bit boring and has been done 15 million times before.  However, we want to build something useful so I have decided we will be building an iPhone bug tracker.  Why?  Because I can’t be bothered having another program on my computer for tracking bugs and I’m often out and about testing Dapp and finding the occasional small bug that I’d like to note down.

For our initial release, we are going to build a very simple version of a bug tracker. So, with an exciting working title of ‘Bug Tracker’, our first step is to jot down our requirements.

Bugs will belong to projects, with each project having a collection of bugs. Projects have the following requirements:

1. We must be able to add new projects
2. We must be able to delete projects
3. We must be able to edit projects
4. We must be able to view existing projects
5. Projects must have a title field

Using these as our base requirements, we can move on to the next step and use Dapp to design some of our mockups.  Now, a friend of mine recently asked me ‘what is a mockup?’… so, in answer. A mockup is a design you create that shows what each screen in your app will look like. A mockup also goes a step further, by showing us the different states of a screen.

The following video will show us how to use Dapp to create our first mockups. You will note that the first two pages we create in the video show the same screen – ‘Project List’ with two different states (standard and edit).

Updates:

• Notes were added to every page
• The back button in ‘Edit Project’ and ‘New Project’ was changed to a cancel button
• The done button style in ‘Edit Project’ and ‘New Project’ was changed to ‘done button style’.  Sorry, that’s a bit confusing, but I will explain this in the next episode

Published PDF

At the end of our video tutorial, we exported our project to PDF.  Check it out here.

Bug Tracker Episode 1 PDF Export

Question: But hey, what about convert to code?

We will move on to this in the next video tutorial episode.  It should be fun.