🚀[기능개선][채팅] 채팅 입력창 멀티라인 입력 시 UI 개선

📝 현재 문제점
---

- 채팅 입력창에서 Enter로 줄바꿈하여 여러 줄 입력 시, 입력창의 모서리 라운드 값(100.r)이 과도하게 높아 UI가 비정상적으로 보임
- 텍스트 시작 위치가 과도하게 안쪽으로 밀려들어가고, 전체적으로 입력창이 부자연스럽게 둥글어짐
- 전송 버튼(↑)과 추가 버튼(+)이 입력창 높이의 중간에 위치하여, 줄이 늘어났을 때 다른 채팅 앱(인스타그램 DM 등)과 비교했을 때 부자연스러움

🛠️ 해결 방안 / 제안 기능
---

- **버튼 하단 고정**: 전송 버튼(↑)과 추가 버튼(+)을 입력창 높이가 늘어나도 항상 하단에 고정 (인스타그램 DM 방식 참고)
- **라운드 값 동적 전환**: 1줄일 때는 캡슐형(pill) 유지, 여러 줄로 늘어날 때 라운드 값을 자연스럽게 줄임 (약 20.r 수준의 둥근 사각형)
- **자연스러운 전환**: 사용자가 변화를 인지하기 어려울 정도로 부드럽게 라운드 값이 전환되어야 함

📸 참고 자료
---

- 인스타그램 DM 채팅 입력창 참고: 줄이 늘어나도 적절한 라운드 값 유지, 버튼은 항상 하단 고정

⚙️ 작업 내용
---

- 채팅 입력 바(ChatInputBar) 위젯의 버튼 정렬을 중앙(center) → 하단(end)으로 변경
- 입력창 BorderRadius를 고정 100.r에서 줄 수에 따라 동적으로 변경되도록 수정
- 라운드 값 전환이 자연스럽도록 처리

🙋‍♂️ 담당자
---

- 백엔드: 이름 
- 프론트엔드: @Cassiiopeia 
- 디자인: 이름


Provide feedback

Saved searches

Use saved searches to filter your results more quickly

🚀[기능개선][채팅] 채팅 입력창 멀티라인 입력 시 UI 개선 #716

📝 현재 문제점

🛠️ 해결 방안 / 제안 기능

📸 참고 자료

⚙️ 작업 내용

🙋‍♂️ 담당자

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

🚀[기능개선][채팅] 채팅 입력창 멀티라인 입력 시 UI 개선 #716

Description

📝 현재 문제점

🛠️ 해결 방안 / 제안 기능

📸 참고 자료

⚙️ 작업 내용

🙋‍♂️ 담당자

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions