From 3c4a9767e1031ac71795825a8d2106e8a2f7cfb6 Mon Sep 17 00:00:00 2001 From: LittleSheep Date: Wed, 6 Aug 2025 20:55:13 +0800 Subject: [PATCH] :recycle: Move the title, description out of the settings sheet --- lib/screens/posts/compose.dart | 52 +++++++++++++++++--- lib/screens/posts/compose_article.dart | 43 +++++++++++++--- lib/widgets/post/compose_settings_sheet.dart | 37 -------------- lib/widgets/post/compose_shared.dart | 6 ++- lib/widgets/post/compose_toolbar.dart | 1 + 5 files changed, 87 insertions(+), 52 deletions(-) diff --git a/lib/screens/posts/compose.dart b/lib/screens/posts/compose.dart index f8125ed..55fb76d 100644 --- a/lib/screens/posts/compose.dart +++ b/lib/screens/posts/compose.dart @@ -207,8 +207,6 @@ class PostComposeScreen extends HookConsumerWidget { isScrollControlled: true, builder: (context) => ComposeSettingsSheet( - titleController: state.titleController, - descriptionController: state.descriptionController, visibility: state.visibility, tagsController: state.tagsController, categoriesController: state.categoriesController, @@ -370,14 +368,52 @@ class PostComposeScreen extends HookConsumerWidget { // Post content form Expanded( child: SingleChildScrollView( - padding: const EdgeInsets.symmetric(vertical: 12), + padding: const EdgeInsets.symmetric(vertical: 16), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ + TextField( + controller: state.titleController, + decoration: InputDecoration( + hintText: 'postTitle'.tr(), + border: InputBorder.none, + isCollapsed: true, + contentPadding: const EdgeInsets.symmetric( + vertical: 8, + horizontal: 8, + ), + ), + style: theme.textTheme.titleMedium, + onTapOutside: + (_) => + FocusManager.instance.primaryFocus + ?.unfocus(), + ), + TextField( + controller: state.descriptionController, + decoration: InputDecoration( + hintText: 'postDescription'.tr(), + border: InputBorder.none, + isCollapsed: true, + contentPadding: const EdgeInsets.fromLTRB( + 8, + 4, + 8, + 12, + ), + ), + style: theme.textTheme.bodyMedium, + minLines: 1, + maxLines: 3, + onTapOutside: + (_) => + FocusManager.instance.primaryFocus + ?.unfocus(), + ), // Content field with borderless design - RawKeyboardListener( + KeyboardListener( focusNode: FocusNode(), - onKey: + onKeyEvent: (event) => ComposeLogic.handleKeyPress( event, state, @@ -393,7 +429,11 @@ class PostComposeScreen extends HookConsumerWidget { decoration: InputDecoration( border: InputBorder.none, hintText: 'postContent'.tr(), - contentPadding: const EdgeInsets.all(8), + isCollapsed: true, + contentPadding: const EdgeInsets.symmetric( + vertical: 8, + horizontal: 8, + ), ), maxLines: null, onTapOutside: diff --git a/lib/screens/posts/compose_article.dart b/lib/screens/posts/compose_article.dart index 91424fb..0d1456c 100644 --- a/lib/screens/posts/compose_article.dart +++ b/lib/screens/posts/compose_article.dart @@ -140,8 +140,6 @@ class ArticleComposeScreen extends HookConsumerWidget { isScrollControlled: true, builder: (context) => ComposeSettingsSheet( - titleController: state.titleController, - descriptionController: state.descriptionController, visibility: state.visibility, tagsController: state.tagsController, categoriesController: state.categoriesController, @@ -242,10 +240,39 @@ class ArticleComposeScreen extends HookConsumerWidget { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ + TextField( + controller: state.titleController, + decoration: InputDecoration( + hintText: 'postTitle'.tr(), + border: InputBorder.none, + isCollapsed: true, + contentPadding: const EdgeInsets.symmetric( + vertical: 8, + horizontal: 8, + ), + ), + style: theme.textTheme.titleMedium, + onTapOutside: + (_) => FocusManager.instance.primaryFocus?.unfocus(), + ), + TextField( + controller: state.descriptionController, + decoration: InputDecoration( + hintText: 'postDescription'.tr(), + border: InputBorder.none, + isCollapsed: true, + contentPadding: const EdgeInsets.fromLTRB(8, 4, 8, 12), + ), + style: theme.textTheme.bodyMedium, + minLines: 1, + maxLines: 3, + onTapOutside: + (_) => FocusManager.instance.primaryFocus?.unfocus(), + ), Expanded( - child: RawKeyboardListener( + child: KeyboardListener( focusNode: FocusNode(), - onKey: + onKeyEvent: (event) => _handleKeyPress( event, state, @@ -454,7 +481,7 @@ class ArticleComposeScreen extends HookConsumerWidget { flex: showPreview.value ? 1 : 2, child: buildEditorPane(), ), - const VerticalDivider(), + if (showPreview.value) const VerticalDivider(), if (showPreview.value) Expanded(child: buildPreviewPane()), ], @@ -475,7 +502,7 @@ class ArticleComposeScreen extends HookConsumerWidget { // Helper method to handle keyboard shortcuts void _handleKeyPress( - RawKeyEvent event, + KeyEvent event, ComposeState state, WidgetRef ref, BuildContext context, { @@ -485,7 +512,9 @@ class ArticleComposeScreen extends HookConsumerWidget { final isPaste = event.logicalKey == LogicalKeyboardKey.keyV; final isSave = event.logicalKey == LogicalKeyboardKey.keyS; - final isModifierPressed = event.isMetaPressed || event.isControlPressed; + final isModifierPressed = + HardwareKeyboard.instance.isMetaPressed || + HardwareKeyboard.instance.isControlPressed; final isSubmit = event.logicalKey == LogicalKeyboardKey.enter; if (isPaste && isModifierPressed) { diff --git a/lib/widgets/post/compose_settings_sheet.dart b/lib/widgets/post/compose_settings_sheet.dart index be7c3ab..29c1e4f 100644 --- a/lib/widgets/post/compose_settings_sheet.dart +++ b/lib/widgets/post/compose_settings_sheet.dart @@ -99,8 +99,6 @@ class ChipTagInputField extends StatelessWidget { } class ComposeSettingsSheet extends HookWidget { - final TextEditingController titleController; - final TextEditingController descriptionController; final ValueNotifier visibility; final VoidCallback? onVisibilityChanged; final StringTagController tagsController; @@ -108,8 +106,6 @@ class ComposeSettingsSheet extends HookWidget { const ComposeSettingsSheet({ super.key, - required this.titleController, - required this.descriptionController, required this.visibility, this.onVisibilityChanged, required this.tagsController, @@ -216,39 +212,6 @@ class ComposeSettingsSheet extends HookWidget { crossAxisAlignment: CrossAxisAlignment.start, spacing: 16, children: [ - // Title field - TextField( - controller: titleController, - decoration: InputDecoration( - labelText: 'postTitle'.tr(), - hintText: 'postTitle'.tr(), - border: OutlineInputBorder( - borderRadius: BorderRadius.circular(12), - ), - contentPadding: const EdgeInsets.all(16), - ), - style: theme.textTheme.titleMedium, - onTapOutside: - (_) => FocusManager.instance.primaryFocus?.unfocus(), - ), - - // Description field - TextField( - controller: descriptionController, - decoration: InputDecoration( - labelText: 'postDescription'.tr(), - hintText: 'postDescription'.tr(), - border: OutlineInputBorder( - borderRadius: BorderRadius.circular(12), - ), - contentPadding: const EdgeInsets.all(16), - ), - style: theme.textTheme.bodyMedium, - maxLines: 3, - onTapOutside: - (_) => FocusManager.instance.primaryFocus?.unfocus(), - ), - // Tags field TextFieldTags( textfieldTagsController: tagsController, diff --git a/lib/widgets/post/compose_shared.dart b/lib/widgets/post/compose_shared.dart index 0fe3e1e..4afe6c2 100644 --- a/lib/widgets/post/compose_shared.dart +++ b/lib/widgets/post/compose_shared.dart @@ -689,7 +689,7 @@ class ComposeLogic { } static void handleKeyPress( - RawKeyEvent event, + KeyEvent event, ComposeState state, WidgetRef ref, BuildContext context, { @@ -701,7 +701,9 @@ class ComposeLogic { final isPaste = event.logicalKey == LogicalKeyboardKey.keyV; final isSave = event.logicalKey == LogicalKeyboardKey.keyS; - final isModifierPressed = event.isMetaPressed || event.isControlPressed; + final isModifierPressed = + HardwareKeyboard.instance.isMetaPressed || + HardwareKeyboard.instance.isControlPressed; final isSubmit = event.logicalKey == LogicalKeyboardKey.enter; if (isPaste && isModifierPressed) { diff --git a/lib/widgets/post/compose_toolbar.dart b/lib/widgets/post/compose_toolbar.dart index 33be281..a270139 100644 --- a/lib/widgets/post/compose_toolbar.dart +++ b/lib/widgets/post/compose_toolbar.dart @@ -63,6 +63,7 @@ class ComposeToolbar extends HookConsumerWidget { return Material( elevation: 4, + color: Theme.of(context).colorScheme.surfaceContainerLow, child: Center( child: ConstrainedBox( constraints: const BoxConstraints(maxWidth: 560),