Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

maintainVisibleContentPosition is not available on android #29055

Closed
numandev1 opened this issue Jun 4, 2020 · 15 comments
Closed

maintainVisibleContentPosition is not available on android #29055

numandev1 opened this issue Jun 4, 2020 · 15 comments
Labels
Component: ScrollView Needs: React Native Team Attention Platform: Android Android applications. Resolution: PR Submitted A pull request with a fix has been provided. Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@numandev1
Copy link
Contributor

numandev1 commented Jun 4, 2020

FlatList automatically scrolls after change data and adds new data in the front or middle of the data list.

it is working on ios if i add maintainVisibleContentPosition

<FlatList
  ref={(ref) => { this.chatFlatList = ref; }}
  style={styles.flatList}
  data={this.state.items}
  renderItem={this._renderItem}
  maintainVisibleContentPosition={{
     minIndexForVisible: 0,
  }}
/>

but this prop is not available on android but i want this prop in android

React Native version:

 React Native Environment Info:
    System:
      OS: macOS 10.14.6
      CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
      Memory: 38.35 MB / 16.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 12.15.0 - /usr/local/bin/node
      Yarn: 1.21.1 - /usr/local/bin/yarn
      npm: 6.13.4 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.4, macOS 10.14, tvOS 12.4, watchOS 5.3
      Android SDK:
        API Levels: 28, 29
        Build Tools: 28.0.3, 29.0.1, 29.0.2
        System Images: android-26 | Google Play Intel x86 Atom, android-27 | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.5 AI-191.8026.42.35.5791312
      Xcode: 10.3/10G8 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.6 => 16.8.6
      react-native: 0.59.8 => 0.59.8
    npmGlobalPackages:
      rename-horizon: 1.1.0
      react-native-cli: 2.0.1

Describe what you expected to happen:

It shouldn't scroll to new position when I add new items to list, and should keep latest position where user was like maintainVisibleContentPosition on ios

Example code:

<FlatList
  ref={(ref) => { this.chatFlatList = ref; }}
  style={styles.flatList}
  data={this.state.items}
  renderItem={this._renderItem}
  maintainVisibleContentPosition={{
     minIndexForVisible: 0,
  }}
/>

Steps To Reproduce
prepend item to list to reproduce the issue on android

Snack, code example, screenshot, or link to a repository:

here is my snack repro code. you can check it on android:
https://snack.expo.io/@nomi9995/flatlisttest

@numandev1
Copy link
Contributor Author

can you help me @shergin @mdvacca @davidaurelio to resolve this?
thanks

@davidaurelio
Copy link
Contributor

@nomi9995 sorry, I am no longer involved into RN.

@numandev1
Copy link
Contributor Author

@davidaurelio can you suggest any other facebook developer?

@davidaurelio
Copy link
Contributor

The team has changed quite a lot since I left FB. I don’t really know who the right person would be.

@chrisglein
Copy link

Seems reasonable that this currently iOS only API (https://reactnative.dev/docs/scrollview#maintainvisiblecontentposition) should exist on Android as well. Just needs a PR :)

@numandev1
Copy link
Contributor Author

numandev1 commented Jun 11, 2020

@chrisglein I try to make code natively. Is there dev docs because here everything is coming from com.facebook

@sh-helen
Copy link

@nomi9995 Hi! Have you tried to make this work on android?

@numandev1
Copy link
Contributor Author

@sh-helen No, I didn't try I was busy on another project.

@maxoumime
Copy link
Contributor

I opened a PR to address this #29466. Feel free to comment or review.

@vishalnarkhede
Copy link

vishalnarkhede commented Dec 9, 2020

@nomi9995 @chrisglein I have published a package which is a simple wrapper around FlatList to add support for maintainVisibleContentPosition for Android, in case if it helps :)

@numandev1
Copy link
Contributor Author

by @stackia solution, which was inherit in flat-list-mvcp
@vishalnarkhede both having issue when we try to prepend many item in the array
GetStream/flat-list-mvcp#20

@friedolinfoerder
Copy link

Hey everyone, I am a developer at Steuerbot and me and our frontend team are struggling with this issue for a long time, because our app needs to hold the position even if new elements were added at the top of the chat list.
For that reason we hoped an official android support for the maintainVisibleContentPosition property would be developed, but this never happened 😕

So we tried many different other approaches: Clientside-only hacks, patching RN-Core and other things. Finally we came up with a solution, which fixes the issue on our side 🚀
What did we do? We are providing our own version of the Android RN ScrollView implementation (overriding functions from the RN class). This way we can correct the scroll position based on information the JS side provides us (this works also during a "fling animation" by restarting the fling with corrected position!).

I sharing the link to our developed RN module with you; maybe this will work for your project too 😃
https://github.com/steuerbot/react-native-bidirectional-flatlist

Just give it a try. You can use it as a FlatList-Replacement. We are looking forward to your feedback!

@roryabraham
Copy link

Thanks to some help from @janicduplessis and a few other people, there's now a PR up to implement maintainVisibleContentPosition natively in the Android ScrollView: #35049

@github-actions
Copy link

github-actions bot commented May 9, 2023

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

@github-actions github-actions bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label May 9, 2023
@janicduplessis
Copy link
Contributor

This is now available in 0.72

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Component: ScrollView Needs: React Native Team Attention Platform: Android Android applications. Resolution: PR Submitted A pull request with a fix has been provided. Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

10 participants