mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
chore: rounded button hover
This commit is contained in:
parent
0218f4e8b9
commit
9730069ec1
@ -358,8 +358,10 @@ class _DateTypeOptionButton extends StatelessWidget {
|
|||||||
popupBuilder: (BuildContext popContext) {
|
popupBuilder: (BuildContext popContext) {
|
||||||
return _CalDateTimeSetting(
|
return _CalDateTimeSetting(
|
||||||
dateTypeOptionPB: dateTypeOptionPB,
|
dateTypeOptionPB: dateTypeOptionPB,
|
||||||
popoverMutex: popoverMutex,
|
onEvent: (event) {
|
||||||
onEvent: (event) => context.read<DateCalBloc>().add(event),
|
context.read<DateCalBloc>().add(event);
|
||||||
|
popoverMutex.close();
|
||||||
|
},
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
@ -369,12 +371,10 @@ class _DateTypeOptionButton extends StatelessWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _CalDateTimeSetting extends StatefulWidget {
|
class _CalDateTimeSetting extends StatefulWidget {
|
||||||
final PopoverMutex popoverMutex;
|
|
||||||
final DateTypeOptionPB dateTypeOptionPB;
|
final DateTypeOptionPB dateTypeOptionPB;
|
||||||
final Function(DateCalEvent) onEvent;
|
final Function(DateCalEvent) onEvent;
|
||||||
const _CalDateTimeSetting({
|
const _CalDateTimeSetting({
|
||||||
required this.dateTypeOptionPB,
|
required this.dateTypeOptionPB,
|
||||||
required this.popoverMutex,
|
|
||||||
required this.onEvent,
|
required this.onEvent,
|
||||||
Key? key,
|
Key? key,
|
||||||
}) : super(key: key);
|
}) : super(key: key);
|
||||||
@ -384,36 +384,38 @@ class _CalDateTimeSetting extends StatefulWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _CalDateTimeSettingState extends State<_CalDateTimeSetting> {
|
class _CalDateTimeSettingState extends State<_CalDateTimeSetting> {
|
||||||
|
final timeSettingPopoverMutex = PopoverMutex();
|
||||||
String? overlayIdentifier;
|
String? overlayIdentifier;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
List<Widget> children = [
|
List<Widget> children = [
|
||||||
AppFlowyPopover(
|
AppFlowyPopover(
|
||||||
mutex: widget.popoverMutex,
|
mutex: timeSettingPopoverMutex,
|
||||||
asBarrier: true,
|
|
||||||
triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
|
triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
|
||||||
offset: const Offset(20, 0),
|
offset: const Offset(20, 0),
|
||||||
popupBuilder: (BuildContext context) {
|
popupBuilder: (BuildContext context) {
|
||||||
return DateFormatList(
|
return DateFormatList(
|
||||||
selectedFormat: widget.dateTypeOptionPB.dateFormat,
|
selectedFormat: widget.dateTypeOptionPB.dateFormat,
|
||||||
onSelected: (format) =>
|
onSelected: (format) {
|
||||||
widget.onEvent(DateCalEvent.setDateFormat(format)),
|
widget.onEvent(DateCalEvent.setDateFormat(format));
|
||||||
|
timeSettingPopoverMutex.close();
|
||||||
|
},
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
child: const DateFormatButton(),
|
child: const DateFormatButton(),
|
||||||
),
|
),
|
||||||
AppFlowyPopover(
|
AppFlowyPopover(
|
||||||
mutex: widget.popoverMutex,
|
mutex: timeSettingPopoverMutex,
|
||||||
asBarrier: true,
|
|
||||||
triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
|
triggerActions: PopoverTriggerFlags.hover | PopoverTriggerFlags.click,
|
||||||
offset: const Offset(20, 0),
|
offset: const Offset(20, 0),
|
||||||
popupBuilder: (BuildContext context) {
|
popupBuilder: (BuildContext context) {
|
||||||
return TimeFormatList(
|
return TimeFormatList(
|
||||||
selectedFormat: widget.dateTypeOptionPB.timeFormat,
|
selectedFormat: widget.dateTypeOptionPB.timeFormat,
|
||||||
onSelected: (format) =>
|
onSelected: (format) {
|
||||||
widget.onEvent(DateCalEvent.setTimeFormat(format)),
|
widget.onEvent(DateCalEvent.setTimeFormat(format));
|
||||||
);
|
timeSettingPopoverMutex.close();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
child: TimeFormatButton(timeFormat: widget.dateTypeOptionPB.timeFormat),
|
child: TimeFormatButton(timeFormat: widget.dateTypeOptionPB.timeFormat),
|
||||||
),
|
),
|
||||||
|
@ -162,6 +162,7 @@ class FieldCellButton extends StatelessWidget {
|
|||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final theme = context.watch<AppTheme>();
|
final theme = context.watch<AppTheme>();
|
||||||
return FlowyButton(
|
return FlowyButton(
|
||||||
|
radius: BorderRadius.zero,
|
||||||
hoverColor: theme.shader6,
|
hoverColor: theme.shader6,
|
||||||
onTap: onTap,
|
onTap: onTap,
|
||||||
leftIcon: svgWidget(field.fieldType.iconName(), color: theme.iconColor),
|
leftIcon: svgWidget(field.fieldType.iconName(), color: theme.iconColor),
|
||||||
|
@ -180,6 +180,7 @@ class CreateFieldButton extends StatelessWidget {
|
|||||||
asBarrier: true,
|
asBarrier: true,
|
||||||
constraints: BoxConstraints.loose(const Size(240, 600)),
|
constraints: BoxConstraints.loose(const Size(240, 600)),
|
||||||
child: FlowyButton(
|
child: FlowyButton(
|
||||||
|
radius: BorderRadius.zero,
|
||||||
text: FlowyText.medium(
|
text: FlowyText.medium(
|
||||||
LocaleKeys.grid_field_newColumn.tr(),
|
LocaleKeys.grid_field_newColumn.tr(),
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
|
@ -12,6 +12,8 @@ class FlowyButton extends StatelessWidget {
|
|||||||
final Widget? rightIcon;
|
final Widget? rightIcon;
|
||||||
final Color hoverColor;
|
final Color hoverColor;
|
||||||
final bool isSelected;
|
final bool isSelected;
|
||||||
|
final BorderRadius radius;
|
||||||
|
|
||||||
const FlowyButton({
|
const FlowyButton({
|
||||||
Key? key,
|
Key? key,
|
||||||
required this.text,
|
required this.text,
|
||||||
@ -22,6 +24,7 @@ class FlowyButton extends StatelessWidget {
|
|||||||
this.rightIcon,
|
this.rightIcon,
|
||||||
this.hoverColor = Colors.transparent,
|
this.hoverColor = Colors.transparent,
|
||||||
this.isSelected = false,
|
this.isSelected = false,
|
||||||
|
this.radius = const BorderRadius.all(Radius.circular(6)),
|
||||||
}) : super(key: key);
|
}) : super(key: key);
|
||||||
|
|
||||||
@override
|
@override
|
||||||
@ -29,8 +32,10 @@ class FlowyButton extends StatelessWidget {
|
|||||||
return InkWell(
|
return InkWell(
|
||||||
onTap: onTap,
|
onTap: onTap,
|
||||||
child: FlowyHover(
|
child: FlowyHover(
|
||||||
style:
|
style: HoverStyle(
|
||||||
HoverStyle(borderRadius: BorderRadius.zero, hoverColor: hoverColor),
|
borderRadius: radius,
|
||||||
|
hoverColor: hoverColor,
|
||||||
|
),
|
||||||
onHover: onHover,
|
onHover: onHover,
|
||||||
setSelected: () => isSelected,
|
setSelected: () => isSelected,
|
||||||
builder: (context, onHover) => _render(),
|
builder: (context, onHover) => _render(),
|
||||||
|
Loading…
x
Reference in New Issue
Block a user