[flutter]: config create new app button ui

This commit is contained in:
appflowy 2021-10-28 14:49:10 +08:00
parent 3bd147a058
commit 6d3ee38bec
3 changed files with 52 additions and 32 deletions

View File

@ -2,6 +2,7 @@ import 'package:app_flowy/workspace/presentation/home/home_sizes.dart';
import 'package:app_flowy/workspace/presentation/widgets/dialogs.dart';
import 'package:flowy_infra/image.dart';
import 'package:flowy_infra/size.dart';
import 'package:flowy_infra_ui/style_widget/button.dart';
import 'package:flowy_infra_ui/style_widget/text.dart';
import 'package:flutter/material.dart';
import 'package:styled_widget/styled_widget.dart';
@ -23,21 +24,19 @@ class NewAppButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
// final theme = context.watch<AppTheme>();
final child = FlowyTextButton(
'New App',
fontSize: 12,
enableHover: false,
onPressed: () async => await _showCreateAppDialog(context),
heading: svgWithSize("home/new_app", const Size(16, 16)),
padding: EdgeInsets.symmetric(horizontal: Insets.l, vertical: 20),
);
return SizedBox(
height: HomeSizes.menuAddButtonHeight,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
svgWithSize("home/new_app", const Size(16, 16)),
TextButton(
onPressed: () async => await _showCreateAppDialog(context),
child: const FlowyText(
'New App',
fontSize: 12,
),
)
],
).padding(horizontal: Insets.l),
child: child,
).topBorder(color: Colors.grey.shade300);
}

View File

@ -51,6 +51,7 @@ class MenuAppHeader extends StatelessWidget {
HSpace(MenuAppSizes.expandedIconPadding),
Expanded(
child: GestureDetector(
behavior: HitTestBehavior.opaque,
onTapDown: (_) {
ExpandableController.of(context, rebuildOnChange: false, required: true)?.toggle();
},

View File

@ -57,33 +57,53 @@ class FlowyTextButton extends StatelessWidget {
final double fontSize;
final VoidCallback? onPressed;
final EdgeInsets padding;
const FlowyTextButton(this.text,
{Key? key,
this.onPressed,
this.fontSize = 16,
this.padding = const EdgeInsets.symmetric(horizontal: 8, vertical: 6)})
: super(key: key);
final bool enableHover;
final Widget? heading;
const FlowyTextButton(
this.text, {
Key? key,
this.onPressed,
this.fontSize = 16,
this.enableHover = true,
this.padding = const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
this.heading,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
return InkWell(
onTap: onPressed,
child: FlowyHover(
config: HoverDisplayConfig(borderRadius: BorderRadius.circular(6), hoverColor: theme.bg3),
builder: (context, onHover) => _render(),
),
);
}
Widget _render() {
return Padding(
List<Widget> children = [];
if (heading != null) {
children.add(heading!);
children.add(const HSpace(6));
}
children.add(FlowyText(text, fontSize: fontSize));
Widget child = Padding(
padding: padding,
child: Align(
alignment: Alignment.centerLeft,
child: FlowyText(text, fontSize: fontSize),
child: Expanded(
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: children,
),
),
);
if (enableHover) {
return InkWell(
onTap: onPressed,
child: FlowyHover(
config: HoverDisplayConfig(borderRadius: BorderRadius.circular(6), hoverColor: theme.bg3),
builder: (context, onHover) => child,
),
);
} else {
return InkWell(
onTap: onPressed,
child: child,
);
}
}
}
// return TextButton(