Display the AR Browser within a <div>. Is it possible?

Question

I'm currently using Wikitude phonegap extension to develop my app.

Using jquery mobile, I have set up a header, and footer with a central div that provides content information.

I would like to show the AR Browser within the <div> content tag, however, when I execute the loadArchitectWorld() call it brings the full screen AR Browser.

What would be the best practice here?

1. Use the AR BRowser only for displaying POIs and related info?
2. Build the whole app over the AR browser?
3. Switch back and forth between the AR Browser and the rest of the app using .hide() and .show() calls?

Thanks in advance.

Answer 1

Wikitude's PhoneGap plugin is by design fullscreen. Once you call loadArchitectWorld() a fullscreen view is added to phoneGap activity's parent view that handles any "AR."-Components.

Best practice is therefore to define anything to AR inside the "Wikitude SDK html" and use the urlListener-concept (fires event in phonegap when you call "document.location = architectdk://..." in ARchitect World) to pass information between AR and PhoneGap, e.g. to exit AR view.

Please also have a look at the provided Samples in the Wikitude github account.

Kind regards