eclipsesource / eclipsesource/tabris-js
Improve pull-to-refresh UX when using ScrollView
- Dominant language
- JavaScript
- Stars
- 1.4k
- Forks
- 171
- PR merge metrics
- No merged PRs in 30d
Description
### Problem description
Currently, the only possibility to use pull-to-refresh with `ScrollView` is wrapping it in a `RefreshComposite`. A`ScrollView` wrapped in a `RefreshComposite` behaves differently than a `CollectionView` regarding pull-to-refresh.
When the `ScrollView` hasn't yet been scrolled to top and pulling down beyond the minimal scroll offset, the `ScrollView` will overscroll instead of initiating the pull-to-refresh action.
When using a `CollectionView` in the same scenario, the pull-to-refresh action will be triggered instead of overscrolling, which is the more natural and expected UX.
|RefreshComposite > ScrollView | CollectionView|
|---|---|
|||
### Expected behavior
Instead of overscrolling, `ScrollView` wrapped inside of a `RefreshComposite` with `refreshEnabled: true` should always trigger the pull-to-refresh action when pulling down beyond the minimal scroll offset. If this is technically not possible, would it be possible to introduce a more natural pull-to-refresh behavior, similarly to the one used with `CollectionView`, on `ScrollView` itself?
### Environment
- Tabris.js version: 3.0.0-beta2
- OS: 12.1
### Code snippet
```javascript
import {RefreshComposite, ScrollView, TextView, contentView} from 'tabris';
contentView.append(
{Array.from(new Array(20).keys()).map((i) => (
))}
)
function hideIndicatorAfterDelay({target}: {target: RefreshComposite}) {
setTimeout(() => {
target.refreshIndicator = false;
}, 2000);
}
```
Contributor guide
Assessment
This issue has not been assessed yet.