diff --git a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/header/header.dart b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/header/header.dart index da20eafc7b..b773814f2d 100644 --- a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/header/header.dart +++ b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/header/header.dart @@ -81,7 +81,6 @@ class MenuAppHeader extends StatelessWidget { onSecondaryTap: () { final actionList = AppDisclosureActionSheet(onSelected: (action) => _handleAction(context, action)); actionList.show( - context, context, anchorDirection: AnchorDirection.bottomWithCenterAligned, ); diff --git a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/disclosure_action.dart b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/disclosure_action.dart index a2cd2edcac..cf66476ab8 100644 --- a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/disclosure_action.dart +++ b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/disclosure_action.dart @@ -32,7 +32,7 @@ class ViewDisclosureButton extends StatelessWidget width: 26, onPressed: () { onTap(); - show(context, context); + show(context); }, icon: svg("editor/details", color: theme.iconColor), ); diff --git a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/section.dart b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/section.dart index ed0a718f58..080211a8b7 100644 --- a/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/section.dart +++ b/frontend/app_flowy/lib/workspace/presentation/home/menu/app/section/section.dart @@ -9,7 +9,6 @@ import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; import 'package:styled_widget/styled_widget.dart'; import 'item.dart'; -import 'package:async/async.dart'; class ViewSection extends StatelessWidget { final AppDataNotifier appData; diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/doc/document.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/doc/document.dart index e8f0290123..83e577ec10 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/doc/document.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/doc/document.dart @@ -188,7 +188,6 @@ class DocumentShareButton extends StatelessWidget { }); }); actionList.show( - context, context, anchorDirection: AnchorDirection.bottomWithCenterAligned, anchorOffset: offset, diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/doc/src/widget/toolbar/color_picker.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/doc/src/widget/toolbar/color_picker.dart index 793399989c..57299bd6cc 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/doc/src/widget/toolbar/color_picker.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/doc/src/widget/toolbar/color_picker.dart @@ -117,15 +117,6 @@ class _FlowyColorButtonState extends State { } void _showColorPicker() { - // FlowyPoppuWindow.show( - // context, - // size: Size(600, 200), - // child: MaterialPicker( - // pickerColor: const Color(0x00000000), - // onColorChanged: (color) => _changeColor(context, color), - // ), - // ); - final style = widget.controller.getSelectionStyle(); final values = style.values.where((v) => v.key == Attribute.background.key).map((v) => v.value); int initialColor = 0; diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/layout/sizes.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/layout/sizes.dart index 5f8f94e1a2..0daca272b6 100755 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/layout/sizes.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/layout/sizes.dart @@ -8,13 +8,13 @@ class GridSize { static double get footerHeight => 40 * scale; static double get leadingHeaderPadding => 30 * scale; static double get trailHeaderPadding => 140 * scale; - static double get headerContentPadding => 8 * scale; - static double get cellContentPadding => 8 * scale; + static double get headerContainerPadding => 0 * scale; + static double get cellContentPadding => 10 * scale; // static EdgeInsets get headerContentInsets => EdgeInsets.symmetric( - horizontal: GridSize.headerContentPadding, - vertical: GridSize.headerContentPadding, + horizontal: GridSize.headerContainerPadding, + vertical: GridSize.headerContainerPadding, ); static EdgeInsets get cellContentInsets => EdgeInsets.symmetric( horizontal: GridSize.cellContentPadding, @@ -23,8 +23,8 @@ class GridSize { static EdgeInsets get footerContentInsets => EdgeInsets.fromLTRB( 0, - GridSize.headerContentPadding, - GridSize.headerContentPadding, - GridSize.headerContentPadding, + GridSize.headerContainerPadding, + GridSize.headerContainerPadding, + GridSize.headerContainerPadding, ); } diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/footer/grid_footer.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/footer/grid_footer.dart index 69e27a0fc4..7528c3c00a 100755 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/footer/grid_footer.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/footer/grid_footer.dart @@ -39,7 +39,7 @@ class _AddRowButton extends StatelessWidget { text: const FlowyText.medium('New row', fontSize: 12), hoverColor: theme.hover, onTap: () => context.read().add(const GridEvent.createRow()), - icon: svg("home/add"), + leftIcon: svg("home/add"), ); } } diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header.dart index e84640a584..a9fb91bb00 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header.dart @@ -61,9 +61,9 @@ class GridHeader extends StatelessWidget { child: Row( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ - const LeadingHeaderCell(), + const _HeaderLeading(), ...headers, - const TrailingHeaderCell(), + const _HeaderTrailing(), ], ), ); @@ -73,8 +73,8 @@ class GridHeader extends StatelessWidget { } } -class LeadingHeaderCell extends StatelessWidget { - const LeadingHeaderCell({Key? key}) : super(key: key); +class _HeaderLeading extends StatelessWidget { + const _HeaderLeading({Key? key}) : super(key: key); @override Widget build(BuildContext context) { @@ -84,8 +84,8 @@ class LeadingHeaderCell extends StatelessWidget { } } -class TrailingHeaderCell extends StatelessWidget { - const TrailingHeaderCell({Key? key}) : super(key: key); +class _HeaderTrailing extends StatelessWidget { + const _HeaderTrailing({Key? key}) : super(key: key); @override Widget build(BuildContext context) { @@ -112,7 +112,7 @@ class CreateColumnButton extends StatelessWidget { text: const FlowyText.medium('New column', fontSize: 12), hoverColor: theme.hover, onTap: () => context.read().add(const ColumnEvent.createColumn()), - icon: svg("home/add"), + leftIcon: svg("home/add"), ); } } diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header_cell.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header_cell.dart index aacdcd251e..2f9b0b2fd2 100755 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header_cell.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/header/header_cell.dart @@ -1,7 +1,10 @@ import 'package:app_flowy/workspace/presentation/plugins/grid/src/layout/sizes.dart'; +import 'package:app_flowy/workspace/presentation/widgets/pop_up_window.dart'; +import 'package:flowy_infra/image.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra_ui/style_widget/button.dart'; import 'package:flowy_infra_ui/style_widget/text.dart'; +import 'package:flowy_infra_ui/widget/dialog/styled_dialogs.dart'; import 'package:flowy_sdk/protobuf/flowy-grid-data-model/grid.pb.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; @@ -14,9 +17,31 @@ class HeaderCell extends StatelessWidget { Widget build(BuildContext context) { final theme = context.watch(); return FlowyButton( - text: FlowyText.medium(field.name, fontSize: 12), + text: Padding(padding: GridSize.cellContentInsets, child: FlowyText.medium(field.name, fontSize: 12)), hoverColor: theme.hover, - onTap: () {}, + onTap: () { + FlowyPoppuWindow.show( + context, + size: Size(300, 100), + child: Container( + color: Colors.red, + child: TextField( + decoration: InputDecoration(hintText: 'Please enter a text'), + onSubmitted: print, + ), + ), + ); + + // StyledDialog( + // child: SingleChildScrollView( + // child: Container( + // color: Colors.red, + // child: TextField(), + // ), + // ), + // ).show(context); + }, + rightIcon: svg("editor/details", color: theme.iconColor), ); } } diff --git a/frontend/app_flowy/lib/workspace/presentation/plugins/trash/trash.dart b/frontend/app_flowy/lib/workspace/presentation/plugins/trash/trash.dart index e74289d982..14b12d77bf 100644 --- a/frontend/app_flowy/lib/workspace/presentation/plugins/trash/trash.dart +++ b/frontend/app_flowy/lib/workspace/presentation/plugins/trash/trash.dart @@ -146,7 +146,7 @@ class _TrashPageState extends State { size: const Size(102, 30), child: FlowyButton( text: FlowyText.medium(LocaleKeys.trash_restoreAll.tr(), fontSize: 12), - icon: svg('editor/restore', color: theme.iconColor), + leftIcon: svg('editor/restore', color: theme.iconColor), hoverColor: theme.hover, onTap: () => context.read().add(const TrashEvent.restoreAll()), ), @@ -156,7 +156,7 @@ class _TrashPageState extends State { size: const Size(102, 30), child: FlowyButton( text: FlowyText.medium(LocaleKeys.trash_deleteAll.tr(), fontSize: 12), - icon: svg('editor/delete', color: theme.iconColor), + leftIcon: svg('editor/delete', color: theme.iconColor), hoverColor: theme.hover, onTap: () => context.read().add(const TrashEvent.deleteAll()), ), diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/float_bubble/question_bubble.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/float_bubble/question_bubble.dart index 2c28b88660..239918994e 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/float_bubble/question_bubble.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/float_bubble/question_bubble.dart @@ -112,7 +112,6 @@ class QuestionBubble extends StatelessWidget { }); }); actionList.show( - context, context, anchorDirection: AnchorDirection.topWithRightAligned, anchorOffset: const Offset(0, -10), diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart index 61caa84c2f..5c782d3ece 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart @@ -24,8 +24,8 @@ abstract class ActionList { FlowyOverlayDelegate? get delegate; void show( - BuildContext buildContext, - BuildContext anchorContext, { + BuildContext buildContext, { + BuildContext? anchorContext, AnchorDirection anchorDirection = AnchorDirection.bottomRight, Offset? anchorOffset, }) { @@ -47,7 +47,7 @@ abstract class ActionList { identifier: identifier, itemCount: widgets.length, itemBuilder: (context, index) => widgets[index], - anchorContext: anchorContext, + anchorContext: anchorContext ?? buildContext, anchorDirection: anchorDirection, width: maxWidth, height: widgets.length * (itemHeight + ActionListSizes.padding * 2), diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_window.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_window.dart index bea342747b..bad7eb2da6 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_window.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_window.dart @@ -21,6 +21,7 @@ class FlowyPoppuWindow extends StatelessWidget { required Size size, }) async { final window = await getWindowInfo(); + FlowyOverlay.of(context).insertWithRect( widget: SizedBox.fromSize( size: size, diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/flowy_overlay.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/flowy_overlay.dart index 84c2cddd82..4732374372 100644 --- a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/flowy_overlay.dart +++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/flowy_overlay.dart @@ -279,8 +279,11 @@ class FlowyOverlayState extends State { children.add(child); } - return Stack( - children: children..addAll(overlays), + return MaterialApp( + debugShowCheckedModeBanner: false, + home: Stack( + children: children..addAll(overlays), + ), ); } diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart index 862f47b662..b83c454322 100644 --- a/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart +++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart @@ -103,38 +103,4 @@ class ListOverlay extends StatelessWidget { style: style, ); } - - static void showWithRect( - BuildContext context, { - required BuildContext anchorContext, - required String identifier, - required IndexedWidgetBuilder itemBuilder, - int? itemCount, - ScrollController? controller, - double maxWidth = double.infinity, - double maxHeight = double.infinity, - required Offset anchorPosition, - required Size anchorSize, - AnchorDirection? anchorDirection, - FlowyOverlayDelegate? delegate, - OverlapBehaviour? overlapBehaviour, - FlowyOverlayStyle? style, - }) { - FlowyOverlay.of(context).insertWithRect( - widget: ListOverlay( - itemBuilder: itemBuilder, - itemCount: itemCount, - controller: controller, - width: maxWidth, - height: maxHeight, - ), - identifier: identifier, - anchorPosition: anchorPosition, - anchorSize: anchorSize, - anchorDirection: anchorDirection, - delegate: delegate, - overlapBehaviour: overlapBehaviour, - style: style, - ); - } } diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/button.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/button.dart index b7d8ea4e88..dee66a8f11 100644 --- a/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/button.dart +++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/button.dart @@ -8,14 +8,16 @@ class FlowyButton extends StatelessWidget { final Widget text; final VoidCallback? onTap; final EdgeInsets padding; - final Widget? icon; + final Widget? leftIcon; + final Widget? rightIcon; final Color hoverColor; const FlowyButton({ Key? key, required this.text, this.onTap, this.padding = const EdgeInsets.symmetric(horizontal: 3, vertical: 2), - this.icon, + this.leftIcon, + this.rightIcon, this.hoverColor = Colors.transparent, }) : super(key: key); @@ -33,13 +35,19 @@ class FlowyButton extends StatelessWidget { Widget _render() { List children = List.empty(growable: true); - if (icon != null) { - children.add(SizedBox.fromSize(size: const Size.square(16), child: icon!)); + if (leftIcon != null) { + children.add(SizedBox.fromSize(size: const Size.square(16), child: leftIcon!)); children.add(const HSpace(6)); } children.add(Align(child: text)); + if (rightIcon != null) { + children.add(const Spacer()); + children.add(SizedBox.fromSize(size: const Size.square(16), child: rightIcon!)); + children.add(const HSpace(6)); + } + return Padding( padding: padding, child: Row(