♻️ Move the title, description out of the settings sheet
This commit is contained in:
@@ -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:
|
||||
|
@@ -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) {
|
||||
|
@@ -99,8 +99,6 @@ class ChipTagInputField extends StatelessWidget {
|
||||
}
|
||||
|
||||
class ComposeSettingsSheet extends HookWidget {
|
||||
final TextEditingController titleController;
|
||||
final TextEditingController descriptionController;
|
||||
final ValueNotifier<int> 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,
|
||||
|
@@ -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) {
|
||||
|
@@ -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),
|
||||
|
Reference in New Issue
Block a user