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

Covering text on IOS after key press #69

Open
RobCoco90 opened this issue Nov 19, 2019 · 15 comments
Open

Covering text on IOS after key press #69

RobCoco90 opened this issue Nov 19, 2019 · 15 comments

Comments

@RobCoco90
Copy link

This bug happen on nativescript-vue on IOS platform.

I got a GridLayout with a ScrollView taking the most of the screen with the chat and on the bottom the TextView for the message.

Simulator Screen Shot - iPhone 11 - 2019-11-19 at 17 09 17

When I tap the TextView I get the full view pushed up how it should be.

Simulator Screen Shot - iPhone 11 - 2019-11-19 at 17 09 26

But, when I press any key of the keyboard, the view stretch and get overlapped.

Simulator Screen Shot - iPhone 11 - 2019-11-19 at 17 09 32

<template>
  <Page class="page" @loaded="onLoaded">
    <CustomActionBar :title="title" icon="fa-chevron-left">
    </CustomActionBar>
    <PreviousNextView>
      <GridLayout rows="*, auto" cols="*">
        <ScrollView row="0" col="0" class="chat-box" ref="listView">
          <StackLayout class="chat-wrapper">
            <Message
              v-for="(message, index) in chat"
              :id="`msg-${message.id}`"
              :key="message.id"
              :ref="index"
              :message="message"
            />
          </StackLayout>
        </ScrollView>
        <GridLayout
          column="0" row="1"
          columns="*,auto" rows="*"
          class="send-message-container"
        >
            <TextView
              style="background-color: white; height: auto" borderBottomWidth="0"
              minHeight="40" hint="Type a message" row="0" col="0"
              v-model="message"
            ></TextView>
            <Label verticalAlignment="center" row="0" col="1" class="fa" fontSize="25" :text="'fa-paper-plane' | fonticon" @tap="sendMessage"/>
        </GridLayout>
      </GridLayout>
    </PreviousNextView>
  </Page>
</template>
@MateusSpadari
Copy link

Hello @RobCoco90 I have the exactly same problem here ! When i click any keyboard button the input goes down :/

@dereekb
Copy link

dereekb commented Dec 22, 2019

I'm running into a similar issue, but in my case the keyboard will break as soon as the type of keyboard changes.

Simulator Screen Shot - iPhone 11 Pro - 2019-12-21 at 18 14 59

After clicking emoticons:

Simulator Screen Shot - iPhone 11 Pro - 2019-12-21 at 18 15 58

Clicking back to normal text then attempting to type something:

Simulator Screen Shot - iPhone 11 Pro - 2019-12-21 at 18 16 14

This behavior seems to not occur on a physical iPhone 7+ device, but does occur on an iPhone 11 Pro. The same behavior exists on the iPhone 11 Pro simulator, but not on the iPhone 6 (12.4) simulator or an iPhone 8 simulator.

iPhone 6
Simulator Screen Shot - iPhone 6 - 2019-12-21 at 18 29 31

iPhone 8
Simulator Screen Shot - iPhone 8 Plus - 2019-12-21 at 18 32 42

My guess is the space difference at the bottom of the screen may be causing issues. Earlier this month the issue didn't occur on my iPhone 11, so I'm thinking a recent update in the IQKeyboardManager dependency may have caused the change.

https://github.com/hackiftekhar/IQKeyboardManager/releases

Edit: I manually updated the Podfile to use 6.5.4, but still encountered the same behavior.

I decided to disable the IQ Keyboard for this messages view/page and just update the view heights programmatically when the keyboard opens/closes.

I'll be watching the thread to see if you find a fix, but the IQ Keyboard manager has seemed to not play nicely with my message view so far compared to every other view in my app.

@SergioZhydecky
Copy link

I have the same behaviour on all iphones and emulators

@SergioZhydecky
Copy link

Please help

@SmailHammour
Copy link

@tjvantoll Any news on this?

@MateusSpadari
Copy link

has anyone made any progress? I'm trying... I really need this to work :/

@SmailHammour
Copy link

has anyone made any progress? I'm trying... I really need this to work :/

@MateusSpadari The only way to fix this, for now, is to disable the IQ Keyboard and programmatically update the view & Textfield position.

I really wish the NS developers would be more pro-active when it comes to bug reports.

@MateusSpadari
Copy link

Thanks for the answer @SmailHammour ! I found a strange behavior, if I change the textview (which I am using) for the textfield, it does not happen, however the textfield does not break the line :/

@AndreasDegenhart
Copy link

Any news on that.
I need the feature too.
Please help

@FlawaCLV
Copy link

Same behavior !
@contributors 👋

@saleemepoch
Copy link

I am also having the exact issue. At the press of the first key, the input goes down. But when I click DONE, and start typing again it goes up and stays that way.

Maybe, in my case, the solution might be to trigger IQ Keyboard open when the first key is pressed?

Does anyone know how to enable or disable IQ Keyboarding programmatically?

@saleemepoch
Copy link

Actually, there is a neat way to solve this. At least it worked for me:

#42 (comment)

@dosomder
Copy link

dosomder commented May 29, 2020

Any news? Seems like a pretty big issue.

The hack with nesting the content in a scrollView is not acceptable for me

@SmailHammour
Copy link

@tjvantoll any news on this?

@daweedm
Copy link

daweedm commented Jun 27, 2020

@SmailHammour did you find a workaround for this ?

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

10 participants