Browse Source

refactor(agent_view): 优化扩展选项按钮的布局和滚动行为

将Row改为Wrap布局实现按钮自动换行
添加水平滚动确保在小屏幕设备上可用
调整容器高度和边距以改善视觉效果
weicu
lxm 1 year ago
parent
commit
fd54772946
  1. 124
      lib/modules/agent/views/agent_view.dart

124
lib/modules/agent/views/agent_view.dart

@ -1,5 +1,6 @@
import 'dart:async';
import 'dart:io';
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/agent_controller.dart';
@ -731,62 +732,77 @@ class _AgentViewState extends State<AgentView> with WidgetsBindingObserver {
return AnimatedContainer(
duration: const Duration(milliseconds: 300),
curve: Curves.easeInOut,
height: isExpanded ? 120.h : 0, // 调整高度以适应按钮尺寸
height: isExpanded ? 100.h : 0, // 调整高度以适应按钮尺寸
child: isExpanded
? Container(
margin: EdgeInsets.only(top: 8.h),
padding:
EdgeInsets.symmetric(horizontal: 16.w),
child: Row(
mainAxisAlignment: MainAxisAlignment
.spaceEvenly, // 改为均匀分布
children: [
// 相机按钮
_buildPlusOptionButton(
context: context,
icon: Icons.camera_alt,
label: 'takePhoto'.tr, // 拍照
onTap: () async {
//controller.collapsePlusOptions();
await controller.takePhoto();
},
isDarkMode: isDarkMode,
),
// 相册按钮
_buildPlusOptionButton(
context: context,
icon: Icons.photo_library,
label: 'photoAlbum'.tr, // 相册
onTap: () async {
//controller.collapsePlusOptions();
await controller.pickImage();
},
isDarkMode: isDarkMode,
),
// 文件按钮(预留位置)
// _buildPlusOptionButton(
// context: context,
// icon: Icons.folder,
// label: '文件',
// onTap: () {
// //controller.collapsePlusOptions();
// // TODO: 实现文件选择功能
// },
// isDarkMode: isDarkMode,
// ),
// 通话按钮
_buildPlusOptionButton(
context: context,
icon: Icons.phone,
label: 'makeCall'.tr, // 打电话
onTap: () {
// 启动打电话模式
controller.startPhoneCall();
},
isDarkMode: isDarkMode,
? LayoutBuilder(
// 添加LayoutBuilder获取实际约束
builder: (context, constraints) {
return SingleChildScrollView(
// 确保内容可滚动
scrollDirection:
Axis.horizontal, // 水平滚动
child: Container(
margin: EdgeInsets.only(top: 16.h),
padding: EdgeInsets.symmetric(
horizontal: 16.w),
// 根据可用宽度调整容器宽度
width: max(constraints.maxWidth,
300.w), // 最小300宽
child: Wrap(
// 使用Wrap替代Row,自动换行
alignment: WrapAlignment.center,
spacing: 26.w, // 按钮水平间距
runSpacing: 8.h, // 按钮垂直间距
children: [
// 相机按钮
_buildPlusOptionButton(
context: context,
icon: Icons.camera_alt,
label: 'takePhoto'.tr, // 拍照
onTap: () async {
//controller.collapsePlusOptions();
await controller.takePhoto();
},
isDarkMode: isDarkMode,
),
// 相册按钮
_buildPlusOptionButton(
context: context,
icon: Icons.photo_library,
label: 'photoAlbum'.tr, // 相册
onTap: () async {
//controller.collapsePlusOptions();
await controller.pickImage();
},
isDarkMode: isDarkMode,
),
// 文件按钮(预留位置)
// _buildPlusOptionButton(
// context: context,
// icon: Icons.folder,
// label: '文件',
// onTap: () {
// //controller.collapsePlusOptions();
// // TODO: 实现文件选择功能
// },
// isDarkMode: isDarkMode,
// ),
// 通话按钮
_buildPlusOptionButton(
context: context,
icon: Icons.phone,
label: 'makeCall'.tr, // 打电话
onTap: () {
// 启动打电话模式
controller.startPhoneCall();
},
isDarkMode: isDarkMode,
),
],
),
),
],
),
);
},
)
: const SizedBox.shrink(),
);

Loading…
Cancel
Save