优化win的新增/编辑界面

This commit is contained in:
DelLevin-Home
2026-07-14 23:40:54 +08:00
parent c344c015b2
commit a3a1adbc52

View File

@@ -122,6 +122,7 @@ class _NoteAddPageState extends State<NoteAddPage> {
}
Widget _buildEditArea(ColorScheme colors) {
final isWin = Platform.isWindows;
return Column(children: [
// 标题输入
Container(
@@ -134,13 +135,58 @@ class _NoteAddPageState extends State<NoteAddPage> {
decoration: InputDecoration(
hintText: '添加标题',
hintStyle: TextStyle(fontSize: 16, fontWeight: FontWeight.w700, color: colors.onSurface.withValues(alpha: 0.2)),
border: InputBorder.none,
border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none,
isDense: true,
contentPadding: EdgeInsets.zero,
),
onChanged: (_) => setState(() {}),
),
),
// Windows: 标签栏移到标题下方(靠左)
if (isWin)
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
decoration: BoxDecoration(border: Border(bottom: BorderSide(color: colors.outlineVariant, width: 0.5))),
child: Align(
alignment: Alignment.centerLeft,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(mainAxisSize: MainAxisSize.min, children: [
for (int i = 0; i < _tags.length; i++)
Padding(
padding: const EdgeInsets.only(right: 4),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(6)),
child: Row(mainAxisSize: MainAxisSize.min, children: [
Text(_tags[i], style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.6))),
const SizedBox(width: 3),
GestureDetector(
onTap: () => setState(() => _tags.removeAt(i)),
child: Icon(Icons.close, size: 10, color: colors.onSurface.withValues(alpha: 0.3)),
),
]),
),
),
GestureDetector(
onTap: _showTagPanel,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6),
border: Border.all(color: colors.onSurface.withValues(alpha: 0.25), width: 1),
),
child: Row(mainAxisSize: MainAxisSize.min, children: [
Icon(Icons.add, size: 12, color: colors.onSurface.withValues(alpha: 0.35)),
const SizedBox(width: 2),
Text('标签', style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.35))),
]),
),
),
]),
),
),
),
// 内容编辑
Expanded(
child: TextField(
@@ -153,7 +199,7 @@ class _NoteAddPageState extends State<NoteAddPage> {
decoration: InputDecoration(
hintText: '使用 Markdown 格式书写...',
hintStyle: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.25), height: 1.6),
border: InputBorder.none,
border: InputBorder.none, enabledBorder: InputBorder.none, focusedBorder: InputBorder.none,
contentPadding: const EdgeInsets.all(16),
),
onChanged: (_) => setState(() {}),
@@ -161,7 +207,8 @@ class _NoteAddPageState extends State<NoteAddPage> {
),
// 图片行
if (_images.isNotEmpty) _buildImageRow(colors),
// 标签 + 工具栏
// 底部标签 + 工具栏(仅非 Windows
if (!isWin)
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
decoration: BoxDecoration(border: Border(top: BorderSide(color: colors.outlineVariant, width: 0.5))),
@@ -224,6 +271,15 @@ class _NoteAddPageState extends State<NoteAddPage> {
]),
]),
),
// Windows: 底部只显示字数
if (isWin)
Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
decoration: BoxDecoration(border: Border(top: BorderSide(color: colors.outlineVariant, width: 0.5))),
child: Row(mainAxisAlignment: MainAxisAlignment.end, children: [
Text('${_contentCtrl.text.length}', style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.3))),
]),
),
]);
}