개발하는 두더지

코드를 먼저 살펴보면 아래와 같습니다. 하단에 대화를 입력할 수 있는 TextField와 send 버튼이 있고, send 버튼을 누르면 리스트에 텍스트 내용이 하나씩 저장되는 구조입니다. 하나의 채팅 메시지를 나타내는 위젯이 필요합니다. 아래와 같이 ChatMessage라는 StatelessWidget을 만들어줍니다. 메시지를 보낸 사용자를 나타내는 간단한 그래픽 아바타, 보낸 사람 이름이 들어있는 Column 위젯 및 메시지 텍스트를 표시하는 Row 위젯을 리턴합니다. CircleAvatar 위젯을 커스텀하기 위해서 _name 변수 값의 첫 번째 문자를 텍스트 위젯에 전달하여 사용자의 첫 번째 이니셜로 레이블을 지정합니다. CrossAxisAlignment.start를 row 생성자의 crossAxis..

Flutter framework에는 TextField라 불리는 상태 기반 위젯이 있습니다. 입력 필드의 동작을 커스텀하는 속성을 가진 상태 기반 위젯입니다. State 란 위젯이 빌드되고 위젯 생명주기 동안 변경될 때 동기적으로 읽을 수 있는 정보입니다. 위젯에 상태기반 데이터를 표시하기 위해서는 데이터를 State object에 캡슐화해야 합니다. 그런 다음 State 객체를 StatefulWidget 클래스를 확장한 위젯과 연결할 수 있습니다. import 'package:flutter/material.dart'; void main() => runApp(FriendlychatApp()); class FriendlychatApp extends StatelessWidget { @override Widge..