[flutter]: add Meterial as the root of ListOverlay

This commit is contained in:
appflowy
2021-10-11 16:56:52 +08:00
parent 4afbe62475
commit 854eb69854
2 changed files with 33 additions and 21 deletions

View File

@ -3,6 +3,7 @@ import 'package:flowy_infra/flowy_icon_data_icons.dart';
import 'package:flowy_infra/image.dart'; import 'package:flowy_infra/image.dart';
import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra/theme.dart';
import 'package:flowy_infra_ui/flowy_infra_ui.dart'; import 'package:flowy_infra_ui/flowy_infra_ui.dart';
import 'package:flowy_infra_ui/style_widget/hover.dart';
import 'package:flowy_infra_ui/style_widget/icon_button.dart'; import 'package:flowy_infra_ui/style_widget/icon_button.dart';
import 'package:flowy_infra_ui/style_widget/text.dart'; import 'package:flowy_infra_ui/style_widget/text.dart';
import 'package:flowy_infra_ui/widget/spacing.dart'; import 'package:flowy_infra_ui/widget/spacing.dart';
@ -132,14 +133,22 @@ class CreateItem extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return GestureDetector( final theme = context.watch<AppTheme>();
onTap: () { final config = HoverDisplayConfig(hoverColor: theme.bg3);
onSelected(viewType);
return FlowyHover(
config: config,
builder: (context, onHover) {
return GestureDetector(
onTap: () {
onSelected(viewType);
},
child: FlowyText.medium(
viewType.name,
fontSize: 12,
).padding(horizontal: 10, vertical: 10),
);
}, },
child: FlowyText.medium(
viewType.name,
fontSize: 12,
).padding(horizontal: 10, vertical: 10),
); );
} }
} }

View File

@ -19,20 +19,23 @@ class ListOverlay extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Material(
constraints: BoxConstraints.tight(Size(maxWidth, maxHeight)), type: MaterialType.transparency,
decoration: BoxDecoration( child: Container(
color: Colors.white, constraints: BoxConstraints.tight(Size(maxWidth, maxHeight)),
borderRadius: const BorderRadius.all(Radius.circular(6)), decoration: BoxDecoration(
boxShadow: [ color: Colors.white,
BoxShadow(color: Colors.black.withOpacity(0.1), spreadRadius: 1, blurRadius: 20.0), borderRadius: const BorderRadius.all(Radius.circular(6)),
], boxShadow: [
), BoxShadow(color: Colors.black.withOpacity(0.1), spreadRadius: 1, blurRadius: 20.0),
child: ListView.builder( ],
shrinkWrap: true, ),
itemBuilder: itemBuilder, child: ListView.builder(
itemCount: itemCount, shrinkWrap: true,
controller: controller, itemBuilder: itemBuilder,
itemCount: itemCount,
controller: controller,
),
), ),
); );
} }