config view list ui

This commit is contained in:
appflowy 2021-07-26 15:25:30 +08:00
parent 0191645d49
commit a4f4066dfa
4 changed files with 69 additions and 65 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

View File

@ -6,12 +6,23 @@ 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_sdk/protobuf/flowy-workspace/app_create.pb.dart';
import 'package:flowy_sdk/protobuf/flowy-workspace/view_create.pb.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:dartz/dartz.dart';
class AppWidgetSize {
static double expandedIconSize = 24;
static double expandedIconRightSpace = 8;
static double scale = 1;
static double get expandedPadding =>
expandedIconSize * scale + expandedIconRightSpace;
}
class AppWidget extends MenuItem {
final App app;
AppWidget(this.app, {Key? key}) : super(key: ValueKey(app.id));
@ -54,27 +65,24 @@ class AppWidget extends MenuItem {
child: ScrollOnExpand(
scrollOnExpand: true,
scrollOnCollapse: false,
child: Card(
clipBehavior: Clip.antiAlias,
child: Column(
children: <Widget>[
ExpandablePanel(
theme: const ExpandableThemeData(
headerAlignment: ExpandablePanelHeaderAlignment.center,
tapBodyToExpand: false,
tapBodyToCollapse: false,
iconPadding: EdgeInsets.zero,
hasIcon: false,
),
header: AppHeader(app),
expanded: Padding(
padding: EdgeInsets.only(left: Sizes.iconMed),
child: child,
),
collapsed: const SizedBox(),
child: Column(
children: <Widget>[
ExpandablePanel(
theme: const ExpandableThemeData(
headerAlignment: ExpandablePanelHeaderAlignment.center,
tapBodyToExpand: false,
tapBodyToCollapse: false,
iconPadding: EdgeInsets.zero,
hasIcon: false,
),
],
),
header: AppHeader(app),
expanded: Padding(
padding: EdgeInsets.only(left: AppWidgetSize.expandedPadding),
child: child,
),
collapsed: const SizedBox(),
),
],
),
),
);
@ -93,40 +101,35 @@ class AppHeader extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: Padding(
padding: EdgeInsets.symmetric(vertical: Insets.m),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ExpandableIcon(
theme: const ExpandableThemeData(
expandIcon: Icons.arrow_right,
collapseIcon: Icons.arrow_drop_down,
iconColor: Colors.black,
iconSize: 24,
iconPadding: EdgeInsets.zero,
hasIcon: false,
),
),
Expanded(
child: Text(app.name),
),
SizedBox(
height: 30,
child: createViewPopupMenu(context),
),
],
return Row(
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,
),
),
),
HSpace(AppWidgetSize.expandedIconRightSpace),
Expanded(
child: Text(
app.name,
style: const TextStyle(fontSize: 18),
),
),
_renderPopupMenu(context),
],
);
}
Widget createViewPopupMenu(BuildContext context) {
Widget _renderPopupMenu(BuildContext context) {
return PopupMenuButton(
iconSize: 24,
iconSize: 20,
tooltip: 'create new view',
icon: const Icon(Icons.add),
padding: EdgeInsets.zero,

View File

@ -15,22 +15,22 @@ class ViewList extends StatelessWidget {
Widget build(BuildContext context) {
Log.info('ViewList build');
return views.fold(
() => const SizedBox(
height: 10,
),
() => const SizedBox(),
(views) {
return Column(
children: buildViewWidgets(views),
).padding(vertical: Insets.sm);
children: _renderViewWidgets(views),
);
},
);
}
List<ViewWidget> buildViewWidgets(List<View> views) {
List<Widget> _renderViewWidgets(List<View> views) {
var targetViews = views.map((view) {
return ViewWidget(
icon: const Icon(Icons.file_copy),
view: view,
return Padding(
padding: const EdgeInsets.symmetric(vertical: 6),
child: ViewWidget(
view: view,
),
);
}).toList(growable: true);
return targetViews;

View File

@ -1,13 +1,12 @@
import 'package:app_flowy/startup/startup.dart';
import 'package:app_flowy/workspace/domain/page_stack/page_stack.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';
class ViewWidget extends StatelessWidget {
final View view;
final Widget icon;
const ViewWidget({Key? key, required this.view, required this.icon})
: super(key: key);
const ViewWidget({Key? key, required this.view}) : super(key: key);
@override
Widget build(BuildContext context) {
@ -17,10 +16,12 @@ class ViewWidget extends StatelessWidget {
Row buildContent() {
return Row(
children: [
icon,
const SizedBox(
width: 4,
),
const Image(
fit: BoxFit.cover,
width: 20,
height: 20,
image: AssetImage('assets/images/file_icon.jpg')),
const HSpace(6),
Text(
view.name,
textAlign: TextAlign.start,