WIP: Update Android Example.

[joshuapinter]

I'm adding this "work in progress" issue here to keep tabs on getting the Android example updated to the excellent-looking iOS example. I feel bad for poor, old Android.

This is their current state:

My goal with this is to make the Android version look as good as the iOS version.

The actual work will be done over on my fork at https://github.com/joshuapinter/react-native-sortable-list.

TODO:

• Update UI to use card-like interface for each kitty.
• Use elevation for non-activated rows.
• Update kitty picture in first row - not working.
• Add increased elevation to active row whilst dragging.
• Add similar screencast for Android to README.
• Add option to pass "draggable anchor element" to row (to allow for easy scrolling).
• Or, see if you can fix the scrolling issue on Android.

[joshuapinter]

Status Update:

[joshuapinter]

Issue PR #19 to update the Android example app with the styling seen in the above GIF. I think it looks beautiful.

Also issued:

• PR Replace first kitten photo with a working one. #16 to update the picture of the first kitten.
• PR Update gradle and build #17 to update Gradle build tools, SDK build tools and React Native dependency.

Still need to figure out a way to scroll in Android without dragging. But I think that can be solved one of two ways:

1. Allow a draggable area of the row instead of using the entire row.

2. Doing some work on the long press stuff happening on the android side and see if we can avoid kicking off the drag event until the user does a long press. Otherwise, let the OS UI handle the scrolling event as normal.

[joshuapinter]

Fixed scrolling in Android in #20 . Essentially, the PanResponder was hijacking the gesture from the OS so scrolling was nearly impossible, especially with the UI changes that extend the rows fully to each side.

Now we don't block the OS from handling the scroll event unless the user issues a long press (200ms) on one of the rows, at which point scrolling is disabled and you can drag the row around as you'd like.

Not an easy fix to find but it ended up just being a few lines to solve, thanks to this obscure post over here: facebook/react-native#8488

That's why the internet and GitHub is a beautiful thing, sharing knowledge and making it relatively accessible is the greatest thing humankind has done. 🙏

[gitim]

@joshuapinter big thanks for your help with fixing android 👍. It looks than we can publish a new version with all fixes and additions to npm, do we?

[joshuapinter]

I would say so. And if I can suggest, I would say this warrants a 1.0.0 npm version release. Everything is very stable.

The only thing I would like added is having a handle to start the drag instead of the whole row. Any thoughts on that?

Thanks.

[gitim]

just noticed this in android while autoscrolling:

maybe this is issue with emulator, but I am not sure.