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

Compose box obscured by keyboard on long message, in stream view #3369

Closed
armaanahluwalia opened this issue Feb 26, 2019 · 5 comments · Fixed by #3595
Closed

Compose box obscured by keyboard on long message, in stream view #3369

armaanahluwalia opened this issue Feb 26, 2019 · 5 comments · Fixed by #3595
Assignees
Labels
a-compose/send Compose box, autocomplete, camera/upload, outbox, sending a-layout P1 high-priority

Comments

@armaanahluwalia
Copy link
Collaborator

When replying to a message in the stream view, if the message you’re typing is longer than a certain line length, the message gets cut off.

This makes drafting long messages extremely difficult. See this video for a reproduction.

@gnprice gnprice changed the title Compose Message Cutoff in Stream View Compose box obscured by keyboard on long message, in stream view Feb 27, 2019
@gnprice
Copy link
Member

gnprice commented Feb 27, 2019

Thanks @armaanahluwalia for this report! Very interesting.

To highlight one detail: this specifically happens when narrowed to a whole stream -- it doesn't happen when narrowed to a topic.

To describe here in words the exact symptom: when you type a long (draft) message, the compose box grows to make room... and in the video, it eventually grows to try to use some space that's hidden by the keyboard.

Some further observations in the video:

  • The send button moves along with the bottom of the compose box... and right to the end of the video, you can still see a bit of the top of it. So the box is growing just a constant amount too far down.

  • Even before you type anything, there's a different symptom present! image

    That blank white band between the compose box and keyboard is doing nobody any good.

  • You appear to be on iOS. Helpful to mention for issues involving layout and/or the keyboard 🙂 , as they often vary by platform.

Further notes:

  • With 23.1.110 (the current beta) on Android 9, I reproduce this issue -- but I don't reproduce the blank white band. So that's probably an unrelated issue.
  • Gosh, though -- the height of that blank white band is just about equal to the amount we're going too low. So I still wonder if they're related somehow, even though one can happen without the other.

@gnprice gnprice added a-layout a-compose/send Compose box, autocomplete, camera/upload, outbox, sending labels Feb 27, 2019
@gnprice
Copy link
Member

gnprice commented Feb 27, 2019

Oh also -- this symptom is reminiscent of #3273 "Keyboard overlaps the compose box on iOS". That one was fixed in 23.0.109, but the history may be a clue for what to look into.

@gnprice
Copy link
Member

gnprice commented Feb 27, 2019

(I went and filed #3370 for the blank white band.)

@gnprice
Copy link
Member

gnprice commented Mar 25, 2019

Some discussion on a duplicate issue, #3414.

One direction to fix this would be to limit the compose box's height. But this shouldn't be a small fixed limit like 6 lines; see discussion on #3049. Instead it should fill the space available. See @borisyankov 's comment on #3414 about how that would ideally work.

Also @jainkuniya points out that the fact this happens only on a stream narrow means it only happens when the topic input is present. That's probably a clue. The compose box's layout already works just fine when there's no topic input; if we can make it work equally well when there is, that solves the problem.

@gnprice
Copy link
Member

gnprice commented Aug 6, 2019

See #3579 for another report, with a nice screenshot demonstrating the issue.

jainkuniya added a commit to jainkuniya/zulip-mobile that referenced this issue Aug 25, 2019
jainkuniya added a commit to jainkuniya/zulip-mobile that referenced this issue Jul 19, 2020
Remove scroll view from input wrapper (which was added in zulip#3595).
This fixed zulip#3614. Also just checked it works fine on Android as well. So
basically zulip#3595 was not a completely right solution for zulip#3369.

Now inputs are wrapped with simple view, which is self aligned as
vertically center. ComposeMenu and SendButton are self aligned as
vertically end. And wrapper of all this three has justifyContent
as space-between, which makes them spread whole over horizontal space
available.

This removes alignItems: 'flex-end' from `composeBox`, which was pushing
input to vertically bottom, idealy it should be at vertically center.

Fixes: zulip#3614
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a-compose/send Compose box, autocomplete, camera/upload, outbox, sending a-layout P1 high-priority
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants