Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: introduce popover widget

Browse Source
This commit is contained in:
Vincent Chan 2022-08-25 16:58:03 +08:00
parent 84b5762017
commit ddc394fcd7
7 changed files with 84 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_cell.dart
View File

@ -65,14 +65,15 @@ class GridFieldCell extends StatelessWidget {
final state = context.read<FieldCellBloc>().state;
final field = state.field;
FieldEditor(
FieldEditorPopOver.show(
context,
gridId: state.gridId,
fieldName: field.name,
typeOptionLoader: FieldTypeOptionLoader(
gridId: state.gridId,
field: field,
),
).show(context);
);
}
}

62
frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/field_editor.dart
View File

@ -49,24 +49,6 @@ class FieldEditor extends StatelessWidget with FlowyOverlayDelegate {
);
}
void show(
BuildContext context, {
AnchorDirection anchorDirection = AnchorDirection.bottomWithLeftAligned,
}) {
FlowyOverlay.of(context).remove(identifier());
FlowyOverlay.of(context).insertWithAnchor(
widget: OverlayContainer(
child: this,
constraints: BoxConstraints.loose(const Size(280, 400)),
),
identifier: identifier(),
anchorContext: context,
anchorDirection: anchorDirection,
style: FlowyOverlayStyle(blur: false),
delegate: this,
);
}
static String identifier() {
return (FieldEditor).toString();
}
@ -116,3 +98,47 @@ class _FieldNameCell extends StatelessWidget {
);
}
}
class FieldEditorPopOver extends StatelessWidget {
final String gridId;
final String fieldName;
final IFieldTypeOptionLoader typeOptionLoader;
const FieldEditorPopOver({
required this.gridId,
required this.fieldName,
required this.typeOptionLoader,
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return FlowyPopover(
child: Container(
constraints: BoxConstraints.loose(const Size(280, 400)),
width: 280,
height: 400,
child: FieldEditor(
gridId: gridId,
fieldName: fieldName,
typeOptionLoader: typeOptionLoader,
key: key),
));
}
static show(
BuildContext context, {
required String gridId,
required String fieldName,
required IFieldTypeOptionLoader typeOptionLoader,
Key? key,
}) {
FlowyPopover.show(context, builder: (BuildContext context) {
return FieldEditorPopOver(
gridId: gridId,
fieldName: fieldName,
typeOptionLoader: typeOptionLoader,
key: key);
});
}
}

5
frontend/app_flowy/lib/plugins/grid/presentation/widgets/header/grid_header.dart
View File

@ -157,11 +157,12 @@ class CreateFieldButton extends StatelessWidget {
return FlowyButton(
text: const FlowyText.medium('New column', fontSize: 12),
hoverColor: theme.shader6,
onTap: () => FieldEditor(
onTap: () => FieldEditorPopOver.show(
context,
gridId: gridId,
fieldName: "",
typeOptionLoader: NewFieldTypeOptionLoader(gridId: gridId),
).show(context),
),
leftIcon: svgWidget("home/add"),
);
}

5
frontend/app_flowy/lib/plugins/grid/presentation/widgets/row/row_detail.dart
View File

@ -169,14 +169,15 @@ class _RowDetailCell extends StatelessWidget {
}
void _showFieldEditor(BuildContext context) {
FieldEditor(
FieldEditorPopOver.show(
context,
gridId: cellId.gridId,
fieldName: cellId.field.name,
typeOptionLoader: FieldTypeOptionLoader(
gridId: cellId.gridId,
field: cellId.field,
),
).show(context);
);
}
}

5
frontend/app_flowy/lib/plugins/grid/presentation/widgets/toolbar/grid_property.dart
View File

@ -119,11 +119,12 @@ class _GridPropertyCell extends StatelessWidget {
hoverColor: theme.hover,
leftIcon: svgWidget(field.fieldType.iconName(), color: theme.iconColor),
onTap: () {
FieldEditor(
FieldEditorPopOver.show(
context,
gridId: gridId,
fieldName: field.name,
typeOptionLoader: FieldTypeOptionLoader(gridId: gridId, field: field),
).show(context, anchorDirection: AnchorDirection.bottomRight);
);
},
);
}

1
frontend/app_flowy/packages/flowy_infra_ui/lib/flowy_infra_ui.dart
View File

@ -9,3 +9,4 @@ export 'src/flowy_overlay/flowy_overlay.dart';
export 'src/flowy_overlay/list_overlay.dart';
export 'src/flowy_overlay/option_overlay.dart';
export 'src/flowy_overlay/flowy_dialog.dart';
export 'src/flowy_overlay/flowy_popover.dart';

27
frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/flowy_popover.dart Normal file
View File

@ -0,0 +1,27 @@
import 'package:flutter/material.dart';
const _overlayContainerPadding = EdgeInsets.all(12);
class FlowyPopover extends StatelessWidget {
final Widget child;
final ShapeBorder? shape;
FlowyPopover({Key? key, required this.child, this.shape}) : super(key: key);
@override
Widget build(BuildContext context) {
return SimpleDialog(
shape: shape ??
RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
children: [Container(padding: _overlayContainerPadding, child: child)],
);
}
static show(
BuildContext context, {
required Widget Function(BuildContext context) builder,
}) {
showDialog(
barrierColor: Colors.transparent, context: context, builder: builder);
}
}