added button to show chapter list dialog when reading

This commit is contained in:
kodjomoustapha 2024-02-23 11:53:07 +01:00
parent f0f6bad7a1
commit 40f1f55170
5 changed files with 198 additions and 20 deletions

View file

@ -10,6 +10,7 @@ import 'package:mangayomi/models/video.dart' as vid;
import 'package:mangayomi/modules/anime/providers/anime_player_controller_provider.dart';
import 'package:mangayomi/modules/anime/widgets/aniskip_countdown_btn.dart';
import 'package:mangayomi/modules/anime/widgets/desktop.dart';
import 'package:mangayomi/modules/manga/reader/widgets/btn_chapter_list_dialog.dart';
import 'package:mangayomi/modules/anime/widgets/mobile.dart';
import 'package:mangayomi/modules/anime/widgets/subtitle_view.dart';
import 'package:mangayomi/modules/anime/widgets/subtitle_setting_widget.dart';
@ -914,6 +915,10 @@ class _AnimeStreamPageState extends riv.ConsumerState<AnimeStreamPage>
),
),
),
Row(children: [
btnToShowChapterListDialog(
context, context.l10n.episodes, widget.episode),
])
],
),
);

View file

@ -2,7 +2,6 @@ import 'dart:io';
import 'dart:typed_data';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:draggable_menu/draggable_menu.dart';
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
@ -25,6 +24,7 @@ import 'package:mangayomi/modules/manga/reader/providers/reader_controller_provi
import 'package:mangayomi/modules/more/settings/appearance/providers/pure_black_dark_mode_state_provider.dart';
import 'package:mangayomi/modules/more/settings/track/widgets/track_listile.dart';
import 'package:mangayomi/modules/widgets/custom_draggable_tabbar.dart';
import 'package:mangayomi/modules/widgets/draggable_scroll_bar.dart';
import 'package:mangayomi/providers/l10n_providers.dart';
import 'package:mangayomi/providers/storage_provider.dart';
import 'package:mangayomi/services/get_source_baseurl.dart';
@ -536,25 +536,7 @@ class _MangaDetailViewState extends ConsumerState<MangaDetailView>
child: _bodyContainer(
chapterLength: chapters.length))),
Expanded(
child: DraggableScrollbar(
padding: const EdgeInsets.only(right: 7),
heightScrollThumb: 48.0,
backgroundColor: context.primaryColor,
scrollThumbBuilder: (backgroundColor, thumbAnimation,
labelAnimation, height,
{labelConstraints, labelText}) {
return FadeTransition(
opacity: thumbAnimation,
child: Container(
decoration: BoxDecoration(
color: backgroundColor,
borderRadius: BorderRadius.circular(20)),
height: height,
width: 8.0,
),
);
},
scrollbarTimeToFade: const Duration(seconds: 2),
child: DraggableScrollbarWidget(
controller: _scrollController,
child: ListView.builder(
controller: _scrollController,

View file

@ -15,6 +15,7 @@ import 'package:mangayomi/models/chapter.dart';
import 'package:mangayomi/models/manga.dart';
import 'package:mangayomi/models/settings.dart';
import 'package:mangayomi/modules/anime/widgets/desktop.dart';
import 'package:mangayomi/modules/manga/reader/widgets/btn_chapter_list_dialog.dart';
import 'package:mangayomi/modules/manga/reader/double_columm_view_vertical.dart';
import 'package:mangayomi/modules/manga/reader/double_columm_view_center.dart';
import 'package:mangayomi/modules/manga/reader/providers/color_filter_provider.dart';
@ -1346,6 +1347,8 @@ class _MangaChapterPageGalleryState
),
),
actions: [
btnToShowChapterListDialog(
context, context.l10n.chapters, widget.chapter),
IconButton(
onPressed: () {
_readerController.setChapterBookmarked();

View file

@ -0,0 +1,151 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:mangayomi/main.dart';
import 'package:mangayomi/models/chapter.dart';
import 'package:mangayomi/modules/manga/reader/providers/push_router.dart';
import 'package:mangayomi/modules/manga/reader/providers/reader_controller_provider.dart';
import 'package:mangayomi/modules/widgets/draggable_scroll_bar.dart';
import 'package:mangayomi/utils/date.dart';
import 'package:mangayomi/utils/extensions/build_context_extensions.dart';
Widget btnToShowChapterListDialog(BuildContext context, String title, Chapter chapter) {
return IconButton(
onPressed: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text(title),
content: SizedBox(
width: context.mediaWidth(0.8),
child: ChapterListWidget(chapter: chapter)),
);
});
},
icon: const Icon(Icons.format_list_numbered_outlined));
}
class ChapterListWidget extends StatefulWidget {
final Chapter chapter;
const ChapterListWidget({super.key, required this.chapter});
@override
State<ChapterListWidget> createState() => _ChapterListWidgetState();
}
class _ChapterListWidgetState extends State<ChapterListWidget> {
final controller = ScrollController();
late final chapterList = widget.chapter.manga.value!.getFilteredChapterList();
late final currentChapIndex = chapterList.indexWhere((element) =>
element.name == widget.chapter.name &&
element.dateUpload == widget.chapter.dateUpload &&
element.scanlator == widget.chapter.scanlator &&
element.url == widget.chapter.url);
@override
void initState() {
_jumpTo();
super.initState();
}
Future<void> _jumpTo() async {
await Future.delayed(const Duration(milliseconds: 5));
controller.jumpTo(controller.position.maxScrollExtent /
chapterList.length *
currentChapIndex);
}
@override
Widget build(BuildContext context) {
return DraggableScrollbarWidget(
controller: controller,
child: ListView.builder(
padding: const EdgeInsets.symmetric(vertical: 2),
controller: controller,
itemCount: chapterList.length,
itemBuilder: (context, index) {
final chapter = chapterList[index];
final currentChap = chapter == chapterList[currentChapIndex];
return ChapterListTile(
chapter: chapter, currentChap: currentChap);
}));
}
}
class ChapterListTile extends StatefulWidget {
final Chapter chapter;
final bool currentChap;
const ChapterListTile(
{super.key, required this.chapter, required this.currentChap});
@override
State<ChapterListTile> createState() => _ChapterListTileState();
}
class _ChapterListTileState extends State<ChapterListTile> {
late final chapter = widget.chapter;
late bool isBookmarked = chapter.isBookmarked!;
@override
Widget build(BuildContext context) {
return Container(
color: widget.currentChap ? context.primaryColor.withOpacity(0.3) : null,
child: ListTile(
textColor: chapter.isRead!
? context.isLight
? Colors.black.withOpacity(0.4)
: Colors.white.withOpacity(0.3)
: null,
selectedColor:
chapter.isRead! ? Colors.white.withOpacity(0.3) : Colors.white,
onTap: () async {
Navigator.pop(context);
pushReplacementMangaReaderView(context: context, chapter: chapter);
},
title: Text(
chapter.name!,
style: const TextStyle(fontSize: 13),
overflow: TextOverflow.ellipsis,
),
subtitle: Row(
children: [
if (!(chapter.manga.value!.isLocalArchive ?? false))
Consumer(
builder: (context, ref, child) => Text(
chapter.dateUpload == null || chapter.dateUpload!.isEmpty
? ""
: dateFormat(chapter.dateUpload!,
ref: ref, context: context),
style: const TextStyle(fontSize: 11))),
if (!chapter.isRead!)
if (chapter.lastPageRead!.isNotEmpty &&
chapter.lastPageRead != "1")
if (chapter.scanlator!.isNotEmpty)
Row(
children: [
const Text(''),
Text(chapter.scanlator!,
style: TextStyle(
fontSize: 11,
color: chapter.isRead!
? context.isLight
? Colors.black.withOpacity(0.4)
: Colors.white.withOpacity(0.3)
: null)),
],
)
],
),
trailing: IconButton(
onPressed: () {
setState(() {
isBookmarked = !isBookmarked;
});
isar.writeTxnSync(() =>
isar.chapters.putSync(chapter..isBookmarked = isBookmarked));
},
icon: Icon(isBookmarked ? Icons.bookmark : Icons.bookmark_outline,
color: context.primaryColor),
),
),
);
}
}

View file

@ -0,0 +1,37 @@
import 'package:draggable_scrollbar/draggable_scrollbar.dart';
import 'package:flutter/material.dart';
import 'package:mangayomi/utils/extensions/build_context_extensions.dart';
class DraggableScrollbarWidget extends StatelessWidget {
final ScrollController controller;
final BoxScrollView child;
const DraggableScrollbarWidget(
{super.key, required this.controller, required this.child});
@override
Widget build(BuildContext context) {
return context.isDesktop
? child
: DraggableScrollbar(
padding: const EdgeInsets.only(right: 7),
heightScrollThumb: 48.0,
backgroundColor: context.primaryColor,
scrollThumbBuilder:
(backgroundColor, thumbAnimation, labelAnimation, height,
{labelConstraints, labelText}) {
return FadeTransition(
opacity: thumbAnimation,
child: Container(
decoration: BoxDecoration(
color: backgroundColor,
borderRadius: BorderRadius.circular(20)),
height: height,
width: 8.0,
),
);
},
scrollbarTimeToFade: const Duration(seconds: 2),
controller: controller,
child: child);
}
}