novoland-developer-networks/BistroFrontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactor(scaffold): 更新布局方式

Browse Source
This commit is contained in:
李东云
2023-03-29 14:48:42 +08:00
parent a201fdb91c
commit 6738f0bfde
7 changed files with 79 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
lib/app.dart
View File

@@ -1,5 +1,4 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'layout/layout_scaffold.dart';
/// ///
/// 应用页 /// 应用页
@@ -14,11 +13,6 @@ class App extends StatefulWidget {
class _AppState extends State<App> { class _AppState extends State<App> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return LayoutScaffold( return Container();
appBar: AppBar(
title: const Text('满席'),
),
body: null,
);
} }
} }

41
lib/layout/layout_scaffold.dart
View File

@@ -1,41 +0,0 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class LayoutScaffold extends StatelessWidget {
final AppBar appBar;
final Widget? body;
const LayoutScaffold({
Key? key,
required this.appBar,
this.body,
}) : super(key: key);
@override
Widget build(BuildContext context) {
Text title = appBar.title as Text;
return Scaffold(
appBar: PreferredSize(
preferredSize: const Size.fromHeight(60),
child: AppBar(
actions: appBar.actions,
leading: appBar.leading,
title: Text(
title.data ?? '',
style: const TextStyle(
fontSize: 25,
),
),
centerTitle: true,
bottom: appBar.bottom,
systemOverlayStyle: const SystemUiOverlayStyle(
statusBarColor: Colors.transparent, //设置为透明
statusBarIconBrightness: Brightness.dark,
),
),
),
body: body,
);
}
}

155
lib/life.dart
View File

@@ -1,10 +1,9 @@
import 'package:bistro/common/global.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:bistro/layout/layout_scaffold.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart'; import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
class Life extends StatefulWidget { class Life extends StatefulWidget {
const Life({Key? key}) : super(key: key); const Life({Key? key}) : super(key: key);
final title = '途说';
@override @override
State<Life> createState() => _LifeState(); State<Life> createState() => _LifeState();
@@ -85,7 +84,7 @@ class _LifeState extends State<Life> {
{ {
'id': '10', 'id': '10',
'thumbnail': 'res/assets/images/tiefutu.jpg', 'thumbnail': 'res/assets/images/tiefutu.jpg',
'title': '标题10', 'title': '标题10标题10标题10标题10标题10标题10标题10标题10标题10标题10标题10标题10',
'author': '浅帅', 'author': '浅帅',
'hasLiked': true 'hasLiked': true
}, },
@@ -94,28 +93,14 @@ class _LifeState extends State<Life> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return LayoutScaffold( return MasonryGridView.count(
appBar: AppBar( shrinkWrap: true,
title: Text(widget.title), itemCount: _list.length,
actions: <Widget>[ crossAxisCount: 2,
IconButton( itemBuilder: cardBuilder,
icon: Icon( padding: const EdgeInsets.only(top: 8),
Icons.add, mainAxisSpacing: 6.0,
color: Theme.of(context).primaryColor, // crossAxisSpacing: 4.0,
),
onPressed: () {},
)
],
),
body: MasonryGridView.count(
shrinkWrap: true,
itemCount: _list.length,
crossAxisCount: 2,
itemBuilder: cardBuilder,
padding: const EdgeInsets.only(top: 8),
mainAxisSpacing: 12.0,
crossAxisSpacing: 6.0,
),
); );
} }
@@ -123,70 +108,66 @@ class _LifeState extends State<Life> {
var item = _list[index]; var item = _list[index];
return Card( return Card(
key: ValueKey(item["id"]), key: ValueKey(item["id"]),
elevation: 8, clipBehavior: Clip.antiAlias,
color: Theme.of(context).colorScheme.background, elevation: 3,
child: Column( color: Theme.of(context).colorScheme.tertiary,
children: <Widget>[ child: GestureDetector(
InkWell( child: Column(
child: Image.asset( mainAxisAlignment: MainAxisAlignment.center,
item["thumbnail"], children: <Widget>[
), Image.asset(
onTap: () {}, item['thumbnail'],
), fit: BoxFit.fitWidth,
ListTile(
title: Text(
item["title"].toString(),
maxLines: 2,
style: const TextStyle(
fontSize: 13,
), ),
overflow: TextOverflow.ellipsis, ListTile(
), title: Text(
isThreeLine: true, item["title"].toString(),
subtitle: Row( maxLines: 2,
mainAxisAlignment: MainAxisAlignment.spaceBetween, style: const TextStyle(
children: <Widget>[ fontSize: 13,
InkWell( ),
child: Row( overflow: TextOverflow.ellipsis,
children: <Widget>[ ),
// Icon( // isThreeLine: true,
// Icons.person_outline, subtitle: Row(
// color: Theme.of(context).primaryColor, mainAxisAlignment: MainAxisAlignment.spaceBetween,
// ), children: <Widget>[
ConstrainedBox( ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 100), constraints: const BoxConstraints(maxWidth: 100),
child: Text( child: Text(
item['author'].toString(), item['author'].toString(),
softWrap: true, softWrap: true,
textAlign: TextAlign.left, textAlign: TextAlign.left,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
maxLines: 1, maxLines: 1,
style: const TextStyle( style: const TextStyle(
fontSize: 11, fontSize: 11,
),
), ),
) ),
], ),
), GestureDetector(
onTap: () {}, excludeFromSemantics: true,
child: Icon(
item["hasLiked"]
? Icons.favorite
: Icons.favorite_border,
color: Theme.of(context).primaryColor,
),
onTap: () {
setState(() {
_list[index]["hasLiked"] = !item["hasLiked"];
});
},
),
],
), ),
InkWell( )
child: Icon( ],
item["hasLiked"] ? Icons.favorite : Icons.favorite_border, ),
color: Theme.of(context).primaryColor, onTap: () {
), printWhenDebug(123);
onTap: () { },
setState(() { ));
_list[index]["hasLiked"] = !item["hasLiked"];
});
},
),
],
),
)
],
),
);
} }
} }

16
lib/mine.dart
View File

@@ -1,20 +1,20 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'layout/layout_scaffold.dart';
/// ///
/// 【我的】页 /// 【我的】页
/// ///
class Mine extends StatelessWidget { class Mine extends StatefulWidget {
const Mine({Key? key}) : super(key: key); const Mine({Key? key}) : super(key: key);
@override @override
Widget build(BuildContext context) { State<Mine> createState() => _MineState();
return LayoutScaffold( }
appBar: AppBar(
title: const Text('在下'),
),
); class _MineState extends State<Mine> {
@override
Widget build(BuildContext context) {
return Container();
// return Container();
} }
} }

9
lib/news.dart
View File

@@ -1,17 +1,10 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'layout/layout_scaffold.dart';
class News extends StatelessWidget { class News extends StatelessWidget {
const News({Key? key}) : super(key: key); const News({Key? key}) : super(key: key);
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return LayoutScaffold( return Container();
appBar: AppBar(
title: const Text('道听'),
),
body: null,
);
} }
} }

2
pubspec.yaml
View File

@@ -175,7 +175,7 @@ flutter_native_splash:
# platform. # platform.
#android: false #android: false
#ios: false #ios: false
web: false #web: false
# The position of the splash image can be set with android_gravity, ios_content_mode, and # The position of the splash image can be set with android_gravity, ios_content_mode, and
# web_image_mode parameters. All default to center. # web_image_mode parameters. All default to center.

1
web/index.html
View File

@@ -30,7 +30,6 @@
<title>bistro</title> <title>bistro</title>
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json">
<script src="splash/splash.js"></script> <script src="splash/splash.js"></script>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<link rel="stylesheet" type="text/css" href="splash/style.css"> <link rel="stylesheet" type="text/css" href="splash/style.css">
</head> </head>
<body> <picture id="splash"> <body> <picture id="splash">