View Pager Keeps Crashing My App


#1

I have a static View Pager with 2 Pager Views inside with an Image View inside of each.

On each Pager View, I have an On Load Event to display the image inside of the Pager View Image Asset from a URL saved as a page variable.

When I try and load the page it crashes the app for some reason.

I tried to load these images On Create (vs. on load of the pager view) but it kept the images blank and didn’t load anything.

Perhaps I’m setting something up wrong?


#2

Can you provide me a Build ID and instructions to recreate the app crash? I can see what’s going on under the hood on my side.


#3

@wade check out: Build ID: 1151231485029827944

Click anything on the main home page (after auto cred login) with a number ABOVE 0:

i.e. ‘5’ and keep clicking 2 pages deeper to get to the page with the View Pager that crashes the app


#4

The error is related to a scrollview in a scrollview element on the Quotes Details page. There’s a scrollview holding a ton of elements (that’s normal practice) BUT 1 of those elements is a dynamic list which holds a vertical scrollview within itself (that’s not normal practice).

This is where layout breakdowns occur in Dropsource and where things would also be janky if you coded the app yourself too. The “tough love truth” here is that it’s a poor design decision to place a scrollable element inside another same-direction scrollable element. You know those times in your own personal app uses, when you are in an app or site and 1 thing is scrolling but you, the user, want to the scroll the other thing instead that’s inside it… and it frustrates the heck out of you… you try to scroll from different areas of the same page hoping for the result you want… YUP, this is where bad design sits in a scrollable environment. The OS can’t determine what the correct expectation is because of element-specific rules in an area conflict with other element-specific rules or even page-specific rules.

We don’t compensate well for this because it’s something you actually don’t want to do. The error is basically saying, “We are trying to set up constraints for you here but things are colliding and we don’t know what to do”.

If I were you, I would break up the logic to 2 pages, 1 that has the list items and then when selected a new page has all the actions, etc…

I’m sorry to be the deliverer of bad news. No one wants me to say this but unfortunately, it’s a spot where I have to be a messenger of news telling you that your design isn’t following best practices for mobile applications and you’ll need to adjust things to a better UX workflow.


#5

Hmm…

I only have one scroll view element on this page though?


#6

I see what you’re thinking but… Nah there’s technically 2… The “Scrollview” is 1 and the Listview is 2. The list is a native class and within it, it’s using a Scrollview to “scroll through the list tiles”.

You have a list inside of a scrollview. The list scrolls up and down AND the ScrollView scrolls the whole page up and down as well, right? That’s the telltale sign that things are going to get confusing for the user. If I placed my finger on the list and scrolled, the app still doesn’t really know if I intended to scroll the list OR scroll the page since my finger is actually within the perimeter of both scrolling features and I can’t depict depth of hierarchy just from touching the screen.

You want to think of a design that separates the need for a nested scrolling element inside another scrolling element. it might require breaking a page down in its logic and making it 2 pages, it might require removing the scrollview entirely and having a list that doesn’t fill the entire page (so that the page doesn’t need scrolling) and then below the list, some set buttons, and labels etc for example if you want to keep it all on 1 page. It could be that when a list item is tapped on, another view pops up “unhides” and has actions to take. Probably not the cleanest way, that last 1, as that’s logic that should break down in a new page but it’s all up to you.

I can’t really give you the “correct” answer since it’s design related. All I can really say is that putting a list or any other scrolling element inside a scrollview is not a good idea and will incur issues like you’re seeing.


#7

I check your remarks now.

Will take action and correct.

I see what you mean by the double list. Not sure how it even (or why it even) made it in there.

Thanks


#8

Good deal! Would love to see what you come up with here. Feel free to share a Build ID when it’s switched if I can take a look.


#9

I have completely removed the static list within the scroll view but the app still crashes unfortunately.

Something is breaking the page and I think it’s something to do with the view pager. Everything worked fine till then.

Build ID: 1155591644915738811


#10

Backtracking might not be fully cleaning up the issues… I see the issue is in the ScrollView element itself too. Might have to pull that out as well and re-apply it.

Sorry for the inconveniences you’re having. Constraints and Layouts can get screwy when adding/removing, in Dropsource and in Coded Development as well.

Here’s the error that prompts me to believe something weird is happening with the ScrollView here…


#11

I removed the View Pager and the page works fine again.

Doesn’t this mean that it is the View Pager that is causing the problem?

The page functioned fine until I added the view pager inside of the scroll view.

If you suggest that it could still be the scroll view that’s erroring out but not crashing the app I will rebuild the whole page from scratch. Trying to avoid that whole process though…

And is there a way that I can check these errors myself? What are the steps to produce the error screenshot that you have created? Is there a tutorial on Dropsource’s blog? This way maybe I can figure it out myself.


#12

I see now. So getting rid of the entire View Pager will solve it, yes. You either need to lose the scrollview or the view pager from the view. The issue is that you cannot have 1 nested inside the other. Moving forward in your design of that page, decide to use a scrollview OR a View Pager but not both and you should be safe here it seems.

So to get deeper errors and clues, I download the source code and run your app in Android Studio and use the Logcat window to see the errors produced when the app crashes. If you get a Compile Error, you won’t have access to the source code unfortunately (just the way we’re currently setup). But at anytime you get a successful build id, you can download that source code and run in Android Studio. So this works in situations where your app builds fine but while using the app, it crashes at a certain spot, you can do your own debugging by running the test inside Android Studio with your source code.


#13

I don’t have a tutorial on this. If you download android studio and your source code though, tinker around a bit and use some YouTube tutorials to get familiar with the software and you’ll be able to look deeper no problem really.