Tab which contains map view causes app to crash

[shiv19]

I get this uncaught exception, randomly on my tab view layout.
There are 3 tabs, the first and the last one have a list view in it. The middle one is a flexbox layout.

I'm not able to understand what is causing this.

Update: Found a way to recreate it. This is happening if I minimize my app, reopen it and try to switch tabs.

Update 2: This crash is occuring because of nativescript-google-maps-sdk plugin, I have a map view in my 2nd tab

An uncaught Exception occurred on "main" thread.
com.tns.NativeScriptException: 
Calling js method instantiateItem failed

Error: java.lang.ClassCastException: android.view.AbsSavedState$1 cannot be cast to android.widget.AbsListView$SavedState
    android.widget.AbsListView.onRestoreInstanceState(AbsListView.java:2721)
    android.view.View.dispatchRestoreInstanceState(View.java:16886)
    android.view.ViewGroup.dispatchThawSelfOnly(ViewGroup.java:3490)
    android.widget.AdapterView.dispatchRestoreInstanceState(AdapterView.java:1195)
    android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3476)
    android.view.View.restoreHierarchyState(View.java:16864)
    com.tns.Runtime.callJSMethodNative(Native Method)
    com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1043)
    com.tns.Runtime.callJSMethodImpl(Runtime.java:925)
    com.tns.Runtime.callJSMethod(Runtime.java:912)
    com.tns.Runtime.callJSMethod(Runtime.java:896)
    com.tns.Runtime.callJSMethod(Runtime.java:888)
    com.tns.gen.android.support.v4.view.PagerAdapter_frnal_ts_helpers_l58_c38_PagerAdapterImpl.instantiateItem(PagerAdapter_frnal_ts_helpers_l58_c38_PagerAdapterImpl.java:24)
    android.support.v4.view.ViewPager.addNewItem(ViewPager.java:1034)
    android.support.v4.view.ViewPager.populate(ViewPager.java:1216)
    android.support.v4.view.ViewPager.populate(ViewPager.java:1116)
    android.support.v4.view.ViewPager$3.run(ViewPager.java:273)
    android.view.Choreographer$CallbackRecord.run(Choreographer.java:927)
    android.view.Choreographer.doCallbacks(Choreographer.java:702)
    android.view.Choreographer.doFrame(Choreographer.java:635)
    android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:913)
    android.os.Handler.handleCallback(Handler.java:751)
    android.os.Handler.dispatchMessage(Handler.java:95)
    android.os.Looper.loop(Looper.java:154)
    android.app.ActivityThread.main(ActivityThread.java:6682)
    java.lang.reflect.Method.invoke(Native Method)
    com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1520)
    com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1410)
File: "file:///data/data/com.somecompany.someapp/files/app/tns_modules/tns-core-modules/ui/tab-view/tab-view.js, line: 47, column: 37

StackTrace: 
	Frame: function:'PagerAdapterImpl.instantiateItem', file:'file:///data/data/com.somecompany.someapp/files/app/tns_modules/tns-core-modules/ui/tab-view/tab-view.js', line: 47, column: 38


	at com.tns.Runtime.callJSMethodNative(Native Method)
	at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1043)
	at com.tns.Runtime.callJSMethodImpl(Runtime.java:925)
	at com.tns.Runtime.callJSMethod(Runtime.java:912)
	at com.tns.Runtime.callJSMethod(Runtime.java:896)
	at com.tns.Runtime.callJSMethod(Runtime.java:888)
	at com.tns.gen.android.support.v4.view.PagerAdapter_frnal_ts_helpers_l58_c38_PagerAdapterImpl.instantiateItem(PagerAdapter_frnal_ts_helpers_l58_c38_PagerAdapterImpl.java:24)
	at android.support.v4.view.ViewPager.addNewItem(ViewPager.java:1034)
	at android.support.v4.view.ViewPager.populate(ViewPager.java:1216)
	at android.support.v4.view.ViewPager.populate(ViewPager.java:1116)
	at android.support.v4.view.ViewPager$3.run(ViewPager.java:273)
	at android.view.Choreographer$CallbackRecord.run(Choreographer.java:927)
	at android.view.Choreographer.doCallbacks(Choreographer.java:702)
	at android.view.Choreographer.doFrame(Choreographer.java:635)
	at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:913)
	at android.os.Handler.handleCallback(Handler.java:751)
	at android.os.Handler.dispatchMessage(Handler.java:95)
	at android.os.Looper.loop(Looper.java:154)
	at android.app.ActivityThread.main(ActivityThread.java:6682)
	at java.lang.reflect.Method.invoke(Native Method)
	at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1520)
	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1410)
Caused by: java.lang.ClassCastException: android.view.AbsSavedState$1 cannot be cast to android.widget.AbsListView$SavedState
	at android.widget.AbsListView.onRestoreInstanceState(AbsListView.java:2721)
	at android.view.View.dispatchRestoreInstanceState(View.java:16886)
	at android.view.ViewGroup.dispatchThawSelfOnly(ViewGroup.java:3490)
	at android.widget.AdapterView.dispatchRestoreInstanceState(AdapterView.java:1195)
	at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3476)
	at android.view.View.restoreHierarchyState(View.java:16864)
	... 22 more

[3rror404]

I get the same after upgrading to 3.2.0 when navigating back to the TabView that contains a ListView. I cant seem to find a way to recreate the problem in a simple demo app otherwise I would create a sample project.

[shiv19]

@3rror404 do you have any map view in your application tabs?

[3rror404]

Yes I do. The first tab is a list view, the second is a map using nativescript-google-maps-sdk.

[shiv19]

Exactly!
I've got the same setup

Check out these 2 links
dapriett/nativescript-google-maps-sdk#206
#3960 (comment)

[3rror404]

The android.widget.AbsListView was throwing me. I assumed it was caused by the ListView

[shiv19]

@3rror404
Please let me know if you find a fix for this.
I'm sure that it is because of the google-maps-sdk plugin,
to verify you can comment it out from your xml file and see if crash occurs.

The error message I get also has android.widget.AbsListView but it is not because of the list view, it is because of the maps plugin

[shiv19]

@3rror404
Also, there is an alternative google maps plugin,
the documentation for it is not great though
http://plugins.nativescript.org/plugin/nativescript-googlemaps

[3rror404]

That plugin has been discontinued.

Until there is a fix, you can always downgrade core-modules (http://fluentreports.com/blog/?p=303). I'm using 2.5.3.

[shiv19]

downgrade just the core-modules and not nativescript?

my current setup:
Component │ Current version │ Latest version │ Information │
│ nativescript │ 3.2.1 │ 3.2.1 │ Up to date │
│ tns-core-modules │ 3.2.0 │ 3.2.0 │ Up to date │
│ tns-android │ 3.2.0 │ 3.2.0 │ Up to date

[3rror404]

I'm using 3.1.1 actually not 2.5.3 (looking at the wrong project!). This config works for me...

┌──────────────────┬─────────────────┬────────────────┬──────────────────┐
│ Component        │ Current version │ Latest version │ Information      │
│ nativescript     │ 3.1.3           │ 3.2.1          │ Update available │
│ tns-core-modules │ 3.1.1           │ 3.2.0          │ Update available │
│ tns-android      │ 3.1.1           │ 3.2.0          │ Update available │
│ tns-ios          │ 3.1.0           │ 3.2.0          │ Update available │
└──────────────────┴─────────────────┴────────────────┴──────────────────┘

[shiv19]

Thanks for the info, I'll give it a try

[shiv19]

@3rror404
I tried the exact same versions as you mentioned. it didn't work for me :/

[NickIliev]

Hey @3rror404, @shiv19 this is known bug logged and discussed here.

In the linked issue our developers have made an investigation and suggested solution here which needs to be implemented in the plugin.

Closing this issue as duplicate to #3960 (comment)

[shiv19]

@NickIliev
I read the issue that you referred to,
if you read the log message, the one I have posted is slightly different,
and the fix suggested in the issue that you referenced did not work for me.

Can we have this issue re opened?

[shiv19]

@3rror404 @NickIliev
#3960 (comment)
After seeing this comment, I tried to fork the nativescript-google-maps-sdk plugin and fix the issue, but even after following it, I faced the same error.

Luckily, I came up with a workaround, I'm sharing it here so that it'll be useful for someone someday,

[ PS. if you want to continue reading this on my blog, then go here
https://shiv19.github.io/how-to-fix-nativescript-google-maps-sdk-map-view-crash-inside-scroll-view/ ]

The following instructions assume that you have installed nativescript-google-maps-sdk,
and you are using it in a tab view, and because of this, when you resume your app from recents tab on android, and navigate to the tab containing the map, the app crashes.

Step 1: install nativescript-accordion
tns plugin add nativescript-accordion

Step 2: In the xml file where you are using the map make sure these 2 xml namespaces are present

xmlns:maps="nativescript-google-maps-sdk"
xmlns:accordion="nativescript-accordion"

Step 3: Enclose your map element inside a accordion

<accordion:Accordion height="250" id="accordionLayout" items="{{ items }}">
            <accordion:Accordion.itemTemplate>
                <StackLayout>
                    <maps:mapView id="mapView"
                        height="250"
                        mapReady="onMapReady" />
                </StackLayout>
            </accordion:Accordion.itemTemplate>
        </accordion:Accordion>

Step 4: In your code behind, import const observableModule = require("data/observable");
and create a simple view-model, this is a dummy to setup our accordion,

var accordionData = new observableModule.fromObject({
    items: [{
        title: "Map View",
        items: [
          { name: "map" }
        ]
    }]
});

Step 5: In the loaded event of your page, set the binding context of your accordionLayout to the view-model that we created in the previous step

accordionLayout = component.getViewById("accordionLayout");
accordionLayout.bindingContext = accordionData;
accordionLayout.selectedIndex = 0;

Note: We are setting the selectedIndex, so that it opens the accordion by default, and we have not created any header template, so the accordion won't have a header.

Step 6: Sample onMapReady function

exports.onMapReady = function (args) {
    if(someDataObj.location){
        var mapView = args.object;
        var marker = new mapsModule.Marker();
        marker.position = mapsModule.Position.positionFromLatLng(someDataObj.location.lat, someDataObj.location.lng);
        marker.title = someDataObj.name;
        mapView.addMarker(marker);
        
        mapView.latitude = someDataObj.location.lat;
        mapView.longitude = someDataObj.location.lng;
        mapView.zoom = 16;
        // Disabling zoom gestures
        mapView.settings.zoomGesturesEnabled = false;
        mapView.settings.rotateGesturesEnabled = false;
        mapView.settings.scrollGesturesEnabled = false;
    }
}

And that's about it, with that you should have pretty much the same result that you had before,
only now, it doesn't crash the same way.

Screen shot:

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.