From d2546d7dbba88b0c1c731ddb5d3c2c4cec88a6c3 Mon Sep 17 00:00:00 2001 From: Chen Li <422043296@qq.com> Date: Fri, 22 Aug 2025 16:32:13 +0800 Subject: [PATCH] flexible message --- lib/screens/part_screen.dart | 125 +++++++++++++++-------------------- lib/widgets/chat_box.dart | 47 ++++++++----- 2 files changed, 83 insertions(+), 89 deletions(-) diff --git a/lib/screens/part_screen.dart b/lib/screens/part_screen.dart index 326205a..40d8b89 100644 --- a/lib/screens/part_screen.dart +++ b/lib/screens/part_screen.dart @@ -23,7 +23,8 @@ class _PartScreenState extends State { void initState() { super.initState(); WidgetsBinding.instance.addPostFrameCallback((_) { - final messageService = Provider.of(context, listen: false); + final messageService = + Provider.of(context, listen: false); messageService.removeNonListeningMessages(); setState(() { _isInitialized = true; @@ -65,18 +66,9 @@ class _PartScreenState extends State { if (!_isInitialized) { return const SizedBox.shrink(); } - final double minHeight = constraints.maxHeight * 0.18; + final double minHeight = constraints.maxHeight * 0.16; final double maxHeight = constraints.maxHeight * 0.4; final double chatWidth = constraints.maxWidth * 0.94; - final int messageCount = - context.watch().messages.length; - double chatHeight; - if (messageCount <= 1) { - chatHeight = minHeight + 70; - } else { - final height = minHeight + (messageCount * 78); - chatHeight = height < maxHeight ? height : maxHeight; - } return Stack( children: [ Positioned.fill( @@ -103,74 +95,63 @@ class _PartScreenState extends State { padding: EdgeInsets.only(bottom: constraints.maxHeight * 0.22), child: Align( alignment: Alignment.bottomCenter, - child: Selector( - selector: (_, service) => service.messages.length, - builder: (context, messageCount, child) { + child: Consumer( + builder: (context, messageService, child) { WidgetsBinding.instance.addPostFrameCallback((_) { _scrollToBottom(); }); - return Consumer( - builder: (context, messageService, child) { - return AnimatedContainer( - duration: const Duration(milliseconds: 180), - curve: Curves.easeInOut, - width: chatWidth, - height: chatHeight, - child: ClipRRect( - borderRadius: BorderRadius.circular(24), - child: BackdropFilter( - filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12), - child: GradientBackground( - colors: const [ - Color(0XBF3B0A3F), - Color(0xBF0E0E24), - Color(0xBF0C0B33), - ], - borderRadius: BorderRadius.circular(6), - child: Stack( - children: [ - Padding( - padding: const EdgeInsets.only( - top: 42, - left: 6, - right: 6, - bottom: 6), - child: Column( - children: [ - Expanded( - child: Padding( - padding: EdgeInsets.only( - top: 12, bottom: 12), - child: ChatBox( - scrollController: - _scrollController, - messages: messageService.messages, - ), - ), - ), - ], - ), - ), - Positioned( - top: 6, + return Container( + width: chatWidth, + constraints: BoxConstraints( + minHeight: minHeight, + maxHeight: maxHeight, + ), + child: ClipRRect( + borderRadius: BorderRadius.circular(24), + child: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12), + child: GradientBackground( + colors: const [ + Color(0XBF3B0A3F), + Color(0xBF0E0E24), + Color(0xBF0C0B33), + ], + borderRadius: BorderRadius.circular(6), + child: Stack( + children: [ + Padding( + padding: const EdgeInsets.only( + top: 50, + left: 6, right: 6, - child: IconButton( - icon: Image.asset( - 'assets/images/open_in_full.png', - width: 24, - height: 24 - ), - onPressed: _openFullScreen, - padding: EdgeInsets.zero, - ), - ), - ], + bottom: 30), + child: LayoutBuilder( + builder: (context, boxConstraints) { + return ChatBox( + scrollController: _scrollController, + messages: messageService.messages, + ); + } + ), ), - ), + Positioned( + top: 6, + right: 6, + child: IconButton( + icon: Image.asset( + 'assets/images/open_in_full.png', + width: 24, + height: 24 + ), + onPressed: _openFullScreen, + padding: EdgeInsets.zero, + ), + ), + ], ), ), - ); - }, + ), + ), ); }, ), diff --git a/lib/widgets/chat_box.dart b/lib/widgets/chat_box.dart index b11ffe9..3ee9090 100644 --- a/lib/widgets/chat_box.dart +++ b/lib/widgets/chat_box.dart @@ -13,23 +13,36 @@ class ChatBox extends StatelessWidget { @override Widget build(BuildContext context) { - return ListView.builder( - controller: scrollController, - itemCount: messages.length, - reverse: true, - padding: const EdgeInsets.symmetric(horizontal: 12), - itemBuilder: (context, index) { - final message = messages[messages.length - 1 - index]; - final isTop = index == messages.length - 1; - final isBottom = index == 0; - return Padding( - padding: EdgeInsets.only( - top: isTop ? 0 : 6, - bottom: isBottom ? 0 : 6, - ), - child: ChatBubble(message: message), - ); - }, + return Container( + constraints: const BoxConstraints( + minHeight: 60, + ), + decoration: BoxDecoration( + border: Border.all( + color: Colors.grey, // 边框颜色 + width: 1.0, // 边框宽度 + ), + borderRadius: BorderRadius.circular(8.0), // 边框圆角 + ), + child: ListView.builder( + controller: scrollController, + itemCount: messages.length, + reverse: true, + padding: const EdgeInsets.symmetric(horizontal: 12), + shrinkWrap: true, + itemBuilder: (context, index) { + final message = messages[messages.length - 1 - index]; + final isTop = index == messages.length - 1; + final isBottom = index == 0; + return Padding( + padding: EdgeInsets.only( + top: isTop ? 0 : 6, + bottom: isBottom ? 0 : 6, + ), + child: ChatBubble(message: message), + ); + }, + ), ); } }