mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2025-11-14 17:37:37 +00:00
chore: replace Popover with Appflowy style popover and fix some bugs
This commit is contained in:
parent
c493ba79e0
commit
bda16b136b
@ -3,6 +3,7 @@ import 'package:app_flowy/plugins/grid/application/field/field_service.dart';
|
|||||||
import 'package:appflowy_popover/popover.dart';
|
import 'package:appflowy_popover/popover.dart';
|
||||||
import 'package:flowy_infra/image.dart';
|
import 'package:flowy_infra/image.dart';
|
||||||
import 'package:flowy_infra/theme.dart';
|
import 'package:flowy_infra/theme.dart';
|
||||||
|
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
|
||||||
import 'package:flowy_infra_ui/style_widget/button.dart';
|
import 'package:flowy_infra_ui/style_widget/button.dart';
|
||||||
import 'package:flowy_infra_ui/style_widget/hover.dart';
|
import 'package:flowy_infra_ui/style_widget/hover.dart';
|
||||||
import 'package:flowy_infra_ui/style_widget/text.dart';
|
import 'package:flowy_infra_ui/style_widget/text.dart';
|
||||||
@ -29,7 +30,8 @@ class GridFieldCell extends StatelessWidget {
|
|||||||
},
|
},
|
||||||
child: BlocBuilder<FieldCellBloc, FieldCellState>(
|
child: BlocBuilder<FieldCellBloc, FieldCellState>(
|
||||||
builder: (context, state) {
|
builder: (context, state) {
|
||||||
final button = Popover(
|
final button = AppFlowyStylePopover(
|
||||||
|
constraints: BoxConstraints.loose(const Size(240, 840)),
|
||||||
direction: PopoverDirection.bottomWithLeftAligned,
|
direction: PopoverDirection.bottomWithLeftAligned,
|
||||||
triggerActions: PopoverTriggerActionFlags.click,
|
triggerActions: PopoverTriggerActionFlags.click,
|
||||||
offset: const Offset(0, 10),
|
offset: const Offset(0, 10),
|
||||||
|
|||||||
@ -3,9 +3,9 @@ import 'package:app_flowy/plugins/grid/presentation/widgets/header/field_editor.
|
|||||||
import 'package:app_flowy/startup/startup.dart';
|
import 'package:app_flowy/startup/startup.dart';
|
||||||
import 'package:app_flowy/plugins/grid/application/prelude.dart';
|
import 'package:app_flowy/plugins/grid/application/prelude.dart';
|
||||||
import 'package:app_flowy/workspace/presentation/widgets/dialogs.dart';
|
import 'package:app_flowy/workspace/presentation/widgets/dialogs.dart';
|
||||||
|
import 'package:appflowy_popover/popover.dart';
|
||||||
import 'package:flowy_infra/image.dart';
|
import 'package:flowy_infra/image.dart';
|
||||||
import 'package:flowy_infra/theme.dart';
|
import 'package:flowy_infra/theme.dart';
|
||||||
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
|
|
||||||
import 'package:flowy_infra_ui/style_widget/button.dart';
|
import 'package:flowy_infra_ui/style_widget/button.dart';
|
||||||
import 'package:flowy_infra_ui/style_widget/text.dart';
|
import 'package:flowy_infra_ui/style_widget/text.dart';
|
||||||
import 'package:flowy_infra_ui/widget/spacing.dart';
|
import 'package:flowy_infra_ui/widget/spacing.dart';
|
||||||
@ -32,23 +32,18 @@ class _GridFieldCellActionSheetState extends State<GridFieldCellActionSheet> {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
if (_showFieldEditor) {
|
if (_showFieldEditor) {
|
||||||
final field = widget.cellContext.field;
|
final field = widget.cellContext.field;
|
||||||
return OverlayContainer(
|
return FieldEditor(
|
||||||
constraints: BoxConstraints.loose(const Size(240, 200)),
|
|
||||||
child: FieldEditor(
|
|
||||||
gridId: widget.cellContext.gridId,
|
gridId: widget.cellContext.gridId,
|
||||||
fieldName: field.name,
|
fieldName: field.name,
|
||||||
typeOptionLoader: FieldTypeOptionLoader(
|
typeOptionLoader: FieldTypeOptionLoader(
|
||||||
gridId: widget.cellContext.gridId,
|
gridId: widget.cellContext.gridId,
|
||||||
field: field,
|
field: field,
|
||||||
),
|
),
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return BlocProvider(
|
return BlocProvider(
|
||||||
create: (context) =>
|
create: (context) =>
|
||||||
getIt<FieldActionSheetBloc>(param1: widget.cellContext),
|
getIt<FieldActionSheetBloc>(param1: widget.cellContext),
|
||||||
child: OverlayContainer(
|
|
||||||
constraints: BoxConstraints.loose(const Size(240, 200)),
|
|
||||||
child: SingleChildScrollView(
|
child: SingleChildScrollView(
|
||||||
child: Column(
|
child: Column(
|
||||||
children: [
|
children: [
|
||||||
@ -65,7 +60,6 @@ class _GridFieldCellActionSheetState extends State<GridFieldCellActionSheet> {
|
|||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -159,8 +153,11 @@ class FieldActionCell extends StatelessWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final theme = context.watch<AppTheme>();
|
final theme = context.watch<AppTheme>();
|
||||||
return FlowyButton(
|
return FlowyButton(
|
||||||
text: FlowyText.medium(action.title(),
|
text: FlowyText.medium(
|
||||||
fontSize: 12, color: enable ? null : theme.shader4),
|
action.title(),
|
||||||
|
fontSize: 12,
|
||||||
|
color: enable ? null : theme.shader4,
|
||||||
|
),
|
||||||
hoverColor: theme.hover,
|
hoverColor: theme.hover,
|
||||||
onTap: () {
|
onTap: () {
|
||||||
if (enable) {
|
if (enable) {
|
||||||
@ -168,8 +165,10 @@ class FieldActionCell extends StatelessWidget {
|
|||||||
onTap();
|
onTap();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
leftIcon: svgWidget(action.iconName(),
|
leftIcon: svgWidget(
|
||||||
color: enable ? theme.iconColor : theme.disableIconColor),
|
action.iconName(),
|
||||||
|
color: enable ? theme.iconColor : theme.disableIconColor,
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -216,6 +215,7 @@ extension _FieldActionExtension on FieldAction {
|
|||||||
.add(const FieldActionSheetEvent.duplicateField());
|
.add(const FieldActionSheetEvent.duplicateField());
|
||||||
break;
|
break;
|
||||||
case FieldAction.delete:
|
case FieldAction.delete:
|
||||||
|
PopoverContainer.of(context).close();
|
||||||
NavigatorAlertDialog(
|
NavigatorAlertDialog(
|
||||||
title: LocaleKeys.grid_field_deleteFieldPromptMessage.tr(),
|
title: LocaleKeys.grid_field_deleteFieldPromptMessage.tr(),
|
||||||
confirm: () {
|
confirm: () {
|
||||||
|
|||||||
@ -70,6 +70,7 @@ class _FieldEditorState extends State<FieldEditor> {
|
|||||||
),
|
),
|
||||||
const VSpace(10),
|
const VSpace(10),
|
||||||
_FieldNameTextField(popoverMutex: popoverMutex),
|
_FieldNameTextField(popoverMutex: popoverMutex),
|
||||||
|
const VSpace(10),
|
||||||
..._addDeleteFieldButton(state),
|
..._addDeleteFieldButton(state),
|
||||||
_FieldTypeOptionCell(popoverMutex: popoverMutex),
|
_FieldTypeOptionCell(popoverMutex: popoverMutex),
|
||||||
],
|
],
|
||||||
@ -84,7 +85,6 @@ class _FieldEditorState extends State<FieldEditor> {
|
|||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
return [
|
return [
|
||||||
const VSpace(10),
|
|
||||||
_DeleteFieldButton(
|
_DeleteFieldButton(
|
||||||
popoverMutex: popoverMutex,
|
popoverMutex: popoverMutex,
|
||||||
onDeleted: () {
|
onDeleted: () {
|
||||||
|
|||||||
@ -47,10 +47,6 @@ class FieldTypeList extends StatelessWidget with FlowyOverlayDelegate {
|
|||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
static String identifier() {
|
|
||||||
return (FieldTypeList).toString();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class FieldTypeCell extends StatelessWidget {
|
class FieldTypeCell extends StatelessWidget {
|
||||||
|
|||||||
@ -75,7 +75,7 @@ class DateTypeOptionWidget extends TypeOptionWidget {
|
|||||||
context
|
context
|
||||||
.read<DateTypeOptionBloc>()
|
.read<DateTypeOptionBloc>()
|
||||||
.add(DateTypeOptionEvent.didSelectDateFormat(format));
|
.add(DateTypeOptionEvent.didSelectDateFormat(format));
|
||||||
PopoverContainer.of(popoverContext).closeAll();
|
PopoverContainer.of(popoverContext).close();
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
@ -97,7 +97,7 @@ class DateTypeOptionWidget extends TypeOptionWidget {
|
|||||||
context
|
context
|
||||||
.read<DateTypeOptionBloc>()
|
.read<DateTypeOptionBloc>()
|
||||||
.add(DateTypeOptionEvent.didSelectTimeFormat(format));
|
.add(DateTypeOptionEvent.didSelectTimeFormat(format));
|
||||||
PopoverContainer.of(popoverContext).closeAll();
|
PopoverContainer.of(popoverContext).close();
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
@ -202,11 +202,9 @@ class DateFormatList extends StatelessWidget {
|
|||||||
final cells = DateFormat.values.map((format) {
|
final cells = DateFormat.values.map((format) {
|
||||||
return DateFormatCell(
|
return DateFormatCell(
|
||||||
dateFormat: format,
|
dateFormat: format,
|
||||||
onSelected: (format) {
|
onSelected: onSelected,
|
||||||
onSelected(format);
|
isSelected: selectedFormat == format,
|
||||||
FlowyOverlay.of(context).remove(DateFormatList.identifier());
|
);
|
||||||
},
|
|
||||||
isSelected: selectedFormat == format);
|
|
||||||
}).toList();
|
}).toList();
|
||||||
|
|
||||||
return SizedBox(
|
return SizedBox(
|
||||||
@ -224,10 +222,6 @@ class DateFormatList extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
static String identifier() {
|
|
||||||
return (DateFormatList).toString();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class DateFormatCell extends StatelessWidget {
|
class DateFormatCell extends StatelessWidget {
|
||||||
@ -293,10 +287,8 @@ class TimeFormatList extends StatelessWidget {
|
|||||||
return TimeFormatCell(
|
return TimeFormatCell(
|
||||||
isSelected: format == selectedFormat,
|
isSelected: format == selectedFormat,
|
||||||
timeFormat: format,
|
timeFormat: format,
|
||||||
onSelected: (format) {
|
onSelected: onSelected,
|
||||||
onSelected(format);
|
);
|
||||||
FlowyOverlay.of(context).remove(TimeFormatList.identifier());
|
|
||||||
});
|
|
||||||
}).toList();
|
}).toList();
|
||||||
|
|
||||||
return SizedBox(
|
return SizedBox(
|
||||||
@ -314,10 +306,6 @@ class TimeFormatList extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
static String identifier() {
|
|
||||||
return (TimeFormatList).toString();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class TimeFormatCell extends StatelessWidget {
|
class TimeFormatCell extends StatelessWidget {
|
||||||
|
|||||||
@ -82,7 +82,7 @@ class NumberTypeOptionWidget extends TypeOptionWidget {
|
|||||||
context
|
context
|
||||||
.read<NumberTypeOptionBloc>()
|
.read<NumberTypeOptionBloc>()
|
||||||
.add(NumberTypeOptionEvent.didSelectFormat(format));
|
.add(NumberTypeOptionEvent.didSelectFormat(format));
|
||||||
PopoverContainer.of(popoverContext).closeAll();
|
PopoverContainer.of(popoverContext).close();
|
||||||
},
|
},
|
||||||
selectedFormat: state.typeOption.format,
|
selectedFormat: state.typeOption.format,
|
||||||
);
|
);
|
||||||
@ -145,10 +145,6 @@ class NumberFormatList extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
static String identifier() {
|
|
||||||
return (NumberFormatList).toString();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class NumberFormatCell extends StatelessWidget {
|
class NumberFormatCell extends StatelessWidget {
|
||||||
|
|||||||
@ -207,13 +207,13 @@ class _OptionCellState extends State<_OptionCell> {
|
|||||||
context
|
context
|
||||||
.read<SelectOptionTypeOptionBloc>()
|
.read<SelectOptionTypeOptionBloc>()
|
||||||
.add(SelectOptionTypeOptionEvent.deleteOption(widget.option));
|
.add(SelectOptionTypeOptionEvent.deleteOption(widget.option));
|
||||||
PopoverContainer.of(popoverContext).closeAll();
|
PopoverContainer.of(popoverContext).close();
|
||||||
},
|
},
|
||||||
onUpdated: (updatedOption) {
|
onUpdated: (updatedOption) {
|
||||||
context
|
context
|
||||||
.read<SelectOptionTypeOptionBloc>()
|
.read<SelectOptionTypeOptionBloc>()
|
||||||
.add(SelectOptionTypeOptionEvent.updateOption(updatedOption));
|
.add(SelectOptionTypeOptionEvent.updateOption(updatedOption));
|
||||||
PopoverContainer.of(popoverContext).closeAll();
|
PopoverContainer.of(popoverContext).close();
|
||||||
},
|
},
|
||||||
key: ValueKey(widget.option.id),
|
key: ValueKey(widget.option.id),
|
||||||
);
|
);
|
||||||
|
|||||||
@ -131,8 +131,10 @@ class _GridPropertyCell extends StatelessWidget {
|
|||||||
return FieldEditor(
|
return FieldEditor(
|
||||||
gridId: gridId,
|
gridId: gridId,
|
||||||
fieldName: fieldContext.name,
|
fieldName: fieldContext.name,
|
||||||
typeOptionLoader:
|
typeOptionLoader: FieldTypeOptionLoader(
|
||||||
FieldTypeOptionLoader(gridId: gridId, field: fieldContext.field),
|
gridId: gridId,
|
||||||
|
field: fieldContext.field,
|
||||||
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user