Browse Source

feat: 添加图片消息点击查看功能

在消息气泡中点击图片时,打开全屏图片查看器。新增 `photo_view` 依赖并实现 `openImageViewer` 方法,提升用户体验。
newdev_shunjiawei
lxm 1 year ago
parent
commit
957f5e133c
  1. 25
      lib/modules/agent/controllers/agent_controller.dart
  2. 42
      lib/modules/agent/views/message_bubble.dart
  3. 1
      pubspec.yaml

25
lib/modules/agent/controllers/agent_controller.dart

@ -15,6 +15,7 @@ import 'package:permission_handler/permission_handler.dart';
import 'package:app_settings/app_settings.dart'; import 'package:app_settings/app_settings.dart';
import 'package:deep_voice/core/utils/logger.dart'; import 'package:deep_voice/core/utils/logger.dart';
import 'package:path_provider/path_provider.dart'; import 'package:path_provider/path_provider.dart';
import 'package:photo_view/photo_view.dart';
class Message { class Message {
final bool isUser; //标识信息是否来自用户还是AI final bool isUser; //标识信息是否来自用户还是AI
@ -959,4 +960,28 @@ class AgentController extends GetxController {
void openNavigation(String start, String end, String ntype) { void openNavigation(String start, String end, String ntype) {
_navigationManager.open(start, end, ntype); _navigationManager.open(start, end, ntype);
} }
// 打开图片查看器
void openImageViewer(BuildContext context, String imagePath) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Scaffold(
appBar: AppBar(
backgroundColor: Colors.black,
iconTheme: IconThemeData(color: Colors.white),
),
body: Container(
color: Colors.black,
child: PhotoView(
imageProvider: FileImage(File(imagePath)),
minScale: PhotoViewComputedScale.contained,
maxScale: PhotoViewComputedScale.covered * 2,
backgroundDecoration: BoxDecoration(color: Colors.black),
),
),
),
),
);
}
} }

42
lib/modules/agent/views/message_bubble.dart

@ -215,13 +215,20 @@ class MessageBubble extends GetView<AgentController> {
if (message == '[图片]') { if (message == '[图片]') {
return Container( return Container(
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(8),
child: ClipRRect( child: GestureDetector(
borderRadius: BorderRadius.circular(12), onTap: () {
child: Image.file( // 点击图片时打开图片查看器
File(imagePath!), Get.find<AgentController>()
width: 200, .openImageViewer(context, imagePath ?? '');
height: 200, },
fit: BoxFit.cover, child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Image.file(
File(imagePath!),
width: 200,
height: 200,
fit: BoxFit.cover,
),
), ),
), ),
); );
@ -241,13 +248,20 @@ class MessageBubble extends GetView<AgentController> {
), ),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
ClipRRect( GestureDetector(
borderRadius: BorderRadius.circular(12), onTap: () {
child: Image.file( // 点击图片时打开图片查看器
File(imagePath!), Get.find<AgentController>()
width: 200, .openImageViewer(context, imagePath ?? '');
height: 200, },
fit: BoxFit.cover, child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Image.file(
File(imagePath!),
width: 200,
height: 200,
fit: BoxFit.cover,
),
), ),
), ),
], ],

1
pubspec.yaml

@ -37,6 +37,7 @@ dependencies:
file_picker: ^10.1.5 file_picker: ^10.1.5
haptic_feedback: ^0.5.1+1 haptic_feedback: ^0.5.1+1
tencentcloud_cos_sdk_plugin: ^1.2.3 tencentcloud_cos_sdk_plugin: ^1.2.3
photo_view: ^0.15.0
window_size: window_size:
git: git:

Loading…
Cancel
Save