Skip to content

Commit

Permalink
improve ui on TV
Browse files Browse the repository at this point in the history
  • Loading branch information
Andrii Pyvovarov committed Sep 23, 2024
1 parent 8616100 commit 43fd8f0
Show file tree
Hide file tree
Showing 11 changed files with 185 additions and 170 deletions.
8 changes: 3 additions & 5 deletions lib/collection/active_collection_items_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,11 +32,9 @@ class ActiveCollectionItemsView extends ConsumerWidget {
}

return HorizontalList(
title: Focus(
child: Text(
title!,
style: Theme.of(context).textTheme.titleMedium,
),
title: Text(
title!,
style: Theme.of(context).textTheme.titleMedium,
),
itemBuilder: (context, index) {
final item = items![index];
Expand Down
2 changes: 1 addition & 1 deletion lib/content/content_details_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ class ContentDetailsView extends ConsumerWidget {
);
}

return Focus(child: title);
return title;
}

List<Widget> _renderAdditionalInfo(BuildContext context) {
Expand Down
2 changes: 1 addition & 1 deletion lib/content/manga/manga_provider.g.dart
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

155 changes: 82 additions & 73 deletions lib/content/manga/manga_reader_controls.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,23 @@ import 'package:cloud_hook/content/manga/widgets.dart';
import 'package:cloud_hook/content_suppliers/model.dart';
import 'package:cloud_hook/layouts/app_theme.dart';
import 'package:cloud_hook/utils/android_tv.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';

class MangaReaderControlsRoute<T> extends PopupRoute<T> {
final ContentDetails contentDetails;
final List<ContentMediaItem> mediaItems;
final ValueListenable<int> page;
final int pageNumbers;
final ValueChanged<int> onPageChanged;

MangaReaderControlsRoute({
required this.contentDetails,
required this.mediaItems,
required this.page,
required this.pageNumbers,
required this.onPageChanged,
});

Expand All @@ -41,6 +46,8 @@ class MangaReaderControlsRoute<T> extends PopupRoute<T> {
child: MangaReaderControls(
contentDetails: contentDetails,
mediaItems: mediaItems,
page: page,
pageNumbers: pageNumbers,
onPageChanged: onPageChanged,
),
),
Expand All @@ -49,20 +56,24 @@ class MangaReaderControlsRoute<T> extends PopupRoute<T> {
}
}

class MangaReaderControls extends ConsumerWidget {
class MangaReaderControls extends StatelessWidget {
final ContentDetails contentDetails;
final List<ContentMediaItem> mediaItems;
final ValueListenable<int> page;
final int pageNumbers;
final ValueChanged<int> onPageChanged;

const MangaReaderControls({
super.key,
required this.contentDetails,
required this.mediaItems,
required this.page,
required this.pageNumbers,
required this.onPageChanged,
});

@override
Widget build(BuildContext context, WidgetRef ref) {
Widget build(BuildContext context) {
return GestureDetector(
onTapUp: (details) {
context.pop();
Expand All @@ -78,6 +89,8 @@ class MangaReaderControls extends ConsumerWidget {
MangaReaderControlBottomBar(
contentDetails: contentDetails,
mediaItems: mediaItems,
page: page,
pageNumbers: pageNumbers,
onPageChanged: onPageChanged,
)
]),
Expand Down Expand Up @@ -161,95 +174,91 @@ class MangaReaderControlTopBar extends ConsumerWidget {
}
}

class MangaReaderControlBottomBar extends ConsumerWidget {
class MangaReaderControlBottomBar extends StatelessWidget {
final List<ContentMediaItem> mediaItems;
final ContentDetails contentDetails;
final ValueListenable<int> page;
final int pageNumbers;
final ValueChanged<int> onPageChanged;

const MangaReaderControlBottomBar({
super.key,
required this.contentDetails,
required this.mediaItems,
required this.page,
required this.pageNumbers,
required this.onPageChanged,
});

@override
Widget build(
BuildContext context,
WidgetRef ref,
) {
Widget build(BuildContext context) {
final theme = Theme.of(context);
final pos = ref
.watch(collectionItemCurrentMediaItemPositionProvider(contentDetails))
.valueOrNull;

if (pos == null) {
return const SizedBox.shrink();
}

var curPage = pos.position + 1;
final pageNumbers = pos.length;

return Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: [
0.1,
1.0,
],
colors: [
Colors.transparent,
Colors.black54,
],
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Slider(
max: pageNumbers.toDouble() - 1.0,
value: pos.position > pageNumbers
? pageNumbers.toDouble()
: pos.position.toDouble(),
label: curPage.toString(),
divisions: pageNumbers,
onChanged: (value) {
onPageChanged(value.round());
},
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0, left: 16, right: 16),
child: Row(
mainAxisSize: MainAxisSize.max,
return ValueListenableBuilder(
valueListenable: page,
builder: (context, pageIndex, child) {
final pageNumber = pageIndex + 1;
return Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: [
0.1,
1.0,
],
colors: [
Colors.transparent,
Colors.black54,
],
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
"$curPage / $pageNumbers",
style: theme.textTheme.bodyMedium!.copyWith(
color: Colors.white,
),
),
const Spacer(),
IconButton(
onPressed: () {
showDialog(
context: context,
builder: (context) => MangaReaderSettingsDialog(
contentDetails: contentDetails,
mediaItems: mediaItems,
),
);
Slider(
allowedInteraction: SliderInteraction.slideOnly,
max: pageNumbers.toDouble() - 1,
value: pageIndex.toDouble(),
label: pageNumber.toString(),
divisions: pageNumbers - 1,
onChanged: (value) {
onPageChanged(value.round());
},
icon: const Icon(Icons.settings),
color: Colors.white,
),
Padding(
padding:
const EdgeInsets.only(bottom: 8.0, left: 16, right: 16),
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Text(
"$pageNumber / $pageNumbers",
style: theme.textTheme.bodyMedium!.copyWith(
color: Colors.white,
),
),
const Spacer(),
IconButton(
onPressed: () {
showDialog(
context: context,
builder: (context) => MangaReaderSettingsDialog(
contentDetails: contentDetails,
mediaItems: mediaItems,
),
);
},
icon: const Icon(Icons.settings),
color: Colors.white,
),
],
),
)
],
),
)
],
),
);
);
});
}
}
29 changes: 16 additions & 13 deletions lib/content/manga/manga_reader_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,11 +99,11 @@ class _MangaPagesReaderView extends ConsumerStatefulWidget {
class _MangaPagesReaderViewState extends ConsumerState<_MangaPagesReaderView> {
final transformationController = TransformationController();
final scrollOffsetController = ScrollOffsetController();
late final ValueNotifier<int> pageListenable;
late final ValueNotifier<int> page;

@override
void initState() {
pageListenable = ValueNotifier(widget.initialPage);
page = ValueNotifier(widget.initialPage);
super.initState();
}

Expand Down Expand Up @@ -139,6 +139,8 @@ class _MangaPagesReaderViewState extends ConsumerState<_MangaPagesReaderView> {
MangaReaderControlsRoute(
contentDetails: widget.contentDetails,
mediaItems: widget.mediaItems,
page: page,
pageNumbers: widget.pages.length,
onPageChanged: _jumpToPage,
),
),
Expand All @@ -164,23 +166,24 @@ class _MangaPagesReaderViewState extends ConsumerState<_MangaPagesReaderView> {
initialPage: widget.initialPage,
transformationController: transformationController,
scrollOffsetController: scrollOffsetController,
pageListinable: pageListenable,
page: page,
collectionItemProvider: widget.collectionItemProvider,
)
: _PagedView(
readerMode: readerMode,
pages: widget.pages,
initialPage: widget.initialPage,
transformationController: transformationController,
pageListinable: pageListenable,
pageListinable: page,
),
),
);
}

void _jumpToPage(int page) {
ref.read(widget.collectionItemProvider.notifier).setCurrentPosition(page);
pageListenable.value = page;
void _jumpToPage(int value) {
print(value);
ref.read(widget.collectionItemProvider.notifier).setCurrentPosition(value);
page.value = value;
}

void _movePage(MangaReaderMode readerMode, int inc) async {
Expand All @@ -203,7 +206,7 @@ class _MangaPagesReaderViewState extends ConsumerState<_MangaPagesReaderView> {
}
} else {
notifier.setCurrentPosition(newPos);
pageListenable.value = newPos;
page.value = newPos;
}
}

Expand Down Expand Up @@ -504,7 +507,7 @@ class _ScrolledView extends ConsumerStatefulWidget {
final int initialPage;
final TransformationController transformationController;
final ScrollOffsetController scrollOffsetController;
final ValueListenable<int> pageListinable;
final ValueListenable<int> page;
final CollectionItemProvider collectionItemProvider;

const _ScrolledView({
Expand All @@ -513,7 +516,7 @@ class _ScrolledView extends ConsumerStatefulWidget {
required this.initialPage,
required this.transformationController,
required this.scrollOffsetController,
required this.pageListinable,
required this.page,
required this.collectionItemProvider,
});

Expand All @@ -530,7 +533,7 @@ class _ScrolledViewState extends ConsumerState<_ScrolledView> {
@override
void initState() {
widget.transformationController.addListener(_onTransformationChange);
widget.pageListinable.addListener(_onPageChanged);
widget.page.addListener(_onPageChanged);
_itemPositionsListener.itemPositions.addListener(_onPositionChanged);

super.initState();
Expand All @@ -539,7 +542,7 @@ class _ScrolledViewState extends ConsumerState<_ScrolledView> {
@override
void dispose() {
widget.transformationController.removeListener(_onTransformationChange);
widget.pageListinable.removeListener(_onPageChanged);
widget.page.removeListener(_onPageChanged);
_itemPositionsListener.itemPositions.removeListener(_onPositionChanged);
super.dispose();
}
Expand All @@ -564,7 +567,7 @@ class _ScrolledViewState extends ConsumerState<_ScrolledView> {

void _onPageChanged() {
_itemScrollController.jumpTo(
index: widget.pageListinable.value,
index: widget.page.value,
// duration: const Duration(milliseconds: 200),
);
}
Expand Down
Loading

0 comments on commit 43fd8f0

Please sign in to comment.