flexible message

This commit is contained in:
Chen Li
2025-08-22 16:32:13 +08:00
parent 7b57322170
commit d2546d7dbb
2 changed files with 83 additions and 89 deletions

View File

@@ -23,7 +23,8 @@ class _PartScreenState extends State<PartScreen> {
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) {
final messageService = Provider.of<MessageService>(context, listen: false);
final messageService =
Provider.of<MessageService>(context, listen: false);
messageService.removeNonListeningMessages();
setState(() {
_isInitialized = true;
@@ -65,18 +66,9 @@ class _PartScreenState extends State<PartScreen> {
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<MessageService>().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<PartScreen> {
padding: EdgeInsets.only(bottom: constraints.maxHeight * 0.22),
child: Align(
alignment: Alignment.bottomCenter,
child: Selector<MessageService, int>(
selector: (_, service) => service.messages.length,
builder: (context, messageCount, child) {
child: Consumer<MessageService>(
builder: (context, messageService, child) {
WidgetsBinding.instance.addPostFrameCallback((_) {
_scrollToBottom();
});
return Consumer<MessageService>(
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,
),
),
],
),
),
);
},
),
),
);
},
),

View File

@@ -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),
);
},
),
);
}
}