yujunjun/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2025-11-04 12:03:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: select option cell

Browse Source
This commit is contained in:
Vincent Chan 2022-08-30 18:04:27 +08:00
parent 6ef7b6cf68
commit 33e45a86c4
2 changed files with 51 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart
View File

@ -1,7 +1,9 @@
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:appflowy_popover/popover.dart';
import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra/theme.dart';
import 'package:flowy_infra_ui/flowy_infra_ui_web.dart';
import 'package:flowy_infra_ui/style_widget/text.dart'; import 'package:flowy_infra_ui/style_widget/text.dart';
// ignore: unused_import // ignore: unused_import
import 'package:flowy_sdk/log.dart'; import 'package:flowy_sdk/log.dart';
@ -133,7 +135,7 @@ class _MultiSelectCellState extends State<GridMultiSelectCell> {
} }
} }
class SelectOptionWrap extends StatelessWidget { class SelectOptionWrap extends StatefulWidget {
final List<SelectOptionPB> selectOptions; final List<SelectOptionPB> selectOptions;
final void Function(bool)? onFocus; final void Function(bool)? onFocus;
final SelectOptionCellStyle? cellStyle; final SelectOptionCellStyle? cellStyle;
@ -146,15 +148,28 @@ class SelectOptionWrap extends StatelessWidget {
Key? key, Key? key,
}) : super(key: key); }) : super(key: key);
@override
State<StatefulWidget> createState() => _SelectOptionWrapState();
}
class _SelectOptionWrapState extends State<SelectOptionWrap> {
late PopoverController _popover;
@override
void initState() {
_popover = PopoverController();
super.initState();
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = context.watch<AppTheme>(); final theme = context.watch<AppTheme>();
final Widget child; final Widget child;
if (selectOptions.isEmpty && cellStyle != null) { if (widget.selectOptions.isEmpty && widget.cellStyle != null) {
child = Align( child = Align(
alignment: Alignment.centerLeft, alignment: Alignment.centerLeft,
child: FlowyText.medium( child: FlowyText.medium(
cellStyle!.placeholder, widget.cellStyle!.placeholder,
fontSize: 14, fontSize: 14,
color: theme.shader3, color: theme.shader3,
), ),
@ -163,7 +178,7 @@ class SelectOptionWrap extends StatelessWidget {
child = Align( child = Align(
alignment: Alignment.centerLeft, alignment: Alignment.centerLeft,
child: Wrap( child: Wrap(
children: selectOptions children: widget.selectOptions
.map((option) => SelectOptionTag.fromOption( .map((option) => SelectOptionTag.fromOption(
context: context, context: context,
option: option, option: option,
@ -179,14 +194,37 @@ class SelectOptionWrap extends StatelessWidget {
alignment: AlignmentDirectional.center, alignment: AlignmentDirectional.center,
fit: StackFit.expand, fit: StackFit.expand,
children: [ children: [
child, Popover(
InkWell(onTap: () { controller: _popover,
onFocus?.call(true); child: child,
SelectOptionCellEditor.show( targetAnchor: Alignment.bottomCenter,
context, followerAnchor: Alignment.topCenter,
cellControllerBuilder.build() as GridSelectOptionCellController, offset: const Offset(0, 20),
() => onFocus?.call(false), popupBuilder: (BuildContext context) {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
widget.onFocus?.call(true);
});
return OverlayContainer(
constraints: BoxConstraints.loose(
Size(SelectOptionCellEditor.editorPanelWidth, 300)),
child: SizedBox(
width: SelectOptionCellEditor.editorPanelWidth,
child: SelectOptionCellEditor(
cellController: widget.cellControllerBuilder.build()
as GridSelectOptionCellController,
onDismissed: () {
widget.onFocus?.call(false);
},
),
),
); );
},
onClose: () {
widget.onFocus?.call(false);
},
),
InkWell(onTap: () {
_popover.show();
}), }),
], ],
); );

2
frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_editor.dart
View File

@ -28,6 +28,8 @@ class SelectOptionCellEditor extends StatelessWidget with FlowyOverlayDelegate {
final GridSelectOptionCellController cellController; final GridSelectOptionCellController cellController;
final VoidCallback onDismissed; final VoidCallback onDismissed;
static double editorPanelWidth = 300;
const SelectOptionCellEditor({ const SelectOptionCellEditor({
required this.cellController, required this.cellController,
required this.onDismissed, required this.onDismissed,