From f53c2567fcac75e2dc3c07294e6f11d95424563e Mon Sep 17 00:00:00 2001 From: Chirag Bargoojar Date: Fri, 14 Oct 2022 13:39:40 +0530 Subject: [PATCH] fix: grid cell abnormal on click behaviour (#1278) --- .../widgets/cell/cell_container.dart | 9 ++++-- .../widgets/cell/checkbox_cell.dart | 18 +++++++----- .../widgets/cell/date_cell/date_cell.dart | 6 +++- .../widgets/cell/number_cell.dart | 28 +++++++++++-------- .../select_option_cell.dart | 6 +++- .../presentation/widgets/cell/text_cell.dart | 28 +++++++++++-------- .../widgets/cell/url_cell/url_cell.dart | 20 +++++++------ 7 files changed, 71 insertions(+), 44 deletions(-) diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_container.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_container.dart index bbe22ffe8f..43a150d082 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_container.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/cell_container.dart @@ -1,4 +1,5 @@ import 'package:flowy_infra/theme.dart'; +import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; import 'package:provider/provider.dart'; import 'package:styled_widget/styled_widget.dart'; @@ -56,7 +57,6 @@ class CellContainer extends StatelessWidget { child: Container( constraints: BoxConstraints(maxWidth: width, minHeight: 46), decoration: _makeBoxDecoration(context, isFocus), - padding: GridSize.cellContentInsets, child: container, ), ); @@ -92,8 +92,11 @@ class _GridCellEnterRegion extends StatelessWidget { builder: (context, onEnter, _) { List children = [child]; if (onEnter) { - children.add(CellAccessoryContainer(accessories: accessories) - .positioned(right: 0)); + children.add( + CellAccessoryContainer(accessories: accessories).positioned( + right: GridSize.cellContentInsets.right, + ), + ); } return MouseRegion( diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/checkbox_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/checkbox_cell.dart index adffa3ef16..e9bd8c79a4 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/checkbox_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/checkbox_cell.dart @@ -4,6 +4,7 @@ import 'package:flowy_infra/image.dart'; import 'package:flowy_infra_ui/style_widget/icon_button.dart'; import 'package:flutter/widgets.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; +import '../../layout/sizes.dart'; import 'cell_builder.dart'; class GridCheckboxCell extends GridCellWidget { @@ -40,13 +41,16 @@ class _CheckboxCellState extends GridCellState { : svgWidget('editor/editor_uncheck'); return Align( alignment: Alignment.centerLeft, - child: FlowyIconButton( - onPressed: () => context - .read() - .add(const CheckboxCellEvent.select()), - iconPadding: EdgeInsets.zero, - icon: icon, - width: 20, + child: Padding( + padding: GridSize.cellContentInsets, + child: FlowyIconButton( + onPressed: () => context + .read() + .add(const CheckboxCellEvent.select()), + iconPadding: EdgeInsets.zero, + icon: icon, + width: 20, + ), ), ); }, diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_cell.dart index f90b8d06f1..3213adff81 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/date_cell/date_cell.dart @@ -6,6 +6,7 @@ import 'package:app_flowy/startup/startup.dart'; import 'package:app_flowy/plugins/grid/application/prelude.dart'; import 'package:appflowy_popover/appflowy_popover.dart'; +import '../../../layout/sizes.dart'; import '../cell_builder.dart'; import 'date_editor.dart'; @@ -75,7 +76,10 @@ class _DateCellState extends GridCellState { onTap: () => _popover.show(), child: Align( alignment: alignment, - child: FlowyText.medium(state.dateStr, fontSize: 12), + child: Padding( + padding: GridSize.cellContentInsets, + child: FlowyText.medium(state.dateStr, fontSize: 12), + ), ), ), ), diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart index cd5151d750..83ba4270da 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/number_cell.dart @@ -4,6 +4,7 @@ import 'package:app_flowy/plugins/grid/application/prelude.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; +import '../../layout/sizes.dart'; import 'cell_builder.dart'; class GridNumberCell extends GridCellWidget { @@ -45,18 +46,21 @@ class _NumberCellState extends GridFocusNodeCellState { _controller.text = contentFromState(state), ), ], - child: TextField( - controller: _controller, - focusNode: focusNode, - onEditingComplete: () => focusNode.unfocus(), - onSubmitted: (_) => focusNode.unfocus(), - maxLines: 1, - style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500), - textInputAction: TextInputAction.done, - decoration: const InputDecoration( - contentPadding: EdgeInsets.zero, - border: InputBorder.none, - isDense: true, + child: Padding( + padding: GridSize.cellContentInsets, + child: TextField( + controller: _controller, + focusNode: focusNode, + onEditingComplete: () => focusNode.unfocus(), + onSubmitted: (_) => focusNode.unfocus(), + maxLines: 1, + style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500), + textInputAction: TextInputAction.done, + decoration: const InputDecoration( + contentPadding: EdgeInsets.zero, + border: InputBorder.none, + isDense: true, + ), ), ), ), diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart index 5ffea7dbb8..4d4b3ebb29 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/select_option_cell/select_option_cell.dart @@ -11,6 +11,7 @@ import 'package:flowy_sdk/protobuf/flowy-grid/select_type_option.pb.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; +import '../../../layout/sizes.dart'; import '../cell_builder.dart'; import 'extension.dart'; import 'select_option_editor.dart'; @@ -170,7 +171,10 @@ class _SelectOptionWrapState extends State { alignment: AlignmentDirectional.center, fit: StackFit.expand, children: [ - _wrapPopover(child), + Padding( + padding: GridSize.cellContentInsets, + child: _wrapPopover(child), + ), InkWell(onTap: () => _popover.show()), ], ); diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart index 0052ad5e70..cf418c6e93 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/text_cell.dart @@ -3,6 +3,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:app_flowy/startup/startup.dart'; import 'package:app_flowy/plugins/grid/application/prelude.dart'; +import '../../layout/sizes.dart'; import 'cell_builder.dart'; class GridTextCellStyle extends GridCellStyle { @@ -56,18 +57,21 @@ class _GridTextCellState extends GridFocusNodeCellState { _controller.text = state.content; } }, - child: TextField( - controller: _controller, - focusNode: focusNode, - onChanged: (value) => focusChanged(), - onEditingComplete: () => focusNode.unfocus(), - maxLines: null, - style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500), - decoration: InputDecoration( - contentPadding: EdgeInsets.zero, - border: InputBorder.none, - hintText: widget.cellStyle?.placeholder, - isDense: true, + child: Padding( + padding: GridSize.cellContentInsets, + child: TextField( + controller: _controller, + focusNode: focusNode, + onChanged: (value) => focusChanged(), + onEditingComplete: () => focusNode.unfocus(), + maxLines: null, + style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500), + decoration: InputDecoration( + contentPadding: EdgeInsets.zero, + border: InputBorder.none, + hintText: widget.cellStyle?.placeholder, + isDense: true, + ), ), ), ), diff --git a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart index 04d10f9aa2..fbf626802e 100644 --- a/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart +++ b/frontend/app_flowy/lib/plugins/grid/presentation/widgets/cell/url_cell/url_cell.dart @@ -12,6 +12,7 @@ import 'package:flutter/services.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:app_flowy/plugins/grid/application/prelude.dart'; import 'package:url_launcher/url_launcher.dart'; +import '../../../layout/sizes.dart'; import '../cell_accessory.dart'; import '../cell_builder.dart'; import 'cell_editor.dart'; @@ -115,14 +116,17 @@ class _GridURLCellState extends GridCellState { value: _cellBloc, child: BlocBuilder( builder: (context, state) { - final richText = RichText( - textAlign: TextAlign.left, - text: TextSpan( - text: state.content, - style: TextStyle( - color: theme.main2, - fontSize: 14, - decoration: TextDecoration.underline, + final richText = Padding( + padding: GridSize.cellContentInsets, + child: RichText( + textAlign: TextAlign.left, + text: TextSpan( + text: state.content, + style: TextStyle( + color: theme.main2, + fontSize: 14, + decoration: TextDecoration.underline, + ), ), ), );