fix: some UI issues were present in version 0.3.1. (#3401)

This commit is contained in:
Lucas.Xu
2023-09-14 19:22:32 +08:00
committed by GitHub
parent fe55452c79
commit 26a2bffcd1
21 changed files with 292 additions and 83 deletions

View File

@ -40,12 +40,16 @@ class BlockOptionButton extends StatelessWidget {
return PopoverActionList<PopoverAction>(
direction: PopoverDirection.leftWithCenterAligned,
actions: popoverActions,
onPopupBuilder: () => blockComponentState.alwaysShowActions = true,
onPopupBuilder: () {
keepEditorFocusNotifier.value += 1;
blockComponentState.alwaysShowActions = true;
},
onClosed: () {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
editorState.selectionType = null;
editorState.selection = null;
blockComponentState.alwaysShowActions = false;
keepEditorFocusNotifier.value -= 1;
});
},
onSelected: (action, controller) {

View File

@ -1,6 +1,8 @@
import 'package:appflowy/generated/flowy_svgs.g.dart';
import 'package:appflowy/generated/locale_keys.g.dart';
import 'package:appflowy_editor/appflowy_editor.dart';
import 'package:appflowy_popover/appflowy_popover.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
import 'package:flutter/material.dart';
@ -31,24 +33,31 @@ final alignToolbarItem = ToolbarItem(
data = FlowySvgs.toolbar_align_right_s;
}
final child = FlowySvg(
data,
size: const Size.square(16),
color: isHighlight ? highlightColor : Colors.white,
final child = MouseRegion(
cursor: SystemMouseCursors.click,
child: FlowySvg(
data,
size: const Size.square(20),
color: isHighlight ? highlightColor : Colors.white,
),
);
return _AlignmentButtons(
child: child,
onAlignChanged: (align) async {
await editorState.updateNode(
selection,
(node) => node.copyWith(
attributes: {
...node.attributes,
blockComponentAlign: align,
},
),
);
},
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 4.0),
child: _AlignmentButtons(
child: child,
onAlignChanged: (align) async {
await editorState.updateNode(
selection,
(node) => node.copyWith(
attributes: {
...node.attributes,
blockComponentAlign: align,
},
),
);
},
),
);
},
);
@ -71,11 +80,15 @@ class _AlignmentButtonsState extends State<_AlignmentButtons> {
Widget build(BuildContext context) {
return AppFlowyPopover(
windowPadding: const EdgeInsets.all(0),
margin: const EdgeInsets.all(0),
margin: const EdgeInsets.all(4),
direction: PopoverDirection.bottomWithCenterAligned,
offset: const Offset(0, 10),
child: widget.child,
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.onTertiary,
borderRadius: const BorderRadius.all(Radius.circular(4)),
),
popupBuilder: (_) => _AlignButtons(onAlignChanged: widget.onAlignChanged),
child: widget.child,
);
}
}
@ -97,16 +110,19 @@ class _AlignButtons extends StatelessWidget {
const HSpace(4),
_AlignButton(
icon: FlowySvgs.toolbar_align_left_s,
tooltips: LocaleKeys.document_plugins_optionAction_left.tr(),
onTap: () => onAlignChanged('left'),
),
const _Divider(),
_AlignButton(
icon: FlowySvgs.toolbar_align_center_s,
tooltips: LocaleKeys.document_plugins_optionAction_center.tr(),
onTap: () => onAlignChanged('center'),
),
const _Divider(),
_AlignButton(
icon: FlowySvgs.toolbar_align_right_s,
tooltips: LocaleKeys.document_plugins_optionAction_right.tr(),
onTap: () => onAlignChanged('right'),
),
const HSpace(4),
@ -119,19 +135,25 @@ class _AlignButtons extends StatelessWidget {
class _AlignButton extends StatelessWidget {
const _AlignButton({
required this.icon,
required this.tooltips,
required this.onTap,
});
final FlowySvgData icon;
final String tooltips;
final VoidCallback onTap;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: FlowySvg(
icon,
size: const Size.square(16),
child: Tooltip(
message: tooltips,
child: FlowySvg(
icon,
size: const Size.square(16),
color: Colors.white,
),
),
);
}

View File

@ -168,7 +168,7 @@ class OutlineItemWidget extends StatelessWidget {
hoverColor: Theme.of(context).hoverColor,
),
child: GestureDetector(
onTap: () => updateBlockSelection(context),
onTap: () => scrollToBlock(context),
child: Container(
padding: EdgeInsets.only(left: node.leftIndent),
child: Text(
@ -180,14 +180,14 @@ class OutlineItemWidget extends StatelessWidget {
);
}
void updateBlockSelection(BuildContext context) async {
void scrollToBlock(BuildContext context) {
final editorState = context.read<EditorState>();
editorState.selectionType = SelectionType.block;
editorState.selection = Selection.collapsed(
Position(path: node.path, offset: node.delta?.length ?? 0),
);
final editorScrollController = context.read<EditorScrollController>();
editorScrollController.itemScrollController.jumpTo(index: node.path.first);
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
editorState.selectionType = null;
editorState.selection = Selection.collapsed(
Position(path: node.path, offset: node.delta?.length ?? 0),
);
});
}
}

View File

@ -146,7 +146,10 @@ class _ToggleListBlockComponentWidgetState
}
@override
Widget buildComponent(BuildContext context) {
Widget buildComponent(
BuildContext context, {
bool withBackgroundColor = false,
}) {
final textDirection = calculateTextDirection(
layoutDirection: Directionality.maybeOf(context),
);