mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
fix: some UI issues were present in version 0.3.1. (#3401)
This commit is contained in:
@ -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) {
|
||||
|
@ -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,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -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),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -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),
|
||||
);
|
||||
|
Reference in New Issue
Block a user