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

chore: add min height for row

Browse Source
This commit is contained in:
appflowy 2022-04-30 08:21:27 +08:00
parent 1ad7e0ece2
commit 371f75343c
6 changed files with 116 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/layout/sizes.dart
View File

@ -9,8 +9,8 @@ class GridSize {
static double get leadingHeaderPadding => 50 * scale;
static double get trailHeaderPadding => 140 * scale;
static double get headerContainerPadding => 0 * scale;
static double get cellHPadding => 12 * scale;
static double get cellVPadding => 12 * scale;
static double get cellHPadding => 8 * scale;
static double get cellVPadding => 8 * scale;
static double get typeOptionItemHeight => 32 * scale;
static double get typeOptionSeparatorHeight => 6 * scale;

2
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/cell_builder.dart
View File

@ -121,7 +121,7 @@ class CellContainer extends StatelessWidget {
behavior: HitTestBehavior.translucent,
onTap: () => child.requestFocus.notify(),
child: Container(
constraints: BoxConstraints(maxWidth: width),
constraints: BoxConstraints(maxWidth: width, minHeight: 46),
decoration: _makeBoxDecoration(context, isFocus),
padding: GridSize.cellContentInsets,
child: container,

17
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/checkbox_cell.dart
View File

@ -35,16 +35,13 @@ class _CheckboxCellState extends State<CheckboxCell> {
child: BlocBuilder<CheckboxCellBloc, CheckboxCellState>(
builder: (context, state) {
final icon = state.isSelected ? svgWidget('editor/editor_check') : svgWidget('editor/editor_uncheck');
return SizedBox(
height: 20,
child: Align(
alignment: Alignment.centerLeft,
child: FlowyIconButton(
onPressed: () => context.read<CheckboxCellBloc>().add(const CheckboxCellEvent.select()),
iconPadding: EdgeInsets.zero,
icon: icon,
width: 23,
),
return Align(
alignment: Alignment.centerLeft,
child: FlowyIconButton(
onPressed: () => context.read<CheckboxCellBloc>().add(const CheckboxCellEvent.select()),
iconPadding: EdgeInsets.zero,
icon: icon,
width: 23,
),
);
},

106
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/selection_cell/selection_cell.dart
View File

@ -5,6 +5,7 @@ import 'package:flowy_infra/theme.dart';
import 'package:flowy_infra_ui/style_widget/text.dart';
// ignore: unused_import
import 'package:flowy_sdk/log.dart';
import 'package:flowy_sdk/protobuf/flowy-grid/selection_type_option.pb.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
@ -44,47 +45,27 @@ class _SingleSelectCellState extends State<SingleSelectCell> {
@override
void initState() {
final cellContext = _buildCellContext();
final cellContext = widget.cellContextBuilder.build() as GridSelectOptionCellContext;
_cellBloc = getIt<SelectionCellBloc>(param1: cellContext)..add(const SelectionCellEvent.initial());
super.initState();
}
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
// Log.trace("build widget $hashCode");
return BlocProvider.value(
value: _cellBloc,
child: BlocBuilder<SelectionCellBloc, SelectionCellState>(
builder: (context, state) {
List<Widget> children = [];
children.addAll(state.selectedOptions.map((option) => SelectOptionTag(option: option)).toList());
if (children.isEmpty && widget.cellStyle != null) {
children.add(FlowyText.medium(widget.cellStyle!.placeholder, fontSize: 14, color: theme.shader3));
}
return SizedBox.expand(
child: InkWell(
onTap: () {
widget.onFocus.value = true;
SelectOptionCellEditor.show(
context,
_buildCellContext(),
() => widget.onFocus.value = false,
);
},
child: Center(child: Wrap(children: children)),
),
);
return _SelectOptionCell(
selectOptions: state.selectedOptions,
cellStyle: widget.cellStyle,
onFocus: (value) => widget.onFocus.value = value,
cellContextBuilder: widget.cellContextBuilder);
},
),
);
}
GridSelectOptionCellContext _buildCellContext() {
return widget.cellContextBuilder.build() as GridSelectOptionCellContext;
}
@override
Future<void> dispose() async {
_cellBloc.close();
@ -118,7 +99,7 @@ class _MultiSelectCellState extends State<MultiSelectCell> {
@override
void initState() {
final cellContext = _buildCellContext();
final cellContext = widget.cellContextBuilder.build() as GridSelectOptionCellContext;
_cellBloc = getIt<SelectionCellBloc>(param1: cellContext)..add(const SelectionCellEvent.initial());
super.initState();
}
@ -129,25 +110,11 @@ class _MultiSelectCellState extends State<MultiSelectCell> {
value: _cellBloc,
child: BlocBuilder<SelectionCellBloc, SelectionCellState>(
builder: (context, state) {
List<Widget> children = state.selectedOptions.map((option) => SelectOptionTag(option: option)).toList();
if (children.isEmpty && widget.cellStyle != null) {
children.add(FlowyText.medium(widget.cellStyle!.placeholder, fontSize: 14));
}
return SizedBox.expand(
child: InkWell(
onTap: () {
widget.onFocus.value = true;
SelectOptionCellEditor.show(
context,
_buildCellContext(),
() => widget.onFocus.value = false,
);
},
child: Wrap(children: children, spacing: 4, runSpacing: 4),
),
);
return _SelectOptionCell(
selectOptions: state.selectedOptions,
cellStyle: widget.cellStyle,
onFocus: (value) => widget.onFocus.value = value,
cellContextBuilder: widget.cellContextBuilder);
},
),
);
@ -158,8 +125,51 @@ class _MultiSelectCellState extends State<MultiSelectCell> {
_cellBloc.close();
super.dispose();
}
}
GridSelectOptionCellContext _buildCellContext() {
return widget.cellContextBuilder.build() as GridSelectOptionCellContext;
class _SelectOptionCell extends StatelessWidget {
final List<SelectOption> selectOptions;
final void Function(bool) onFocus;
final SelectOptionCellStyle? cellStyle;
final GridCellContextBuilder cellContextBuilder;
const _SelectOptionCell({
required this.selectOptions,
required this.onFocus,
required this.cellStyle,
required this.cellContextBuilder,
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
final Widget child;
if (selectOptions.isEmpty && cellStyle != null) {
child = Align(
alignment: Alignment.centerLeft,
child: FlowyText.medium(cellStyle!.placeholder, fontSize: 14, color: theme.shader3),
);
} else {
final tags = selectOptions.map((option) => SelectOptionTag(option: option)).toList();
child = Align(
alignment: Alignment.centerLeft,
child: Wrap(children: tags, spacing: 4, runSpacing: 4),
);
}
final cellContext = cellContextBuilder.build() as GridSelectOptionCellContext;
return Stack(
alignment: AlignmentDirectional.center,
fit: StackFit.expand,
children: [
child,
InkWell(
onTap: () {
onFocus(true);
SelectOptionCellEditor.show(context, cellContext, () => onFocus(false));
},
),
],
);
}
}

71
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/cell/selection_cell/selection_editor.dart
View File

@ -184,41 +184,50 @@ class _SelectOptionCell extends StatelessWidget {
final theme = context.watch<AppTheme>();
return SizedBox(
height: GridSize.typeOptionItemHeight,
child: InkWell(
onTap: () {
context.read<SelectOptionEditorBloc>().add(SelectOptionEditorEvent.selectOption(option.id));
},
child: FlowyHover(
style: HoverStyle(hoverColor: theme.hover),
builder: (_, onHover) {
List<Widget> children = [
SelectOptionTag(option: option, isSelected: isSelected),
const Spacer(),
];
if (isSelected) {
children.add(svgWidget("grid/checkmark"));
}
if (onHover) {
children.add(FlowyIconButton(
width: 30,
onPressed: () => _showEditPannel(context),
iconPadding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
icon: svgWidget("editor/details", color: theme.iconColor),
));
}
return Padding(
padding: const EdgeInsets.all(3.0),
child: Row(children: children),
);
},
),
child: Stack(
fit: StackFit.expand,
children: [
_body(theme, context),
InkWell(
onTap: () {
context.read<SelectOptionEditorBloc>().add(SelectOptionEditorEvent.selectOption(option.id));
},
),
],
),
);
}
FlowyHover _body(AppTheme theme, BuildContext context) {
return FlowyHover(
style: HoverStyle(hoverColor: theme.hover),
builder: (_, onHover) {
List<Widget> children = [
SelectOptionTag(option: option, isSelected: isSelected),
const Spacer(),
];
if (isSelected) {
children.add(svgWidget("grid/checkmark"));
}
if (onHover) {
children.add(FlowyIconButton(
width: 30,
onPressed: () => _showEditPannel(context),
iconPadding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
icon: svgWidget("editor/details", color: theme.iconColor),
));
}
return Padding(
padding: const EdgeInsets.all(3.0),
child: Row(children: children),
);
},
);
}
void _showEditPannel(BuildContext context) {
final pannel = EditSelectOptionPannel(
option: option,

15
frontend/app_flowy/lib/workspace/presentation/plugins/grid/src/widgets/row/grid_row.dart
View File

@ -205,13 +205,14 @@ class _CellExpander extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
return FlowyIconButton(
width: 30,
height: 24,
onPressed: onExpand,
iconPadding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
fillColor: theme.surface,
icon: svgWidget("grid/expander", color: theme.main1),
return FittedBox(
fit: BoxFit.contain,
child: FlowyIconButton(
onPressed: onExpand,
iconPadding: const EdgeInsets.fromLTRB(6, 6, 6, 6),
fillColor: theme.surface,
icon: svgWidget("grid/expander", color: theme.main1),
),
);
}
}