maobo/jinzhi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix：增加图片选择和拍照功能

Browse Source
This commit is contained in:
jingyun
2026-06-23 10:07:35 +08:00
parent 75ba309e8c
commit 8cf919283b
16 changed files with 1288 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/assets/presentation/asset_add_page.dart
+360 -42
View File
@@ -1,6 +1,13 @@
import 'package:flutter/material.dart';
import 'dart:io';
import 'package:flutter/material.dart' hide AssetImage;
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:image_picker/image_picker.dart';
import 'package:path_provider/path_provider.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import 'package:uuid/uuid.dart';
import 'package:wechat_assets_picker/wechat_assets_picker.dart';
import '../../../common/domain/metal_type.dart';
import '../../../common/domain/money.dart';
@@ -43,6 +50,16 @@ class _AssetAddPageState extends ConsumerState<AssetAddPage> {
final _noteCtrl = TextEditingController();
final _dateCtrl = TextEditingController(text: '2025-08-12');
final _channelCtrl = TextEditingController(text: '银行');
final _picker = ImagePicker();
final _images = <AssetImage>[];
final _uuid = const Uuid();
static const _maxImages = 9;
int get _remainingImageSlots => _maxImages - _images.length;
bool get _isImageLimitReached => _remainingImageSlots <= 0;
String get _imageLimitText => '最多可添加 $_maxImages 张图片';
@override
void dispose() {
@@ -91,6 +108,345 @@ class _AssetAddPageState extends ConsumerState<AssetAddPage> {
};
}
Future<void> pickDate(BuildContext context) async {
final DateTime? picked = await showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime(2000),
lastDate: DateTime.now(),
locale: const Locale('zh'),
);
if (picked != null) {
print(picked.toString());
}
}
Future<void> _showImageSourceSheet() async {
if (!mounted) return;
showModalBottomSheet<void>(
context: context,
backgroundColor: Colors.white,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(18)),
),
builder: (ctx) => SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 8),
Container(
width: 38,
height: 4,
decoration: BoxDecoration(
color: const Color(0xFFE3DFD4),
borderRadius: BorderRadius.circular(999),
),
),
const SizedBox(height: 14),
ListTile(
leading: const Icon(Icons.camera_alt_outlined),
title: const Text('拍照'),
onTap: () {
Navigator.of(ctx).pop();
_handleTakePhoto();
},
),
ListTile(
leading: const Icon(Icons.photo_library_outlined),
title: const Text('从相册选择'),
onTap: () {
Navigator.of(ctx).pop();
_handlePickFromGallery();
},
),
const SizedBox(height: 8),
ListTile(
title: const Text(
'取消',
textAlign: TextAlign.center,
style: TextStyle(color: Color(0xFF8A8780)),
),
onTap: () => Navigator.of(ctx).pop(),
),
],
),
),
);
}
Future<void> _handleTakePhoto() async {
final granted = await _requestCameraPermission();
if (!granted) {
_showPermissionDeniedDialog('相机');
return;
}
final file = await _picker.pickImage(
source: ImageSource.camera,
imageQuality: 80,
maxWidth: 2048,
);
if (file == null) return;
await _addPickedFile(file);
}
Future<void> _handlePickFromGallery() async {
final availableSlots = _remainingImageSlots;
if (availableSlots <= 0) return;
final assets = await AssetPicker.pickAssets(
context,
pickerConfig: AssetPickerConfig(
maxAssets: availableSlots,
requestType: RequestType.image,
themeColor: const Color(0xFFB5862A),
),
);
if (assets == null || assets.isEmpty) {
return;
}
final pickedImages = <AssetImage>[];
for (final asset in assets.take(availableSlots)) {
final file = await asset.file;
if (file == null) continue;
pickedImages.add(await _assetImageFromSourceFile(file));
}
if (pickedImages.isEmpty || !mounted) return;
setState(() {
_images.addAll(pickedImages);
});
}
Future<AssetImage> _assetImageFromXFile(XFile file) {
return _assetImageFromSourceFile(File(file.path));
}
Future<AssetImage> _assetImageFromSourceFile(File sourceFile) async {
final localId =
'img${DateTime.now().microsecondsSinceEpoch}${_uuid.v4().split('-').first}';
final extension = _extensionForPath(sourceFile.path);
final directory = await getApplicationSupportDirectory();
final imageDirectory = Directory('${directory.path}/asset_images');
if (!await imageDirectory.exists()) {
await imageDirectory.create(recursive: true);
}
final copiedFile = await sourceFile.copy(
'${imageDirectory.path}/$localId$extension',
);
return AssetImage(
localId: localId,
localPath: copiedFile.path,
createdAt: DateTime.now(),
);
}
String _extensionForPath(String path) {
final fileName = path.split(Platform.pathSeparator).last;
final dotIndex = fileName.lastIndexOf('.');
if (dotIndex <= 0 || dotIndex == fileName.length - 1) {
return '.jpg';
}
return fileName.substring(dotIndex);
}
Future<bool> _requestCameraPermission() async {
final status = await Permission.camera.status;
if (status.isGranted) return true;
final result = await Permission.camera.request();
return result.isGranted;
}
void _showPermissionDeniedDialog(String target) {
if (!mounted) return;
showDialog<void>(
context: context,
builder: (ctx) => AlertDialog(
title: const Text('权限不足'),
content: Text('无法访问$target，请在系统设置中开启权限。'),
actions: [
TextButton(
onPressed: () => Navigator.of(ctx).pop(),
child: const Text('取消'),
),
TextButton(
onPressed: () {
Navigator.of(ctx).pop();
openAppSettings();
},
child: const Text('去设置'),
),
],
),
);
}
Future<void> _addPickedFile(XFile file) async {
if (_images.length >= _maxImages) return;
final image = await _assetImageFromXFile(file);
if (!mounted) return;
setState(() {
_images.add(image);
});
}
void _removeImage(String localId) {
setState(() {
_images.removeWhere((item) => item.localId == localId);
});
}
Widget _buildImagesSection() {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(14),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: const Color(0xFFECEAE3), width: 0.5),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (_images.isEmpty) ...[
GestureDetector(
onTap: _showImageSourceSheet,
child: Row(
children: [
Container(
width: 60,
height: 60,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(11),
border: Border.all(
color: const Color(0xFFD3CDBE),
width: 0.5,
),
),
child: const Icon(
Icons.camera_alt_outlined,
color: Color(0xFFB3AFA5),
),
),
const SizedBox(width: 10),
const Expanded(
child: Text(
'添加发票 / 实物照片（选填，仅存本机）',
style: TextStyle(fontSize: 12, color: Color(0xFFB3AFA5)),
),
),
],
),
),
const SizedBox(height: 8),
const Text(
'支持发票、收据、金条证书、实物照片。',
style: TextStyle(fontSize: 12, color: Color(0xFFB3AFA5)),
),
] else ...[
const Text(
'凭证照片',
style: TextStyle(fontSize: 13, color: Color(0xFF8A8780)),
),
const SizedBox(height: 12),
Wrap(
spacing: 8,
runSpacing: 8,
children: [
for (final image in _images) _buildImageTile(image),
if (!_isImageLimitReached)
GestureDetector(
onTap: _showImageSourceSheet,
child: Container(
width: 84,
height: 84,
decoration: BoxDecoration(
color: const Color(0xFFF6ECD6),
borderRadius: BorderRadius.circular(12),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: const [
Icon(Icons.add, color: Color(0xFFB5862A)),
SizedBox(height: 5),
Text(
'继续补充',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 11,
color: Color(0xFFB5862A),
),
),
],
),
),
),
if (_isImageLimitReached)
Container(
width: 84,
height: 84,
decoration: BoxDecoration(
color: const Color(0xFFF2F0EA),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: const Color(0xFFE3DFD4),
width: 0.5,
),
),
alignment: Alignment.center,
child: const Text(
'已满 9 张',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 11, color: Color(0xFF8A8780)),
),
),
],
),
const SizedBox(height: 10),
Text(
_imageLimitText,
style: const TextStyle(fontSize: 12, color: Color(0xFFB3AFA5)),
),
],
],
),
);
}
Widget _buildImageTile(AssetImage image) {
return Stack(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Image.file(
File(image.localPath),
width: 84,
height: 84,
fit: BoxFit.cover,
),
),
Positioned(
top: 6,
right: 6,
child: GestureDetector(
onTap: () => _removeImage(image.localId),
child: Container(
width: 22,
height: 22,
decoration: const BoxDecoration(
color: Color(0xAA000000),
shape: BoxShape.circle,
),
child: const Icon(Icons.close, size: 14, color: Colors.white),
),
),
),
],
);
}
@override
Widget build(BuildContext context) {
final cs = ShadTheme.of(context).colorScheme;
@@ -404,48 +760,9 @@ class _AssetAddPageState extends ConsumerState<AssetAddPage> {
),
),
const SizedBox(height: 10),
Container(
padding: const EdgeInsets.fromLTRB(14, 14, 14, 14),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: const Color(0xFFECEAE3),
width: 0.5,
),
),
child: Row(
children: [
Container(
width: 60,
height: 60,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(11),
border: Border.all(
color: const Color(0xFFD3CDBE),
width: 0.5,
),
),
child: const Icon(
Icons.camera_alt_outlined,
color: Color(0xFFB3AFA5),
),
),
const SizedBox(width: 10),
const Expanded(
child: Text(
'添加发票 / 实物照片（选填，仅存本机）',
style: TextStyle(
fontSize: 12,
color: Color(0xFFB3AFA5),
),
),
),
],
),
),
_buildImagesSection(),
const SizedBox(height: 16),
],
const SizedBox(height: 16),
SizedBox(
width: double.infinity,
child: FilledButton(
@@ -468,6 +785,7 @@ class _AssetAddPageState extends ConsumerState<AssetAddPage> {
note: _noteCtrl.text.trim().isEmpty
? null
: _noteCtrl.text.trim(),
images: List<AssetImage>.unmodifiable(_images),
createdAt: DateTime.now(),
updatedAt: DateTime.now(),
);