Change the style of _buildBriefMode. (#44)

Change the style of _buildBriefMode
This commit is contained in:
AnxuNA
2024-11-14 19:29:46 +08:00
committed by GitHub
parent 2ef03ad7ae
commit f912e57bfd
2 changed files with 112 additions and 155 deletions

View File

@@ -25,8 +25,7 @@ class ComicTile extends StatelessWidget {
onTap!();
return;
}
App.mainNavigatorKey?.currentContext
?.to(() => ComicPage(id: comic.id, sourceKey: comic.sourceKey));
App.mainNavigatorKey?.currentContext?.to(() => ComicPage(id: comic.id, sourceKey: comic.sourceKey));
}
void onLongPress(BuildContext context) {
@@ -51,8 +50,7 @@ class ComicTile extends StatelessWidget {
icon: Icons.chrome_reader_mode_outlined,
text: 'Details'.tl,
onClick: () {
App.mainNavigatorKey?.currentContext
?.to(() => ComicPage(id: comic.id, sourceKey: comic.sourceKey));
App.mainNavigatorKey?.currentContext?.to(() => ComicPage(id: comic.id, sourceKey: comic.sourceKey));
},
),
MenuEntry(
@@ -84,17 +82,13 @@ class ComicTile extends StatelessWidget {
Widget build(BuildContext context) {
var type = appdata.settings['comicDisplayMode'];
Widget child = type == 'detailed'
? _buildDetailedMode(context)
: _buildBriefMode(context);
Widget child = type == 'detailed' ? _buildDetailedMode(context) : _buildBriefMode(context);
var isFavorite = appdata.settings['showFavoriteStatusOnTile']
? LocalFavoritesManager()
.isExist(comic.id, ComicType(comic.sourceKey.hashCode))
? LocalFavoritesManager().isExist(comic.id, ComicType(comic.sourceKey.hashCode))
: false;
var history = appdata.settings['showHistoryStatusOnTile']
? HistoryManager()
.findSync(comic.id, ComicType(comic.sourceKey.hashCode))
? HistoryManager().findSync(comic.id, ComicType(comic.sourceKey.hashCode))
: null;
if (history?.page == 0) {
history!.page = 1;
@@ -138,8 +132,7 @@ class ComicTile extends StatelessWidget {
constraints: const BoxConstraints(minWidth: 24),
padding: const EdgeInsets.symmetric(horizontal: 4),
child: CustomPaint(
painter:
_ReadingHistoryPainter(history.page, history.maxPage),
painter: _ReadingHistoryPainter(history.page, history.maxPage),
),
)
],
@@ -212,9 +205,7 @@ class ComicTile extends StatelessWidget {
badge: badge ?? comic.language,
tags: comic.tags,
maxLines: 2,
enableTranslate: ComicSource.find(comic.sourceKey)
?.enableTagsTranslate ??
false,
enableTranslate: ComicSource.find(comic.sourceKey)?.enableTagsTranslate ?? false,
rating: comic.stars,
),
),
@@ -225,12 +216,22 @@ class ComicTile extends StatelessWidget {
}
Widget _buildBriefMode(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 8),
child: Material(
color: Colors.transparent,
borderRadius: BorderRadius.circular(8),
elevation: 1,
return LayoutBuilder(
builder: (context, constraints) {
return InkWell(
borderRadius: BorderRadius.circular(12),
onTap: _onTap,
onLongPress: enableLongPressed ? () => onLongPress(context) : null,
onSecondaryTapDown: (detail) => onSecondaryTap(detail, context),
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 8, 8, 8),
child: Column(
children: [
Expanded(
// Wrap the Container with Expanded
child: SizedBox(
width: constraints.maxWidth,
height: constraints.maxHeight,
child: Stack(
children: [
Positioned.fill(
@@ -245,26 +246,36 @@ class ComicTile extends StatelessWidget {
),
Positioned(
bottom: 0,
left: 0,
right: 0,
child: Container(
width: double.infinity,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.transparent,
Colors.black.withOpacity(0.3),
Colors.black.withOpacity(0.5),
]),
child: ClipRRect(
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(8),
bottomRight: Radius.circular(8),
),
topLeft: Radius.circular(10.0),
topRight: Radius.circular(10.0),
),
child: Container(
color: Colors.black.withOpacity(0.5), // 半透明黑色背景
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 4, 8, 4),
child: Text(
comic.description.replaceAll("\n", ""),
style: const TextStyle(
fontWeight: FontWeight.w500,
fontSize: 12,
color: Colors.white,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
),
),
),
],
),
),
),
Padding(
padding: const EdgeInsets.fromLTRB(8, 4, 8, 0),
child: Text(
comic.title.replaceAll("\n", ""),
style: const TextStyle(
@@ -272,29 +283,16 @@ class ComicTile extends StatelessWidget {
fontSize: 14.0,
color: Colors.white,
),
maxLines: 2,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
)),
Positioned.fill(
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: _onTap,
onLongPress:
enableLongPressed ? () => onLongPress(context) : null,
onSecondaryTapDown: (detail) =>
onSecondaryTap(detail, context),
borderRadius: BorderRadius.circular(8),
child: const SizedBox.expand(),
),
),
)
],
),
),
);
},
);
}
void block(BuildContext comicTileContext) {
@@ -340,9 +338,7 @@ class ComicTile extends StatelessWidget {
}
appdata.saveData();
context.showMessage(message: 'Blocked'.tl);
comicTileContext
.findAncestorStateOfType<_SliverGridComicsState>()!
.update();
comicTileContext.findAncestorStateOfType<_SliverGridComicsState>()!.update();
},
child: Text('Block'.tl),
),
@@ -383,8 +379,7 @@ class _ComicDescription extends StatelessWidget {
s = s.replaceAll("\n", " ");
}
}
var enableTranslate =
App.locale.languageCode == 'zh' && this.enableTranslate;
var enableTranslate = App.locale.languageCode == 'zh' && this.enableTranslate;
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
@@ -401,9 +396,7 @@ class _ComicDescription extends StatelessWidget {
if (subtitle != "")
Text(
subtitle,
style: TextStyle(
fontSize: 10.0,
color: context.colorScheme.onSurface.withOpacity(0.7)),
style: TextStyle(fontSize: 10.0, color: context.colorScheme.onSurface.withOpacity(0.7)),
maxLines: 1,
softWrap: true,
overflow: TextOverflow.ellipsis,
@@ -440,18 +433,13 @@ class _ComicDescription extends StatelessWidget {
decoration: BoxDecoration(
color: s == "Unavailable"
? Theme.of(context).colorScheme.errorContainer
: Theme.of(context)
.colorScheme
.secondaryContainer,
borderRadius:
const BorderRadius.all(Radius.circular(8)),
: Theme.of(context).colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(8)),
),
child: Center(
widthFactor: 1,
child: Text(
enableTranslate
? TagsTranslation.translateTag(s)
: s.split(':').last,
enableTranslate ? TagsTranslation.translateTag(s) : s.split(':').last,
style: const TextStyle(fontSize: 12),
softWrap: true,
overflow: TextOverflow.ellipsis,
@@ -522,20 +510,17 @@ class _ReadingHistoryPainter extends CustomPainter {
textDirection: TextDirection.ltr,
);
textPainter.layout();
textPainter.paint(
canvas,
Offset((size.width - textPainter.width) / 2,
(size.height - textPainter.height) / 2));
textPainter.paint(canvas, Offset((size.width - textPainter.width) / 2, (size.height - textPainter.height) / 2));
} else if (page == maxPage) {
// 在中央绘制勾
final paint = Paint()
..color = Colors.white
..strokeWidth = 2
..style = PaintingStyle.stroke;
canvas.drawLine(Offset(size.width * 0.2, size.height * 0.5),
Offset(size.width * 0.45, size.height * 0.75), paint);
canvas.drawLine(Offset(size.width * 0.45, size.height * 0.75),
Offset(size.width * 0.85, size.height * 0.3), paint);
canvas.drawLine(
Offset(size.width * 0.2, size.height * 0.5), Offset(size.width * 0.45, size.height * 0.75), paint);
canvas.drawLine(
Offset(size.width * 0.45, size.height * 0.75), Offset(size.width * 0.85, size.height * 0.3), paint);
} else {
// 在左上角绘制page, 在右下角绘制maxPage
final textPainter = TextPainter(
@@ -561,18 +546,13 @@ class _ReadingHistoryPainter extends CustomPainter {
textDirection: TextDirection.ltr,
);
textPainter2.layout();
textPainter2.paint(
canvas,
Offset(size.width - textPainter2.width,
size.height - textPainter2.height));
textPainter2.paint(canvas, Offset(size.width - textPainter2.width, size.height - textPainter2.height));
}
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return oldDelegate is! _ReadingHistoryPainter ||
oldDelegate.page != page ||
oldDelegate.maxPage != maxPage;
return oldDelegate is! _ReadingHistoryPainter || oldDelegate.page != page || oldDelegate.maxPage != maxPage;
}
}
@@ -683,8 +663,7 @@ class _SliverGridComics extends StatelessWidget {
onLastItemBuild?.call();
}
var badge = badgeBuilder?.call(comics[index]);
var isSelected =
selection == null ? false : selection![comics[index]] ?? false;
var isSelected = selection == null ? false : selection![comics[index]] ?? false;
var comic = ComicTile(
comic: comics[index],
badge: badge,
@@ -693,9 +672,7 @@ class _SliverGridComics extends StatelessWidget {
);
return Container(
decoration: BoxDecoration(
color: isSelected
? Theme.of(context).colorScheme.surfaceContainer
: null,
color: isSelected ? Theme.of(context).colorScheme.surfaceContainer : null,
borderRadius: BorderRadius.circular(12),
),
margin: const EdgeInsets.all(4),
@@ -820,9 +797,7 @@ class ComicListState extends State<ComicList> {
decoration: InputDecoration(
labelText: "Page".tl,
),
inputFormatters: <TextInputFormatter>[
FilteringTextInputFormatter.digitsOnly
],
inputFormatters: <TextInputFormatter>[FilteringTextInputFormatter.digitsOnly],
onChanged: (v) {
value = v;
},
@@ -835,15 +810,13 @@ class ComicListState extends State<ComicList> {
if (page == null) {
context.showMessage(message: "Invalid page".tl);
} else {
if (page > 0 &&
(_maxPage == null || page <= _maxPage!)) {
if (page > 0 && (_maxPage == null || page <= _maxPage!)) {
setState(() {
_error = null;
_page = page;
});
} else {
context.showMessage(
message: "Invalid page".tl);
context.showMessage(message: "Invalid page".tl);
}
}
},
@@ -855,8 +828,7 @@ class ComicListState extends State<ComicList> {
);
},
child: Padding(
padding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
child: Text("Page $_page / ${_maxPage ?? '?'}"),
),
),
@@ -987,8 +959,7 @@ class ComicListState extends State<ComicList> {
comics: _data[_page] ?? const [],
menuBuilder: widget.menuBuilder,
),
if (_data[_page]!.length > 6 && _maxPage != 1)
_buildSliverPageSelector(),
if (_data[_page]!.length > 6 && _maxPage != 1) _buildSliverPageSelector(),
if (widget.trailingSliver != null) widget.trailingSliver!,
],
);
@@ -1149,20 +1120,15 @@ class _RatingWidgetState extends State<RatingWidget> {
if (!widget.selectable) {
return;
}
if (dx >=
widget.size * widget.count + widget.padding * (widget.count - 1)) {
if (dx >= widget.size * widget.count + widget.padding * (widget.count - 1)) {
value = widget.maxRating;
} else {
for (double i = 1; i < widget.count + 1; i++) {
if (dx > widget.size * i + widget.padding * (i - 1) &&
dx < widget.size * i + widget.padding * i) {
if (dx > widget.size * i + widget.padding * (i - 1) && dx < widget.size * i + widget.padding * i) {
value = i * (widget.maxRating / widget.count);
break;
} else if (dx > widget.size * (i - 1) + widget.padding * (i - 1) &&
dx < widget.size * i + widget.padding * i) {
value = (dx - widget.padding * (i - 1)) /
(widget.size * widget.count) *
widget.maxRating;
} else if (dx > widget.size * (i - 1) + widget.padding * (i - 1) && dx < widget.size * i + widget.padding * i) {
value = (dx - widget.padding * (i - 1)) / (widget.size * widget.count) * widget.maxRating;
break;
}
}
@@ -1190,8 +1156,7 @@ class _RatingWidgetState extends State<RatingWidget> {
if (widget.count / fullStars() == widget.maxRating / value) {
return 0;
}
return (value % (widget.maxRating / widget.count)) /
(widget.maxRating / widget.count);
return (value % (widget.maxRating / widget.count)) / (widget.maxRating / widget.count);
}
List<Widget> buildRow() {

View File

@@ -2,10 +2,7 @@ part of 'components.dart';
class SliverGridViewWithFixedItemHeight extends StatelessWidget {
const SliverGridViewWithFixedItemHeight(
{required this.delegate,
required this.maxCrossAxisExtent,
required this.itemHeight,
super.key});
{required this.delegate, required this.maxCrossAxisExtent, required this.itemHeight, super.key});
final SliverChildDelegate delegate;
@@ -65,8 +62,7 @@ class SliverGridDelegateWithFixedHeight extends SliverGridDelegate {
@override
bool shouldRelayout(covariant SliverGridDelegate oldDelegate) {
if (oldDelegate is! SliverGridDelegateWithFixedHeight) return true;
if (oldDelegate.maxCrossAxisExtent != maxCrossAxisExtent ||
oldDelegate.itemHeight != itemHeight) {
if (oldDelegate.maxCrossAxisExtent != maxCrossAxisExtent || oldDelegate.itemHeight != itemHeight) {
return true;
}
return false;
@@ -95,8 +91,7 @@ class SliverGridDelegateWithComics extends SliverGridDelegate {
}
}
SliverGridLayout getDetailedModeLayout(
SliverConstraints constraints, double scale) {
SliverGridLayout getDetailedModeLayout(SliverConstraints constraints, double scale) {
const minCrossAxisExtent = 360;
final itemHeight = 152 * scale;
final width = constraints.crossAxisExtent;
@@ -111,14 +106,11 @@ class SliverGridDelegateWithComics extends SliverGridDelegate {
reverseCrossAxis: false);
}
SliverGridLayout getBriefModeLayout(
SliverConstraints constraints, double scale) {
SliverGridLayout getBriefModeLayout(SliverConstraints constraints, double scale) {
final maxCrossAxisExtent = 192.0 * scale;
const childAspectRatio = 0.72;
const childAspectRatio = 0.68;
const crossAxisSpacing = 0.0;
int crossAxisCount =
(constraints.crossAxisExtent / (maxCrossAxisExtent + crossAxisSpacing))
.ceil();
int crossAxisCount = (constraints.crossAxisExtent / (maxCrossAxisExtent + crossAxisSpacing)).ceil();
// Ensure a minimum count of 1, can be zero and result in an infinite extent
// below when the window size is 0.
crossAxisCount = math.max(1, crossAxisCount);