I'm trying to implement an augmented reality application in which we can visualize elements over a camera view in background.
My biggest difficulty is to display the camera in background in my application. The content of the elements on the screen, the calculations etc... are computed and displayed in javascript.
What I want know is to launch an activity in Android which displays the camera in background. This part is perfectly working so no problem about it. Now I want to call, in this Android code, a html/js file, and display the content of this file over the camera which is displayed in the activity.
For that, I've read that we have to use the WebView to display the content of a html/js file. But I don't know how to display the layout of android AND the layout of html/css in the same view, and rearrange them to display the html/js layout over the camera view.
Here is the code that simply the camera preview:
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
//make the screen full screen
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
//remove the title bar
requestWindowFeature(Window.FEATURE_NO_TITLE);
mResultView=new ResultView(this);
mPreview = new Preview(this);
//set Content View as the preview
setContentView(mPreview);
//mPreview.setBackgroundColor(0);
//add result view to the content View
addContentView(mResultView,new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
//set the orientation as landscape
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
}
and if we want just display the html/js content (and here maybe there is an other methode to select directly the file and not the code inside but I don't know it...), we write this for a simple "Hello, WebView" on the page:
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
WebView webView = new WebView(mContext);
setContentView(webView);
webView.getSettings().setJavaScriptEnabled(true); //Yes you have to do it
String customHtml = "<html><body><h1>Hello, WebView</h1><script>alert('bim');</script></body></html>";
webView.loadData(customHtml, "text/html", "UTF-8");
}
Now I just want to combine those views in the way that the second is displayed over the first.
Thank you very much for your time.
P.S: If you know another solution to implement the camera view in background from javascript code (I use cordova), I would greatly appreciate it!
EDIT: Ok if I put these 2 pieces of code together I have:
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
// just to remove the banner of the page
requestWindowFeature(Window.FEATURE_NO_TITLE);
// --- WebView part --- //
WebView webView = new WebView(mContext);
setContentView(webView);
addContentView(webView,new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
webView.setBackgroundColor(0x00000000);
webView.getSettings().setJavaScriptEnabled(true);
String customHtml = "<html><body><h1>Hello, WebView</h1><script>alert('bim');</script></body></html>";
webView.loadData(customHtml, "text/html", "UTF-8");
// --- Camera part --- //
//make the screen full screen
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
//remove the title bar
//requestWindowFeature(Window.FEATURE_NO_TITLE);
mResultView=new ResultView(this);
mPreview = new Preview(this);
//set Content View as the preview
setContentView(mPreview);
//add result view to the content View
addContentView(mResultView,new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
//set the orientation as landscape
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
}
Now How do I have to do to handle this (especially the addContentView and setContentView I guess...) to correctly make this work? (Now, with this code, the application crashes. If I remove either the WebView part or the camera part, it's working for the corresponding view).
