dellevin/MookNote
1
0
Fork 0
generated from dellevin/template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.1.6版本

Browse Source
This commit is contained in:
DelLevin-Home
2026-03-12 23:33:41 +08:00
parent 235b42c620
commit e181ebf9c6
36 changed files with 5450 additions and 2053 deletions
Download Patch File Download Diff File Expand all files Collapse all files

213
lib/pages/note/note_detail_page.dart
View File

@@ -77,28 +77,29 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
// 标签区域
if (note.tags.isNotEmpty)
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
decoration: const BoxDecoration(
border: Border(
bottom: BorderSide(color: Color(0xFFE5E5E5), width: 0.5),
bottom: BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
),
child: Row(
children: [
Wrap(
spacing: 8,
runSpacing: 8,
spacing: 10,
runSpacing: 10,
children: note.tags.map((tag) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
border: Border.all(color: const Color(0xFFE5E5E5)),
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Text(
tag,
style: const TextStyle(
fontSize: 12,
fontSize: 13,
color: Color(0xFF666666),
),
),
@@ -119,10 +120,10 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
// 图片区域（仅在纯文本模式下显示）
if (note.contentType == 'plain_text' && note.images.isNotEmpty)
Container(
padding: const EdgeInsets.fromLTRB(20, 16, 20, 20),
padding: const EdgeInsets.fromLTRB(20, 20, 20, 24),
decoration: const BoxDecoration(
border: Border(
top: BorderSide(color: Color(0xFFE5E5E5), width: 0.5),
top: BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
),
child: Column(
@@ -131,25 +132,35 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
// 图片标题
Row(
children: [
const Icon(
Icons.image_outlined,
size: 14,
color: Color(0xFF999999),
Container(
width: 32,
height: 32,
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: const Icon(
Icons.image_outlined,
size: 18,
color: Color(0xFF666666),
),
),
const SizedBox(width: 6),
const SizedBox(width: 12),
Text(
'图片 (${note.images.length})',
style: const TextStyle(
fontSize: 12,
color: Color(0xFF999999),
fontSize: 15,
fontWeight: FontWeight.w600,
color: Color(0xFF1A1A1A),
),
),
],
),
const SizedBox(height: 12),
const SizedBox(height: 16),
// 图片列表
SizedBox(
height: 100,
height: 110,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: note.images.length,
@@ -157,12 +168,14 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
return GestureDetector(
onTap: () => _showImagePreview(context, note.images, index),
child: Container(
width: 100,
height: 100,
width: 110,
height: 110,
margin: const EdgeInsets.only(right: 12),
decoration: BoxDecoration(
border: Border.all(color: const Color(0xFFE5E5E5)),
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
clipBehavior: Clip.antiAlias,
child: Image.file(
File(note.images[index]),
fit: BoxFit.cover,
@@ -180,58 +193,51 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
Container(
decoration: const BoxDecoration(
border: Border(
top: BorderSide(color: Color(0xFFE5E5E5), width: 0.5),
top: BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
),
child: SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
child: Column(
mainAxisSize: MainAxisSize.min,
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
child: Row(
children: [
// 创建时间和更新时间
// 时间信息
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'创建 ${_formatDateTime(note.createdAt)}',
style: const TextStyle(
fontSize: 12,
color: Color(0xFF999999),
),
),
const SizedBox(height: 4),
Text(
'更新 ${_formatDateTime(note.updatedAt)}',
style: const TextStyle(
fontSize: 12,
color: Color(0xFF999999),
),
),
],
),
),
// 操作按钮
Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'创建时间：${_formatDateTime(note.createdAt)}',
style: const TextStyle(
fontSize: 11,
color: Color(0xFF999999),
),
),
const SizedBox(height: 4),
Text(
'更新时间：${_formatDateTime(note.updatedAt)}',
style: const TextStyle(
fontSize: 11,
color: Color(0xFF999999),
),
),
],
),
_buildActionButton(
icon: Icons.edit_outlined,
color: const Color(0xFF666666),
onTap: () => _navigateToEdit(context),
),
Row(
children: [
IconButton(
icon: const Icon(Icons.edit_outlined, size: 20),
color: const Color(0xFF666666),
onPressed: () => _navigateToEdit(context),
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
),
const SizedBox(width: 16),
IconButton(
icon: const Icon(Icons.delete_outline, size: 20),
color: Colors.red,
onPressed: () => _showDeleteDialog(context),
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
),
],
const SizedBox(width: 12),
_buildActionButton(
icon: Icons.delete_outline,
color: Colors.red,
onTap: () => _showDeleteDialog(context),
),
],
),
@@ -349,8 +355,9 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
(n) => n.id == widget.note.id,
orElse: () => widget.note,
);
Navigator.pushNamed(context, '/note-form', arguments: currentNote).then((_) {
context.read<AppProvider>().loadNotes();
Navigator.pushNamed(context, '/note-form', arguments: currentNote).then((_) async {
// 返回时刷新笔记列表
await context.read<AppProvider>().loadNotes();
});
}
@@ -380,6 +387,35 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
);
}
/// 构建操作按钮
Widget _buildActionButton({
required IconData icon,
required Color color,
required VoidCallback onTap,
}) {
return Container(
width: 40,
height: 40,
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(10),
child: Icon(
icon,
color: color,
size: 20,
),
),
),
);
}
/// 显示删除对话框
void _showDeleteDialog(BuildContext context) {
showDialog(
@@ -387,25 +423,54 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
builder: (context) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: const Text('确认删除'),
content: const Text('确定要删除这条笔记吗？'),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
title: const Text(
'确认删除',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
content: const Text(
'确定要删除这条笔记吗？删除后可在回收站恢复。',
style: TextStyle(
fontSize: 14,
color: Color(0xFF666666),
height: 1.5,
),
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('取消', style: TextStyle(color: Color(0xFF666666))),
style: TextButton.styleFrom(
foregroundColor: const Color(0xFF666666),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('取消'),
),
TextButton(
ElevatedButton(
onPressed: () async {
await context.read<AppProvider>().removeNote(widget.note.id);
// 刷新笔记列表
await context.read<AppProvider>().loadNotes();
if (!mounted) return;
Navigator.pop(context);
Navigator.pop(context);
ToastUtil.show(context, '已删除');
},
child: const Text('删除', style: TextStyle(color: Colors.red)),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.red,
foregroundColor: Colors.white,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('删除'),
),
],
actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
),
);
}

399
lib/pages/note/note_form_page.dart
View File

@@ -53,15 +53,10 @@ class _NoteFormPageState extends State<NoteFormPage> {
appBar: AppBar(
title: Text(_isEditing ? '编辑笔记' : '新建笔记'),
actions: [
TextButton(
IconButton(
onPressed: _saveNote,
child: const Text(
'保存',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
icon: const Icon(Icons.save_outlined),
tooltip: '保存',
),
const SizedBox(width: 8),
],
@@ -70,10 +65,10 @@ class _NoteFormPageState extends State<NoteFormPage> {
children: [
// 顶部信息栏：创建时间 + 格式选择 + 标签
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
decoration: const BoxDecoration(
border: Border(
bottom: BorderSide(color: Color(0xFFE5E5E5), width: 0.5),
bottom: BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
),
child: Column(
@@ -82,11 +77,19 @@ class _NoteFormPageState extends State<NoteFormPage> {
Row(
children: [
// 创建时间
Text(
_formatDateTime(_createdAt),
style: const TextStyle(
fontSize: 12,
color: Color(0xFF999999),
Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(6),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Text(
_formatDateTime(_createdAt),
style: const TextStyle(
fontSize: 12,
color: Color(0xFF666666),
),
),
),
const Spacer(),
@@ -94,7 +97,7 @@ class _NoteFormPageState extends State<NoteFormPage> {
_buildFormatSelector(),
],
),
const SizedBox(height: 8),
const SizedBox(height: 12),
// 标签
_buildTagSelector(),
],
@@ -155,18 +158,33 @@ class _NoteFormPageState extends State<NoteFormPage> {
// 图片网格区域
Expanded(
child: Container(
padding: const EdgeInsets.all(16),
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 标题栏
Row(
children: [
Container(
width: 32,
height: 32,
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: const Icon(
Icons.image_outlined,
size: 18,
color: Color(0xFF666666),
),
),
const SizedBox(width: 12),
const Text(
'图片',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
fontSize: 15,
fontWeight: FontWeight.w600,
color: Color(0xFF1A1A1A),
),
),
@@ -174,7 +192,7 @@ class _NoteFormPageState extends State<NoteFormPage> {
Text(
'${_images.length}',
style: const TextStyle(
fontSize: 14,
fontSize: 15,
color: Color(0xFF999999),
),
),
@@ -183,24 +201,25 @@ class _NoteFormPageState extends State<NoteFormPage> {
InkWell(
onTap: _pickImage,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
decoration: BoxDecoration(
color: const Color(0xFF1A1A1A),
borderRadius: BorderRadius.circular(2),
borderRadius: BorderRadius.circular(8),
),
child: const Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.add,
size: 16,
size: 18,
color: Colors.white,
),
SizedBox(width: 4),
SizedBox(width: 6),
Text(
'添加',
style: TextStyle(
fontSize: 12,
fontSize: 13,
fontWeight: FontWeight.w500,
color: Colors.white,
),
),
@@ -211,7 +230,7 @@ class _NoteFormPageState extends State<NoteFormPage> {
],
),
const SizedBox(height: 12),
const SizedBox(height: 16),
// 图片网格（4列，正方形铺满）
Expanded(
@@ -220,17 +239,33 @@ class _NoteFormPageState extends State<NoteFormPage> {
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.image_outlined,
size: 48,
color: const Color(0xFFCCCCCC),
Container(
width: 80,
height: 80,
decoration: BoxDecoration(
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(20),
),
child: const Icon(
Icons.image_outlined,
size: 40,
color: Color(0xFFCCCCCC),
),
),
const SizedBox(height: 16),
const Text(
'暂无图片',
style: TextStyle(
fontSize: 15,
color: Color(0xFF999999),
),
),
const SizedBox(height: 8),
const Text(
'点击添加按钮添加图片',
'点击右上角添加按钮添加图片',
style: TextStyle(
fontSize: 13,
color: Color(0xFF999999),
color: Color(0xFFBBBBBB),
),
),
],
@@ -239,8 +274,8 @@ class _NoteFormPageState extends State<NoteFormPage> {
: GridView.builder(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4,
crossAxisSpacing: 8,
mainAxisSpacing: 8,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
childAspectRatio: 1.0,
),
itemCount: _images.length,
@@ -264,30 +299,33 @@ class _NoteFormPageState extends State<NoteFormPage> {
return GestureDetector(
onTap: () => _showFormatSelector(),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
border: Border.all(color: const Color(0xFFE5E5E5)),
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
_contentType == 'markdown' ? Icons.code : Icons.text_fields,
size: 14,
size: 16,
color: const Color(0xFF666666),
),
const SizedBox(width: 4),
const SizedBox(width: 6),
Text(
_contentType == 'markdown' ? 'Markdown' : '纯文本',
style: const TextStyle(
fontSize: 12,
fontSize: 13,
fontWeight: FontWeight.w500,
color: Color(0xFF666666),
),
),
const SizedBox(width: 4),
const Icon(
Icons.arrow_drop_down,
size: 16,
size: 18,
color: Color(0xFF999999),
),
],
@@ -301,36 +339,132 @@ class _NoteFormPageState extends State<NoteFormPage> {
showModalBottomSheet(
context: context,
backgroundColor: Colors.white,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
),
builder: (context) => SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ListTile(
leading: const Icon(Icons.code, size: 20),
title: const Text('Markdown'),
subtitle: const Text('支持 Markdown 语法'),
trailing: _contentType == 'markdown'
? const Icon(Icons.check, color: Color(0xFF1A1A1A))
: null,
// 顶部指示条
Container(
margin: const EdgeInsets.only(top: 12, bottom: 16),
width: 40,
height: 4,
decoration: BoxDecoration(
color: const Color(0xFFE0E0E0),
borderRadius: BorderRadius.circular(2),
),
),
// 标题
const Padding(
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 8),
child: Row(
children: [
Text(
'选择格式',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Color(0xFF1A1A1A),
),
),
],
),
),
const SizedBox(height: 8),
_buildFormatOption(
icon: Icons.code,
title: 'Markdown',
subtitle: '支持 Markdown 语法',
isSelected: _contentType == 'markdown',
onTap: () {
setState(() => _contentType = 'markdown');
Navigator.pop(context);
},
),
const Divider(height: 0.5, indent: 56),
ListTile(
leading: const Icon(Icons.text_fields, size: 20),
title: const Text('纯文本'),
subtitle: const Text('普通文本格式，支持图片'),
trailing: _contentType == 'plain_text'
? const Icon(Icons.check, color: Color(0xFF1A1A1A))
: null,
_buildFormatOption(
icon: Icons.text_fields,
title: '纯文本',
subtitle: '普通文本格式，支持图片',
isSelected: _contentType == 'plain_text',
onTap: () {
setState(() => _contentType = 'plain_text');
Navigator.pop(context);
},
),
const SizedBox(height: 16),
],
),
),
);
}
/// 构建格式选项
Widget _buildFormatOption({
required IconData icon,
required String title,
required String subtitle,
required bool isSelected,
required VoidCallback onTap,
}) {
return InkWell(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
child: Row(
children: [
Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
borderRadius: BorderRadius.circular(10),
),
child: Icon(
icon,
size: 22,
color: const Color(0xFF666666),
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
color: Color(0xFF1A1A1A),
),
),
const SizedBox(height: 4),
Text(
subtitle,
style: const TextStyle(
fontSize: 13,
color: Color(0xFF999999),
),
),
],
),
),
if (isSelected)
Container(
width: 24,
height: 24,
decoration: BoxDecoration(
color: const Color(0xFF1A1A1A),
borderRadius: BorderRadius.circular(12),
),
child: const Icon(
Icons.check,
size: 16,
color: Colors.white,
),
),
],
),
),
@@ -340,16 +474,17 @@ class _NoteFormPageState extends State<NoteFormPage> {
/// 构建标签选择器
Widget _buildTagSelector() {
return Wrap(
spacing: 8,
runSpacing: 4,
spacing: 10,
runSpacing: 8,
crossAxisAlignment: WrapCrossAlignment.center,
children: [
..._tags.asMap().entries.map((entry) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
border: Border.all(color: const Color(0xFFE5E5E5)),
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(6),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Row(
mainAxisSize: MainAxisSize.min,
@@ -357,17 +492,24 @@ class _NoteFormPageState extends State<NoteFormPage> {
Text(
entry.value,
style: const TextStyle(
fontSize: 12,
fontSize: 13,
color: Color(0xFF666666),
),
),
const SizedBox(width: 4),
const SizedBox(width: 6),
GestureDetector(
onTap: () => setState(() => _tags.removeAt(entry.key)),
child: const Icon(
Icons.close,
size: 12,
color: Color(0xFF999999),
child: Container(
padding: const EdgeInsets.all(2),
decoration: BoxDecoration(
color: const Color(0xFFE8E8E8),
borderRadius: BorderRadius.circular(4),
),
child: const Icon(
Icons.close,
size: 10,
color: Color(0xFF999999),
),
),
),
],
@@ -378,23 +520,25 @@ class _NoteFormPageState extends State<NoteFormPage> {
GestureDetector(
onTap: () => _showAddTagDialog(),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
border: Border.all(color: const Color(0xFFE5E5E5)),
color: Colors.white,
borderRadius: BorderRadius.circular(6),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: const Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.add,
size: 12,
size: 14,
color: Color(0xFF999999),
),
SizedBox(width: 2),
SizedBox(width: 4),
Text(
'标签',
style: TextStyle(
fontSize: 12,
fontSize: 13,
color: Color(0xFF999999),
),
),
@@ -421,11 +565,11 @@ class _NoteFormPageState extends State<NoteFormPage> {
builder: (context) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
title: const Text(
'添加标签',
style: TextStyle(
fontSize: 16,
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
@@ -439,9 +583,27 @@ class _NoteFormPageState extends State<NoteFormPage> {
TextField(
controller: controller,
autofocus: true,
decoration: const InputDecoration(
decoration: InputDecoration(
hintText: '输入新标签名称',
border: UnderlineInputBorder(),
hintStyle: const TextStyle(
fontSize: 14,
color: Color(0xFF999999),
),
filled: true,
fillColor: const Color(0xFFFAFAFA),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: Color(0xFFE8E8E8), width: 0.5),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(color: Color(0xFF1A1A1A), width: 1),
),
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
),
onSubmitted: (value) {
_addTag(value);
@@ -451,18 +613,18 @@ class _NoteFormPageState extends State<NoteFormPage> {
// 已有标签列表
if (availableTags.isNotEmpty) ...[
const SizedBox(height: 16),
const SizedBox(height: 20),
const Text(
'或选择已有标签：',
style: TextStyle(
fontSize: 12,
fontSize: 13,
color: Color(0xFF999999),
),
),
const SizedBox(height: 8),
const SizedBox(height: 12),
Wrap(
spacing: 8,
runSpacing: 8,
spacing: 10,
runSpacing: 10,
children: availableTags.map((tag) {
return GestureDetector(
onTap: () {
@@ -470,16 +632,16 @@ class _NoteFormPageState extends State<NoteFormPage> {
Navigator.pop(context);
},
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
border: Border.all(color: const Color(0xFFE5E5E5)),
borderRadius: BorderRadius.circular(4),
color: const Color(0xFFFAFAFA),
borderRadius: BorderRadius.circular(8),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
child: Text(
tag,
style: const TextStyle(
fontSize: 13,
fontSize: 14,
color: Color(0xFF666666),
),
),
@@ -494,16 +656,30 @@ class _NoteFormPageState extends State<NoteFormPage> {
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('取消', style: TextStyle(color: Color(0xFF666666))),
style: TextButton.styleFrom(
foregroundColor: const Color(0xFF666666),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('取消'),
),
TextButton(
ElevatedButton(
onPressed: () {
_addTag(controller.text);
Navigator.pop(context);
},
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF1A1A1A),
foregroundColor: Colors.white,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('添加'),
),
],
actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
),
);
}
@@ -580,6 +756,10 @@ class _NoteFormPageState extends State<NoteFormPage> {
ToastUtil.show(context, _isEditing ? '保存成功' : '添加成功');
// 刷新笔记列表
await context.read<AppProvider>().loadNotes();
if (!mounted) return;
Navigator.pop(context);
}
@@ -666,8 +846,10 @@ class _NoteFormPageState extends State<NoteFormPage> {
onLongPress: () => _showDeleteImageDialog(index),
child: Container(
decoration: BoxDecoration(
border: Border.all(color: const Color(0xFFE5E5E5)),
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFE8E8E8), width: 0.5),
),
clipBehavior: Clip.antiAlias,
child: Image.file(
File(_images[index]),
fit: BoxFit.cover,
@@ -709,22 +891,49 @@ class _NoteFormPageState extends State<NoteFormPage> {
builder: (context) => AlertDialog(
backgroundColor: Colors.white,
elevation: 0,
shape: const RoundedRectangleBorder(borderRadius: BorderRadius.zero),
title: const Text('确认删除'),
content: const Text('确定要删除这张图片吗？'),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
title: const Text(
'确认删除',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
),
),
content: const Text(
'确定要删除这张图片吗？此操作不可恢复。',
style: TextStyle(
fontSize: 14,
color: Color(0xFF666666),
height: 1.5,
),
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('取消', style: TextStyle(color: Color(0xFF666666))),
style: TextButton.styleFrom(
foregroundColor: const Color(0xFF666666),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('取消'),
),
TextButton(
ElevatedButton(
onPressed: () {
setState(() => _images.removeAt(index));
Navigator.pop(context);
},
child: const Text('删除', style: TextStyle(color: Colors.red)),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.red,
foregroundColor: Colors.white,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
),
child: const Text('删除'),
),
],
actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
),
);
}

65
lib/pages/note/note_tab_page.dart
View File

@@ -30,6 +30,31 @@ class _NoteTabPageState extends State<NoteTabPage> {
});
}
// 用于检测Provider数据变化
int _lastNotesCount = 0;
@override
void didChangeDependencies() {
super.didChangeDependencies();
// 使用watch监听Provider数据变化
final provider = context.watch<AppProvider>();
final allNotes = provider.notes;
// 如果Provider中的笔记数量发生变化且本地列表已加载过数据
if (allNotes.length != _lastNotesCount && _displayedNotes.isNotEmpty) {
_lastNotesCount = allNotes.length;
// 清空本地列表并重新加载
setState(() {
_displayedNotes.clear();
_hasMore = true;
});
// 延迟加载避免setState冲突
Future.microtask(() => _loadMoreNotes());
} else {
_lastNotesCount = allNotes.length;
}
}
@override
void dispose() {
_scrollController.dispose();
@@ -98,6 +123,10 @@ class _NoteTabPageState extends State<NoteTabPage> {
builder: (context, provider, child) {
final allNotes = provider.notes;
// 当Provider数据变化时，同步更新本地显示列表
// 过滤掉已删除的笔记，保持顺序
_syncDisplayedNotes(allNotes);
if (allNotes.isEmpty && _displayedNotes.isEmpty) {
return _buildEmptyState(context);
}
@@ -135,6 +164,28 @@ class _NoteTabPageState extends State<NoteTabPage> {
);
}
/// 同步显示列表与Provider数据
void _syncDisplayedNotes(List<Note> allNotes) {
// 获取当前所有有效笔记的ID集合
final validNoteIds = allNotes.map((n) => n.id).toSet();
// 移除已删除的笔记（不在Provider中的）
final initialLength = _displayedNotes.length;
_displayedNotes.removeWhere((note) => !validNoteIds.contains(note.id));
// 检查是否有新增笔记（Provider中有但本地列表中没有的）
final displayedIds = _displayedNotes.map((n) => n.id).toSet();
final hasNewNotes = allNotes.any((note) => !displayedIds.contains(note.id));
// 如果有笔记被移除或有新增，更新列表
if (_displayedNotes.length < initialLength || hasNewNotes) {
// 清空并重新加载所有数据
_displayedNotes.clear();
_displayedNotes.addAll(allNotes);
_hasMore = false; // 已经有全部数据了
}
}
/// 构建空状态提示
Widget _buildEmptyState(BuildContext context) {
return Center(
@@ -146,7 +197,7 @@ class _NoteTabPageState extends State<NoteTabPage> {
height: 80,
decoration: BoxDecoration(
color: const Color(0xFFF5F5F5),
borderRadius: BorderRadius.circular(8),
borderRadius: BorderRadius.circular(20),
),
child: const Icon(
Icons.note_outlined,
@@ -154,7 +205,7 @@ class _NoteTabPageState extends State<NoteTabPage> {
color: Color(0xFFCCCCCC),
),
),
const SizedBox(height: 24),
const SizedBox(height: 20),
const Text(
'暂无笔记',
style: TextStyle(
@@ -162,6 +213,14 @@ class _NoteTabPageState extends State<NoteTabPage> {
color: Color(0xFF999999),
),
),
const SizedBox(height: 8),
const Text(
'记录你的想法和灵感',
style: TextStyle(
fontSize: 13,
color: Color(0xFFBBBBBB),
),
),
const SizedBox(height: 24),
InkWell(
onTap: () {
@@ -171,11 +230,13 @@ class _NoteTabPageState extends State<NoteTabPage> {
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
decoration: BoxDecoration(
color: const Color(0xFF1A1A1A),
borderRadius: BorderRadius.circular(8),
),
child: const Text(
'添加笔记',
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
color: Colors.white,
),
),