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

enable app widget selectable

Browse Source
This commit is contained in:
appflowy 2021-07-27 14:38:51 +08:00
parent 56ced4a76f
commit af9421ed1c
9 changed files with 173 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
app_flowy/lib/workspace/presentation/app/app_widget.dart
View File

@ -4,9 +4,10 @@ import 'package:app_flowy/workspace/presentation/app/view_list.dart';
import 'package:app_flowy/workspace/presentation/widgets/menu/menu_list.dart';
import 'package:app_flowy/startup/startup.dart';
import 'package:expandable/expandable.dart';
import 'package:flowy_infra/size.dart';
import 'package:flowy_infra_ui/widget/error_page.dart';
import 'package:flowy_infra_ui/widget/spacing.dart';
import 'package:flowy_infra_ui/style_widget/styled_text_button.dart';
import 'package:flowy_infra_ui/style_widget/styled_icon_button.dart';
import 'package:flowy_sdk/protobuf/flowy-workspace/app_create.pb.dart';
import 'package:flowy_sdk/protobuf/flowy-workspace/view_create.pb.dart';
import 'package:flutter/material.dart';
@ -46,11 +47,9 @@ class AppWidget extends MenuItem {
builder: (context, state) {
final child = state.map(
initial: (_) => BlocBuilder<AppBloc, AppState>(
builder: (context, state) {
return ViewList(state.views);
},
builder: (context, state) => _renderViewList(state.views),
),
loadViews: (s) => ViewList(some(s.views)),
loadViews: (s) => _renderViewList(some(s.views)),
loadFail: (s) => FlowyErrorPage(s.error.toString()),
);
@ -61,21 +60,25 @@ class AppWidget extends MenuItem {
}
ExpandableNotifier expandableWrapper(BuildContext context, Widget child) {
final controller = ExpandableController(initialExpanded: false);
return ExpandableNotifier(
controller: controller,
child: ScrollOnExpand(
scrollOnExpand: true,
scrollOnCollapse: false,
child: Column(
children: <Widget>[
ExpandablePanel(
// controller: controller,
theme: const ExpandableThemeData(
headerAlignment: ExpandablePanelHeaderAlignment.center,
tapBodyToExpand: false,
tapBodyToCollapse: false,
tapHeaderToExpand: false,
iconPadding: EdgeInsets.zero,
hasIcon: false,
),
header: AppHeader(app),
header: AppHeader(app, controller: controller),
expanded: child,
collapsed: const SizedBox(),
),
@ -85,15 +88,24 @@ class AppWidget extends MenuItem {
);
}
Widget _renderViewList(Option<List<View>> views) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8),
child: ViewList(views),
);
}
@override
MenuItemType get type => MenuItemType.app;
}
class AppHeader extends StatelessWidget {
final ExpandableController controller;
final App app;
const AppHeader(
this.app, {
Key? key,
required this.controller,
}) : super(key: key);
@override
@ -102,37 +114,45 @@ class AppHeader extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ExpandableIcon(
theme: ExpandableThemeData(
expandIcon: Icons.arrow_drop_up,
collapseIcon: Icons.arrow_drop_down,
iconColor: Colors.black,
iconSize: AppWidgetSize.expandedIconSize,
iconPadding: EdgeInsets.zero,
hasIcon: false,
InkWell(
onTap: () => controller.toggle(),
child: ExpandableIcon(
theme: ExpandableThemeData(
expandIcon: Icons.arrow_drop_up,
collapseIcon: Icons.arrow_drop_down,
iconColor: Colors.black,
iconSize: AppWidgetSize.expandedIconSize,
iconPadding: EdgeInsets.zero,
hasIcon: false,
),
),
),
HSpace(AppWidgetSize.expandedIconRightSpace),
Expanded(
child: Text(
child: StyledTextButton(
app.name,
style: const TextStyle(fontSize: 18),
onPressed: () {
debugPrint('show app document');
},
),
),
_renderPopupMenu(context),
StyledIconButton(
icon: const Icon(Icons.add),
onPressed: () {
debugPrint('add view');
},
),
],
);
}
Widget _renderPopupMenu(BuildContext context) {
return PopupMenuButton(
iconSize: 20,
tooltip: 'create new view',
icon: const Icon(Icons.add),
padding: EdgeInsets.zero,
onSelected: (viewType) => _createView(viewType as ViewType, context),
itemBuilder: (context) => menuItemBuilder());
}
// return PopupMenuButton(
// iconSize: 20,
// tooltip: 'create new view',
// icon: const Icon(Icons.add),
// padding: EdgeInsets.zero,
// onSelected: (viewType) => _createView(viewType as ViewType, context),
// itemBuilder: (context) => menuItemBuilder());
List<PopupMenuEntry> menuItemBuilder() {
return ViewType.values

2
app_flowy/lib/workspace/presentation/app/view_list.dart
View File

@ -25,7 +25,7 @@ class ViewList extends StatelessWidget {
List<Widget> _renderViews(List<View> views) {
var targetViews = views.map((view) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 4),
padding: const EdgeInsets.symmetric(vertical: 2),
child: ViewWidget(
view: view,
),

6
app_flowy/lib/workspace/presentation/view/view_widget.dart
View File

@ -5,7 +5,7 @@ import 'package:app_flowy/workspace/presentation/app/app_widget.dart';
import 'package:flowy_infra_ui/widget/spacing.dart';
import 'package:flowy_sdk/protobuf/flowy-workspace/view_create.pb.dart';
import 'package:flutter/material.dart';
import 'package:flowy_infra_ui/style_widget/styled_more.dart';
import 'package:flowy_infra_ui/style_widget/styled_icon_button.dart';
import 'package:flowy_infra_ui/style_widget/styled_hover.dart';
class ViewWidget extends StatelessWidget {
@ -61,9 +61,7 @@ class ViewWidget extends StatelessWidget {
return Padding(
padding: padding,
child: Flexible(
child: Row(children: children),
),
child: Row(children: children),
);
}

10
app_flowy/lib/workspace/presentation/widgets/home_top_bar.dart
View File

@ -5,7 +5,7 @@ import 'package:flowy_infra_ui/widget/rounded_button.dart';
import 'package:flowy_infra_ui/widget/spacing.dart';
import 'package:flowy_sdk/protobuf/flowy-workspace/view_create.pbenum.dart';
import 'package:flutter/material.dart';
import 'package:flowy_infra_ui/style_widget/styled_more.dart';
import 'package:flowy_infra_ui/style_widget/styled_icon_button.dart';
import 'package:flowy_infra_ui/style_widget/styled_text.dart';
class HomeTopBar extends StatelessWidget {
@ -47,14 +47,18 @@ class HomeTopBar extends StatelessWidget {
fontSize: 12,
borderRadius: BorderRadius.circular(6),
color: Colors.lightBlue,
press: () {},
press: () {
debugPrint('share page');
},
);
}
Widget _renderMoreButton() {
return StyledMore(
width: 24,
onPressed: () {},
onPressed: () {
debugPrint('show more');
},
);
}
}

11
app_flowy/lib/workspace/presentation/widgets/menu/menu_user.dart
View File

@ -6,6 +6,7 @@ import 'package:flowy_sdk/protobuf/flowy-user/user_detail.pb.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flowy_infra_ui/style_widget/styled_text.dart';
import 'package:flowy_infra_ui/style_widget/styled_icon_button.dart';
class MenuUser extends MenuItem {
final UserDetail user;
@ -50,11 +51,13 @@ class MenuUser extends MenuItem {
}
Widget _renderDropButton(BuildContext context) {
return IconButton(
return StyledIconButton(
width: 30,
iconRatio: 0.8,
icon: const Icon(Icons.arrow_drop_down),
alignment: Alignment.center,
padding: EdgeInsets.zero,
onPressed: () {},
onPressed: () {
debugPrint('show user profile');
},
);
}

55
app_flowy/packages/flowy_infra_ui/lib/style_widget/styled_icon_button.dart Normal file
View File

@ -0,0 +1,55 @@
import 'package:flutter/material.dart';
class StyledIconButton extends StatelessWidget {
final double width;
final double? height;
final double iconRatio;
final Icon icon;
final VoidCallback? onPressed;
const StyledIconButton({
Key? key,
this.height,
this.onPressed,
this.width = 30,
required this.icon,
this.iconRatio = 0.5,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return SizedBox(
width: width,
height: height ?? width,
child: IconButton(
icon: icon,
padding: EdgeInsets.zero,
iconSize: width * iconRatio,
alignment: Alignment.center,
onPressed: onPressed,
),
);
}
}
class StyledMore extends StatelessWidget {
final double width;
final double? height;
final VoidCallback? onPressed;
const StyledMore({
Key? key,
this.height,
this.onPressed,
required this.width,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return StyledIconButton(
width: width,
height: height,
icon: const Icon(Icons.more_vert),
);
}
}

29
app_flowy/packages/flowy_infra_ui/lib/style_widget/styled_more.dart
View File

@ -1,29 +0,0 @@
import 'package:flutter/material.dart';
class StyledMore extends StatelessWidget {
final double width;
final double? height;
final VoidCallback? onPressed;
const StyledMore({
Key? key,
required this.width,
this.height,
this.onPressed,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return SizedBox(
width: width,
height: height ?? width,
child: IconButton(
icon: const Icon(Icons.more_vert),
padding: EdgeInsets.zero,
iconSize: width / 2,
alignment: Alignment.center,
onPressed: onPressed,
),
);
}
}

2
app_flowy/packages/flowy_infra_ui/lib/style_widget/styled_text.dart
View File

@ -7,7 +7,7 @@ class StyledText extends StatelessWidget {
const StyledText(
this.title, {
Key? key,
this.overflow = TextOverflow.fade,
this.overflow = TextOverflow.ellipsis,
this.fontSize = 16,
}) : super(key: key);

54
app_flowy/packages/flowy_infra_ui/lib/style_widget/styled_text_button.dart Normal file
View File

@ -0,0 +1,54 @@
import 'package:flowy_infra_ui/style_widget/styled_hover.dart';
import 'package:flowy_infra_ui/style_widget/styled_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
class StyledTextButton extends StatelessWidget {
final String text;
final double fontSize;
final VoidCallback? onPressed;
final EdgeInsets padding;
const StyledTextButton(this.text,
{Key? key,
this.onPressed,
this.fontSize = 16,
this.padding = const EdgeInsets.symmetric(horizontal: 8, vertical: 6)})
: super(key: key);
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onPressed,
child: StyledHover(
color: Colors.grey.shade300,
borderRadius: BorderRadius.circular(8),
builder: (context, onHover) => _render(),
),
);
}
Widget _render() {
return Padding(
padding: padding,
child: Align(
alignment: Alignment.centerLeft,
child: StyledText(text, fontSize: fontSize),
),
);
}
}
// return TextButton(
// style: ButtonStyle(
// textStyle: MaterialStateProperty.all(TextStyle(fontSize: fontSize)),
// alignment: Alignment.centerLeft,
// foregroundColor: MaterialStateProperty.all(Colors.black),
// padding: MaterialStateProperty.all<EdgeInsets>(
// const EdgeInsets.symmetric(horizontal: 2)),
// ),
// onPressed: onPressed,
// child: Text(
// text,
// overflow: TextOverflow.ellipsis,
// softWrap: false,
// ),
// );