reason

重构页面结构

......@@ -7,7 +7,6 @@ import 'package:one_poem/poem/poem_router.dart';
import 'package:one_poem/res/gaps.dart';
import 'package:one_poem/res/resources.dart';
import 'package:one_poem/routers/fluro_navigator.dart';
import 'package:one_poem/setting/setting_router.dart';
class CategoryItem extends StatelessWidget {
const CategoryItem({
......
......@@ -2,6 +2,8 @@ import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:one_poem/poem/widgets/poem_content.dart';
import 'package:one_poem/poem/widgets/poem_user_comments.dart';
import 'package:one_poem/res/gaps.dart';
import 'package:one_poem/widgets/bars/home_action_bar.dart';
import 'package:one_poem/widgets/bars/home_menu_bar.dart';
......@@ -65,7 +67,6 @@ class _PoemDetailPageState extends State<PoemDetailPage> {
color: Colors.grey.shade200.withOpacity(0.1),
border: Border.all(
color: Colors.grey.shade50, width: 0.5), // 边色与边宽度
// borderRadius: BorderRadius.circular(2.0),
),
child: ClipRect(
child: BackdropFilter(
......@@ -81,85 +82,12 @@ class _PoemDetailPageState extends State<PoemDetailPage> {
padding: const EdgeInsets.all(10.0),
child: Column(
children: [
const Text(
"题破山寺后禅院",
style: TextStyle(
fontSize: 24.0,
color: Colors.white,
),
),
Gaps.vGap16,
const Text(
"常建",
style: TextStyle(
fontSize: 18.0,
color: Colors.white,
),
),
Gaps.vGap12,
Stack(
alignment: Alignment.center,
children: const [//TODO 字体是否描边?
// Text(
// poemStr,
// style: TextStyle(
// fontFamily: "ZCOOLXiaoWei",
// fontSize: 24.0,
// foreground: Paint()
// ..style = PaintingStyle.stroke
// ..strokeWidth = 1
// ..color = Colors.black,
// ),
// ),
Text(
poemStr,
style: TextStyle(
color: Colors.white,
fontFamily: "ZCOOLXiaoWei",
fontSize: 24.0,
),
),
],
),
Gaps.vGap24,
Container(
alignment: Alignment.centerLeft,
padding: const EdgeInsets.symmetric(
vertical: 5.0, horizontal: 10.0),
child: const Text(
"100位用户朗读录制提交了“临境”",
style: TextStyle(
color: Colors.white, fontSize: 15.0),
),
),
Expanded(
child: Container(
padding: const EdgeInsets.symmetric(
vertical: 5.0, horizontal: 10.0),
width: double.infinity,
child: ListView.builder(itemBuilder:
(BuildContext context, int index) {
return Wrap(
spacing: 5.0,
crossAxisAlignment:
WrapCrossAlignment.center,
children: const [
Icon(
Icons.play_circle_outline,
size: 16.0,
color: Colors.white,
),
Text(
"普通话",
style: TextStyle(
color: Colors.white,
fontSize: 16.0),
)
],
);
}),
),
const PoemContent(
title: "题破山寺后禅院",
author: "常建",
poemStr: poemStr,
),
const PoemUserComments(),
Container(
width: double.infinity,
alignment: Alignment.center,
......
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:one_poem/res/resources.dart';
class PoemContent extends StatelessWidget {
const PoemContent({
Key? key,
required this.poemStr,
required this.title,
required this.author,
}) : super(key: key);
final String poemStr;
final String title;
final String author;
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
title,
style: const TextStyle(
fontSize: 24.0,
color: Colors.white,
),
),
Gaps.vGap16,
Text(
author,
style: const TextStyle(
fontSize: 18.0,
color: Colors.white,
),
),
Gaps.vGap12,
Stack(
alignment: Alignment.center,
children: [
//TODO 字体是否描边?
// Text(
// poemStr,
// style: TextStyle(
// fontFamily: "ZCOOLXiaoWei",
// fontSize: 24.0,
// foreground: Paint()
// ..style = PaintingStyle.stroke
// ..strokeWidth = 1
// ..color = Colors.black,
// ),
// ),
Text(
poemStr,
style: const TextStyle(
color: Colors.white,
fontFamily: "ZCOOLXiaoWei",
fontSize: 24.0,
),
),
],
),
Gaps.vGap24,
],
);
}
}
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class PoemUserComments extends StatelessWidget {
const PoemUserComments({
Key? key,
this.comments, //TODO 传入数据
this.desc,
}) : super(key: key);
final List<Map<String, String>>? comments;
final String? desc;
@override
Widget build(BuildContext context) {
return SizedBox(
height: 360, //TODO 高度待定
width: double.infinity,
child: Flex(
direction: Axis.vertical,
children: [
Container(
alignment: Alignment.centerLeft,
padding:
const EdgeInsets.symmetric(vertical: 5.0, horizontal: 10.0),
child: Text(
desc ?? "一大波用户朗读录制提交了“临境”",
style: const TextStyle(color: Colors.white, fontSize: 15.0),
),
),
Expanded(
flex: 1,
child: Container(
padding:
const EdgeInsets.symmetric(vertical: 5.0, horizontal: 10.0),
width: double.infinity,
child: ListView.builder(
itemBuilder: (BuildContext context, int index) {
return Wrap(
spacing: 5.0,
crossAxisAlignment: WrapCrossAlignment.center,
children: const [
Icon(
Icons.play_circle_outline,
size: 16.0,
color: Colors.white,
),
Text(
"普通话",
style: TextStyle(color: Colors.white, fontSize: 16.0),
)
],
);
}),
),
)
],
),
);
}
}