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

Any way to avoid this on iOS? #2

Open
DeluxeOwl opened this issue Nov 12, 2023 · 6 comments
Open

Any way to avoid this on iOS? #2

DeluxeOwl opened this issue Nov 12, 2023 · 6 comments

Comments

@DeluxeOwl
Copy link

Screen.Recording.2023-11-12.at.21.05.51.mov

I'm using flexbox to position the button at the end (flex-end, flex: 1). Is there any way to avoid this delayed repositioning of the button on iOS?

@rlemasquerier
Copy link
Owner

Hello @DeluxeOwl and thank you for reporting this behaviour.

I'd be happy to help and have a look, but first could you share the code of your screen ? So that I can understand better the positioning in your scenario.

(you could share either the piece of code of the screen you're showing in the example, or a reproduction of the behaviour in the example app)

@landabaso
Copy link

landabaso commented Jan 9, 2024

This is a promising package.
I also have minor issues dealing with Flex, though.

<KeyboardScrollView
      keyboardShouldPersistTaps="handled"
      contentContainerStyle={{
        flexGrow: 1,
        justifyContent: 'center'
      }}
    >
      {your stuff...}
    </KeyboardScrollView>

Try setting some content shorter than the screen height (just one line of text and the TextInput for example). The contentContainerStyleabove will vertically-center the content in the ScrollView. This is quite typical. However, when KeyboardScrollView adds the padding, then the whole ScrollView is scrolled up even if unnecessary.

Related to this, there are other contentContainerStyle configurations which do not work. For example:

    <KeyboardScrollView
      keyboardShouldPersistTaps="handled"
      contentContainerStyle={{
        marginTop: 300
      }}
    >

combined with short inner content will not scroll to the TextInput. This package will be lit after a few tweaks. Thanks for your work @rlemasquerier !

@landabaso
Copy link

landabaso commented Jan 9, 2024

Hi again @rlemasquerier , I've been testing your code. This change will help with the cases reported above:

      contentContainerStyle={[
        contentContainerStyle
        //{ paddingBottom: additionalPadding }
      ]}
      contentInset={{ bottom: additionalPadding }}

@rlemasquerier
Copy link
Owner

Hello @landabaso thank you for your investigation.

I have tried your change, did not notice any regression so I guess we can release this 🙂 - does it solve your issues using flex?

@landabaso
Copy link

Yeah, contentInset worked better in my tests.

@rlemasquerier
Copy link
Owner

@landabaso OK, just released this change then, in 0.2.1.

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants