Skip to content

Improve chat input UX: enable text wrapping in message field #175

Description

@alphin-08

Is your feature request related to a problem?

  • Yes, it is related to a problem

Describe the feature you'd like

🌟 Feature Description

The chat input field should wrap text automatically when a message gets long, instead of staying on one line and forcing users to scroll horizontally to read what they typed.

🔍 Problem Statement

Right now when you type a long message in the chat, the text goes off screen to the left and you have to scroll horizontally to see what you typed. This makes it hard to review and edit your message before sending it.

🎯 Expected Outcome

The input field should grow vertically as you type, wrapping text to the next line so everything stays visible. It should start as one line and expand up to around 5 lines before scrolling vertically.

📷 Screenshots and Design Ideas

Image

AI chat interfaces like Gemini and ChatGPT handle this the same way since users are also typing messages to a bot. The input box starts as one line and grows as the user types, keeping all the text visible at all times. This app should follow the same pattern since it serves the same purpose.

📋 Additional Context

The fix involves setting minLines: 1, maxLines: 5, and keyboardType: TextInputType.multiline on the TextField in chat_screen.dart. With this change, sending a message would be done using the send button instead of pressing Enter.

Record

  • I agree to follow this project's Code of Conduct
  • I want to work on implementing this feature

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions