ChatApp/lib/tools/HomePage.dart

import 'package:flutter/material.dart';

import 'Message.dart';

class Homepage extends StatefulWidget {
  const Homepage({super.key});

  @override
  State<Homepage> createState() => _HomepageState();
}

class _HomepageState extends State<Homepage> {
  List<Message> list = [];
  final TextEditingController _chatController = TextEditingController();
  String chatText = "";

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    list = [Message('你好', false), Message('你好', true)];

    //监听内容变化
    _chatController.addListener(() {
      chatText = _chatController.text;
      print("内容监听1：${_chatController.text}");
    });
  }

  @override
  void dispose() {
    _chatController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        title: Text(
          "王梦阳",
          style: TextStyle(fontSize: 18),
        ),
        backgroundColor: Colors.white,
        centerTitle: true,
      ),
      body: Container(
        child: Column(
          children: [
            Container(
              width: double.infinity,
              height: 1,
              color: Color(0xFFDFDFDF),
            ),
            Expanded(
                child: Container(
              alignment: Alignment.topCenter,
              child: ListView.builder(
                  // reverse: true,
                  itemCount: list.length,
                  itemBuilder: (Context, index) {
                    return _item(index);
                  }),
            )),
            Card(
              elevation: 5,
              color: Colors.white,
              margin: EdgeInsets.only(left: 16, right: 16, bottom: 30),
              child: Row(
                children: [
                  //输入框
                  Expanded(
                    child: Container(
                      margin: EdgeInsets.only(left: 16),
                      child: TextField(
                        controller: _chatController,
                        decoration: InputDecoration(
                          border: InputBorder.none, // 移除非聚焦状态下的边框
                          enabledBorder: InputBorder.none, // 移除获得焦点但未输入内容时的边框
                          focusedBorder: InputBorder.none, // 移除输入时的边框
                        ),
                      ),
                    ),
                  ),
                  GestureDetector(
                    onTap: () {
                      list.add(Message(chatText, true));
                      _chatController.clear();
                      setState(() {});
                    },
                    child: Container(
                      width: 70,
                      height: 50,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                          color: Color(0xFF006CFF), borderRadius: BorderRadius.all(Radius.circular(8.0))),
                      child: Text(
                        "发送",
                        style: TextStyle(color: Colors.white),
                      ),
                    ),
                  )
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  _item(index) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 8.0),
      child: !list[index].isMe
          ? Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Container(
                  width: 45,
                  height: 45,
                  color: Color(0xFFD8D8D8),
                  margin: EdgeInsets.only(left: 16),
                ),
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 16.0, vertical: 4.0),
                  padding: EdgeInsets.all(12.0),
                  decoration: BoxDecoration(
                    color: Color(0xFFECECEC),
                    borderRadius: BorderRadius.circular(16.0),
                  ),
                  child: Text(
                    list[index].text,
                    style: TextStyle(
                      fontSize: 16,
                      color: Colors.black,
                    ),
                  ),
                ),
              ],
            )
          : Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 16.0, vertical: 4.0),
                  padding: EdgeInsets.all(12.0),
                  decoration: BoxDecoration(
                    color: Color(0xFF006CFF),
                    borderRadius: BorderRadius.circular(16.0),
                  ),
                  child: Text(
                    list[index].text,
                    style: TextStyle(
                      fontSize: 16,
                      color: Colors.white,
                    ),
                  ),
                ),
                Container(
                  width: 45,
                  height: 45,
                  color: Color(0xFFD8D8D8),
                  margin: EdgeInsets.only(right: 16),
                ),
              ],
            ),
    );
  }
}