Philzen / WebView-MultiTouch-Polyfill

A polyfill to gap missing multitouch functionality in HTML5 apps on Android 2.x
35 stars 9 forks source link

Using in PhoneGap 1.9.x #15

Closed applejacko closed 11 years ago

applejacko commented 11 years ago

Phil,

This is Jack (aka applejacko), from the Google Groups / PhoneGap Group.

(I posted this on another github: https://github.com/Philzen/cordova-android-multitouch-polyfill - is this one inactive? Anyway, sorry about the repeat post.)

I'm trying to use your Android MultiTouch/PolyFill piece in my app. Was having problems, so I started with a new Android project in Eclipse, using PhoneGap's HelloWorld example. But I'm still getting an error on start up:

"The application HelloWorld (process com.travelmidwest) has stopped unexpectedly. Please try again."

What I did:

Created PhoneGap's (1.9.0) HelloWorld app and ran it Added com.changeit.polyfill.CordovaWebClient.java and com.changeit.polyfill.WebClient.java to my project Edited HelloWorldActivity.java, adding "import com.changeit.wmpolyfill.*;" to the import list and adding these two lines at the end of the onCreate() method:

CordovaWebClient wmp = new CordovaWebClient(this, appView); appView.setWebViewClient(wmp);

Is there something else I need to do to add your Java stuff to my HelloWorld app?

I got your WebView MultiTouch Polyfill app to work. It looks excellent!

Thanks,

Jack

Philzen commented 11 years ago

What does adb logcat | grep travelmidwest tell regarding that exact moment the app stops?

applejacko commented 11 years ago

Here you go...

07-19 20:08:08.291: E/AndroidRuntime(24863): FATAL EXCEPTION: main 07-19 20:08:08.291: E/AndroidRuntime(24863): java.lang.RuntimeException: Unable to start activity ComponentInfo{com.travelmidwest/com.travelmidwest.HelloWorldActivity}: java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first. 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1702) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:1722) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread.access$1500(ActivityThread.java:124) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread$H.handleMessage(ActivityThread.java:974) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.os.Handler.dispatchMessage(Handler.java:99) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.os.Looper.loop(Looper.java:130) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread.main(ActivityThread.java:3821) 07-19 20:08:08.291: E/AndroidRuntime(24863): at java.lang.reflect.Method.invokeNative(Native Method) 07-19 20:08:08.291: E/AndroidRuntime(24863): at java.lang.reflect.Method.invoke(Method.java:507) 07-19 20:08:08.291: E/AndroidRuntime(24863): at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:839) 07-19 20:08:08.291: E/AndroidRuntime(24863): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:597) 07-19 20:08:08.291: E/AndroidRuntime(24863): at dalvik.system.NativeStart.main(Native Method) 07-19 20:08:08.291: E/AndroidRuntime(24863): Caused by: java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first. 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.view.ViewGroup.addViewInner(ViewGroup.java:1976) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.view.ViewGroup.addView(ViewGroup.java:1871) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.view.ViewGroup.addView(ViewGroup.java:1828) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.view.ViewGroup.addView(ViewGroup.java:1808) 07-19 20:08:08.291: E/AndroidRuntime(24863): at org.apache.cordova.DroidGap.init(DroidGap.java:327) 07-19 20:08:08.291: E/AndroidRuntime(24863): at com.changeit.wmpolyfill.CordovaWebClient.(CordovaWebClient.java:58) 07-19 20:08:08.291: E/AndroidRuntime(24863): at com.travelmidwest.HelloWorldActivity.onCreate(HelloWorldActivity.java:14) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1047) 07-19 20:08:08.291: E/AndroidRuntime(24863): at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1666)

Philzen commented 11 years ago

I will need to test myself and see if i can repeat the problem...

Did you try moving the two WMP lines around, like at the beginning after super.oncreate? The wmp is futile to be involved after loadUrl(), you got that one covered?

applejacko commented 11 years ago

No, I did NOT have that one covered! That worked, moving the lines around.

Some of us (I, among them) are working with PhoneGap without really yet understanding the inner mechanics of the PhoneGap wrapper and how it works. This is my introduction to Android (and iOS, Blackberry too), working with this app and jQuery Mobile and PhoneGap. So I don't real have a full appreciation for doing an Android app the "regular" way. I have my hands full trying to get things working the same on all three platforms, with a tight deadline in sight. So I'm busy with HTML and JavaScript, very much abstracted away from the inner workings of things, including the Java and Objective-C. Probably sounds lame, but that's where I have to start. And that's the power of PhoneGap.

I might have more questions for you. For the first time I see pinch-zooming working with my app on an Android! Thank you, thank you, thank you! This is good!

Thanks,

Jack

Philzen commented 11 years ago

Very welcome - i was also really happy when i found that the idea worked, but more testers are needed.

Thanks for using WMP :) ...what you are saying makes clear very clear to me that this needs to go in the install instructions.

Maybe you could do us a little big favour by also adding your Device to https://github.com/Philzen/WebView-MultiTouch-Polyfill/wiki/Device-Chart as you're saying the demo works on your device.

Cheers - Phil

applejacko commented 11 years ago

Phil,

What development phase is this project in at this point?

I am seeing spurious results right now with the app I'm developing - and with a simple app that allows a user to move and pinch-zoom an image in a div element, and also displays the touch event that is happening in another div along with how many fingers are involved and whether the state is panning or zooming. It works for a while, then freezes. Then after a while, it comes back to life. When it works, it does what I expect it would.

The touchstart event, in particular, seems to not be firing when it's not working. Also, I get many ">>> loadUrlNow()" Texts in the LogCat.

I would be happy to provide you the code I'm using. Since pinch-zooing is a common thing people want, this could possibly be something you can use to debug your code, and add as a sample app later if you wish. I'd also be happy to continue providing feedback - if that's what you'd like.

Maybe I'm implementing this incorrectly. I'm assigning touch event handlers to the img element like this:

var theImage; ... theImage = document.getElementById("eiffelTower"); ... theImage.ontouchstart = touchStart; theImage.ontouchmove = touchMove; theImage.ontouchend = touchEnd; theImage.ontouchcancel = touchCancel;

as though they're "native" events. Is this correct? This app runs OK on iOS and Blackberry, by the way.

Thanks,

Jack

applejacko commented 11 years ago

Phil,

Quick question (though I'm not sure there's a quick answer!): How do you correlate the N touchmove events to the N touchstart events?

I would think you could know how many fingers are moving by keeping track of how many touchstart events there are and how many touchend events have happened, i.e., number of fingers moving = number of touchstart events - number of touchend events. Maybe this is what you do. But how would you know which touchmove events, in the constant flurry of touchmove events, are the "[0]" events and the "[1]", "[2]" events, etc.? I'm guessing this is the big challenge of this, right?

Do these events have ID's that help you correlate them? Does the Android model somehow keep track of this for you?

I guess one way you could correlate them (if the Android SDK doesn't do it) is to assume each sequential touchmove event for a given finger can be no more than M pixels in x and y from the previous one. In other words, when a new event comes in, assign it to the finger whose event is closest in distance in the previous event. But it seems Android would do this for you...

I'll look through your code more. And through the Android SDK doc. Interesting puzzle...

Jack

Philzen commented 11 years ago

...so now for something completely different ;) therefore pls open a new issue / move that info there pls - as i have no indication that what you're describing is only phonegap-related.

Regarding status i have a huge backlog rite now and WMP is not at the top of the prio list at the moment - although i would really like it there. I believe i have seen the problem you are describing before (map demos work great, but as soon as i expand on those demos with more page complexity, something goes quirky) and i'm working on it - will try my best to follow it up asap.

Philzen commented 11 years ago

Fixed in current master branch.

Now it shouldn't matter anymore if the polyfill is instantiated before or after super.loadUrl(...) is called... enjoy.