I am using Phonegap + Jquery Mobile for a Web App. I have a simple registration form. However, when i type any character, the page jumps and flickers Wildly. How do i overcome this problem on Android?
i have tried most of the solutions provided at :
https://github.com/desandro/isotope/issues/251
http://blogs.bytecode.com.au/glen/2011/07/14/eliminating-annoying-flicker-transitions-with.html and other pages. None of the solutions worked for me.
Or Is it possible to call an android page only for registration? Any help much appreciated. Thank you.
It is possible to launch the Android code from your phonegap html page
MyWebView.addJavascriptInterface(new MyJavaScriptInterface(this), "MyHandler");
public class MyJavaScriptInterface
{
Activity parentActivity;
MyJavaScriptInterface(Activity activity){
parentActivity = activity;
}
public void processData(String parameter){
/* your processing logic */
/* you can launch your activity here. which contains registration form logic*/
}
in your html page
<a href="#" data-transition="slide" onClick="window.MyHandler.processData("+value_to_pase+")">
Change this with your page code (html Page)
Related
I have a simple game developed in PHP. I have loaded the remote site in Android WebView. I want to find out that if user clicks on a FREE life button which is on my remote PHP site, I want to start a reward video on my Android app.
But how can I know whether the user clicked on the FREE life button in my WebView and start the video instantly in my android app?
There is an Android mechanism that alows you to run Android function from javascript:
<input class="button" type="button" value="FREE life" onclick="startRewardVideo('some parameters can be passed to Android from here')">
<script type="text/javascript">
function startRewardVideo(paramFromJS) {
Android.startRewardVideoAndroidFunction(paramFromJS);
}
</script>
now you need class that knows what to do with your javascript:
public class MyJavaScriptInterface {
#JavascriptInterface // this annotation is importatn
public void startRewardVideoAndroidFunction(String paramFromJS) {
//here you need to start showing reward movie
//because this function will be called after webView button click.
}
}
last step is to connect webView with your javascript interface:
webView.addJavascriptInterface(new MyJavaScriptInterface(), "Android");
and of course don't forget to enable javascript for your webView:
webView.getSettings().setJavaScriptEnabled(true);
Hope it helps :) Ask if you have any questions on this.
Here you have full tutorial
I'm trying to track what links my users click in the browser and failing miserably:
My code:
browser = new XWalkView(getMainActivity());
browser.setResourceClient(new XWalkResourceClient(browser)
{
#Override
public boolean shouldOverrideUrlLoading(XWalkView view, String url)
{
log.i("juhu 1", url);
return false;
}
});
This only calls the callback for URLs that I give it (browser.load()), but not for URLs that user then clicks on the rendered page. What's worse, it's not consistent: sometimes the callback gets called, sometimes not.
Here's an example that fails:
<html>
<body>
<p>my link 1</p>
<p>my link 2</p>
</body>
</html>
I tried this with XWalk 15.44.384.13 (latest) and 14.43.343.24 (a couple revisions back), both with no success.
I looked all over the place for similar methods, but neither resource client nor ui client seem to provide something that would work.
This looks fixed as of at least XWalk 16.45.421.19 with the call being made as expected.
I'm using the API 17 emulator to test a page containing a web view.
The webview first loads a page using the GET method.
Then the user submits the web form using HTTP POST method which causes a second page to load.
At this point if I rotate the screen I receive the "Webpage not available" error seen below. This only occurs if the page was loaded using the POST method. Note: I'm trying to restore the webview's state using webview.restoreState (see code below). Is there any way to tell Android to re-post the form data and reload the page instead of displaying this error message?!
I can't reproduce this same issue on KitKat, Lollipop, or Gingerbread... I can only reproduce this issue on Jellybean and Ice Cream Sandwich so far...
I've also confirmed this is an issue on an actual Nexus 7 device running Jellybean, so it's not an emulator-only problem.
Note: I'm not particularly interesting in using something like android:configChanges="orientation|keyboardHidden". As I understand it, this might solve my rotation issues, but the problem may still resurface if the activity state needs to be restored for other reasons.
Screenshots:
Step #1: Load the WebView Normally
Step #2: Submit the Form (uses HTTP Post Method)
Step #3: Rotate the screen to trigger webview.restoreState - error occurs
Code:
Here is some sample code to go along with my question. The code is in Mono C# but should be very nearly identical to Java.
public class MainActivity : Activity
{
WebView webview;
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
webview = new WebView(this);
SetContentView(webview);
if (bundle == null)
webview.LoadUrl("http://2-dot-npwc-services.appspot.com/test-post.jsp");
else
webview.RestoreState(bundle);
}
protected override void OnSaveInstanceState(Bundle bundle)
{
base.OnSaveInstanceState(bundle);
webview.SaveState(bundle);
}
}
The sample HTML page that is performing the POST method looks like this:
<html>
<form action="test-post.jsp" method="post">
<input type="text" name="test" value="test"/>
<input type="submit"/>
</form>
<p>You entered: <%=request.getParameter("test")%></p>
</html>
The browser it's doing good (although it's a pain for us), you have 2 ways:
1- Keeping the webView instance and restoring the state, adding like you said android:configChanges="orientation|keyboardHidden"
2- Or reloading the post petition again.
I take the first one and if i get some error, i will go back to the last page. Doing static content, so on rotation no network or a new petition it's needed on each rotation, which if not, on server side will be a pain too.
To achieve the "if error go back" you need to set a Custom WebClient and override this method
webview.setWebViewClient(new WebViewClient() {
#Override
public void onReceivedError(WebView webView, int errorCode, String description, String failingUrl) {
if ( webView.canGoBack() ) {
Toast.makeText(MainActivity.this, R.string.error_web, Toast.LENGTH_SHORT).show();
webView.goBack();
}
}
});
You can filter by errorCode to go back when you want, in some kind of error you can go back on other do other thing. I dont' know which error raises this POST request or if you want more filter on other situations, so i'm sure you can do a fine grain filter using it.
Edit: You have here the possible error codes
WebViewClient Error Codes
I hope this helps.
I have html doc with jquery animation looks very much alike: http://tympanus.net/Tutorials/LittleBoxesMenu/
and it works fine on browser but not working on android WebView .
Why not?
Is there some catch with jquery and android?
EDIT: did some testing on iPhone and everything is working just fine, still no idea why not working in android
Ok, problem solved, quite simple at the end, in android app imported apache.cordova package, extended PhoneGap class and simply loaded URL. And that was it.
package voi.tii.yu;
import org.apache.cordova.*;
import android.os.Bundle;
public class PhonegapActivity extends DroidGap {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/page2/index.html");
}
}
The docs for WebView clearly state that Android's WebView doesn't use JavaScript:
By default, a WebView provides no browser-like widgets, does not
enable JavaScript and web page errors are ignored. If your goal is
only to display some HTML as a part of your UI, this is probably fine;
the user won't need to interact with the web page beyond reading it,
and the web page won't need to interact with the user. If you actually
want a full-blown web browser, then you probably want to invoke the
Browser application with a URL Intent rather than show it with a
WebView.
I'm using Android, and I've created a Webview which nicely opens my HTML page (page "A").
Now, I want to follow some links I have on page "A", which go to page "B".
If I click on a linkl defined with
<a href="page_b.html"> everything is fine, and the Webview behaves just like a normal browser, goinmg to the selected page.
But if I click a link defined as <a href="page_b.html?param=x"> all I get is a "Web page not found".
The same if I use an anchor like <a href="page_b.html#2">.
How can I pass parameters between different HTML pages within the same Webview?
EDIT:
Nevermind, I managed to pass the parameter I needed using localStorage.
Of course, after a gazillion dry runs, I discovered I had to enable it in the WebView with settings.setDomStorageEnabled(true) :D
In the end, I discovered I had to set settings.setDomStorageEnabled(true) in the WebView, and the easiest solution for my problem I found was:
In "Page A.html", I intercept the onClick event of the links, and use localStorage to store the id:
$(".link").each(
function()
{
divId=+$(this).attr('id');
$('#'+divId).click(function(e)
{
localStorage.my_id=divId;
});
});
In "Page B.html", I retrieve the stored id:
$(document).ready(
function()
{
divId=localStorage.my_id;
isReady();
});
I can't reproduce the problem, try this:
this.getWindow().requestFeature(Window.FEATURE_PROGRESS);
...
vw = new MyWebView(this);
vw.setWebChromeClient(new WebChromeClient() {
public void onProgressChanged(WebView view, int progress)
{
activity.setProgress(progress * 100);
if(progress == 100)
activity.setTitle(title);
}
})
;