Can't type in input field after loading a page with InAppBrowser and spinner loading

问题

I'm having very interesting problem. I use inAppBrowser and spinner in one of my Android application. Spinner is implemented with ProgressDialog. The problem here is that when I try to open a web page through inAppBrowser and the loading spinner starts loading once the page start to load and then close once it has finished loading the page, when I tap on input field of that page and try to type letters or numbers, it just stays in that so called "locked" state. If I type something I can't see them, the cursor just keep blinking.

To make this even more weird, I'm able to type special characters. If I tap to any other place around the page, then tap again to that same input field, then it works. Another case when it works is when I put the application into Pause status and then resume it, the input fields works.

This problem occurs only in Android platforms of version 5.0.1 and older.

The inAppBrowser java file can be found in Github at InAppBrowser java file.

My spinner implementation is following:

spinner = new ProgressDialog(cordova.getActivity());
spinner.setIndeterminate(false);
spinner.setProgressStyle(ProgressDialog.STYLE_SPINNER);
spinner.setCancelable(false);
spinner.setMessage(cordova.getActivity().getText(R.string.spinner_loading));
spinner.setTitle("");

and I show/hide a spinner with following way:

@Override
public void onPageStarted(WebView view, String url,  Bitmap favicon) {
    super.onPageStarted(view, url, favicon);
    //InAppBrowser default code....

    try {
        JSONObject obj = new JSONObject();
        obj.put("type", LOAD_START_EVENT);
        obj.put("url", newloc);

        sendUpdate(obj, true);

    } catch (JSONException ex) {
        Log.d(LOG_TAG, "Should never happen");
    }

    spinner.show();
}

public void onPageFinished(WebView view, String url) {
    super.onPageFinished(view, url);
    try {
        JSONObject obj = new JSONObject();
        obj.put("type", LOAD_STOP_EVENT);
        obj.put("url", url);

        sendUpdate(obj, true);

    } catch (JSONException ex) {
         Log.d(LOG_TAG, "Should never happen");
    }

    spinner.hide();
}

What could be the problem here? Any tips, suggestions would be appreciated.

回答1:

Now I was able to fix the problem. The problem was the focus of that specific page input field. For some reason it didn't got the focus on itself once the page has been finished of loading.

Trying to fix the issue within inAppBrowser's inAppBrowser.java file by using editText.clearFocus() and then editText.requestFocus() didn't help at all. But what worked for me was following solution.

Since inAppBrowser has a method called executeScript(), I was able to inject some Javascript code to that specific input field that had this issue. Thus following code did the trick:

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank',  location=yes');
ref.addEventListener('loadstop', function() {
    ref.executeScript({code: "$('#element').blur(); $('#element').focus();"});
});

What does that code do is that it will first clear the focus out of that specific element and then focus on that same element again.

This turned to work on any platform regardless of the version which is big thing.

回答2:

If someone still getting this problem as me, try to update the InAppBrowser plugin to the last version (1.7.2).

ionic cordova plugin rm cordova-plugin-inappbrowser --save
ionic cordova plugin add cordova-plugin-inappbrowser --save

The version 1.7.2 has this fix

I´m using Ionic (v3).

来源：https://stackoverflow.com/questions/42161636/cant-type-in-input-field-after-loading-a-page-with-inappbrowser-and-spinner-loa

标签

java

android

cordova

spinner

inappbrowser