mirror of
https://github.com/gabehf/Fladder.git
synced 2026-03-09 15:38:13 -07:00
feat: Android TV support (#503)
Co-authored-by: PartyDonut <PartyDonut@users.noreply.github.com>
This commit is contained in:
parent
7ab8c015b9
commit
c299492d6d
168 changed files with 12019 additions and 3073 deletions
|
|
@ -1,4 +1,4 @@
|
|||
import 'dart:math';
|
||||
import 'dart:math' as math;
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
|
|
@ -7,26 +7,32 @@ import 'package:iconsax_plus/iconsax_plus.dart';
|
|||
|
||||
import 'package:fladder/providers/settings/client_settings_provider.dart';
|
||||
import 'package:fladder/util/adaptive_layout/adaptive_layout.dart';
|
||||
import 'package:fladder/util/disable_keypad_focus.dart';
|
||||
import 'package:fladder/util/focus_provider.dart';
|
||||
import 'package:fladder/util/list_padding.dart';
|
||||
import 'package:fladder/util/sticky_header_text.dart';
|
||||
import 'package:fladder/widgets/navigation_scaffold/components/side_navigation_bar.dart';
|
||||
import 'package:fladder/widgets/shared/ensure_visible.dart';
|
||||
|
||||
class HorizontalList<T> extends ConsumerStatefulWidget {
|
||||
final bool autoFocus;
|
||||
final String? label;
|
||||
final List<Widget> titleActions;
|
||||
final Function()? onLabelClick;
|
||||
final String? subtext;
|
||||
final List<T> items;
|
||||
final int? startIndex;
|
||||
final Widget Function(BuildContext context, int index) itemBuilder;
|
||||
final Widget Function(BuildContext context, int index, int selected) itemBuilder;
|
||||
final Function(int index)? onFocused;
|
||||
final bool scrollToEnd;
|
||||
final EdgeInsets contentPadding;
|
||||
final double? dominantRatio;
|
||||
final double? height;
|
||||
final bool shrinkWrap;
|
||||
const HorizontalList({
|
||||
this.autoFocus = false,
|
||||
required this.items,
|
||||
required this.itemBuilder,
|
||||
this.onFocused,
|
||||
this.startIndex,
|
||||
this.height,
|
||||
this.label,
|
||||
|
|
@ -45,44 +51,100 @@ class HorizontalList<T> extends ConsumerStatefulWidget {
|
|||
}
|
||||
|
||||
class _HorizontalListState extends ConsumerState<HorizontalList> {
|
||||
final FocusNode parentNode = FocusNode();
|
||||
late int currentIndex = 0;
|
||||
final GlobalKey _firstItemKey = GlobalKey();
|
||||
final ScrollController _scrollController = ScrollController();
|
||||
final contentPadding = 8.0;
|
||||
double? contentWidth;
|
||||
double? _firstItemWidth;
|
||||
bool hasFocus = false;
|
||||
|
||||
late List<FocusNode> _focusNodes;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_measureFirstItem(scrollTo: true);
|
||||
_initFocusNodes();
|
||||
_measureFirstItem();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _measureFirstItem({bool scrollTo = false}) {
|
||||
void _measureFirstItem() {
|
||||
if (_firstItemWidth != null) return;
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
if (widget.startIndex != null) {
|
||||
final context = _firstItemKey.currentContext;
|
||||
if (context != null) {
|
||||
final box = context.findRenderObject() as RenderBox;
|
||||
_firstItemWidth = box.size.width;
|
||||
if (scrollTo) {
|
||||
_scrollToPosition(widget.startIndex!);
|
||||
}
|
||||
}
|
||||
final context = _firstItemKey.currentContext;
|
||||
if (context != null) {
|
||||
final box = context.findRenderObject() as RenderBox;
|
||||
_firstItemWidth = box.size.width;
|
||||
_scrollToPosition(widget.startIndex ?? 0);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
void _scrollToPosition(int index) {
|
||||
final offset = index * _firstItemWidth! + index * contentPadding;
|
||||
_scrollController.animateTo(
|
||||
offset,
|
||||
void _initFocusNodes() {
|
||||
_focusNodes = List.generate(widget.items.length, (i) {
|
||||
final node = FocusNode();
|
||||
node.addListener(() {
|
||||
if (node.hasFocus) {
|
||||
_scrollToPosition(i);
|
||||
if (widget.onFocused != null) {
|
||||
widget.onFocused?.call(i);
|
||||
} else {
|
||||
context.ensureVisible();
|
||||
}
|
||||
}
|
||||
});
|
||||
return node;
|
||||
});
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
if (widget.autoFocus) {
|
||||
_focusNodes[currentIndex].requestFocus();
|
||||
context.ensureVisible();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
for (var node in _focusNodes) {
|
||||
node.dispose();
|
||||
}
|
||||
parentNode.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
void didUpdateWidget(HorizontalList oldWidget) {
|
||||
super.didUpdateWidget(oldWidget);
|
||||
|
||||
if (widget.items.length != oldWidget.items.length) {
|
||||
for (var node in _focusNodes) {
|
||||
node.dispose();
|
||||
}
|
||||
_initFocusNodes();
|
||||
|
||||
if (currentIndex >= widget.items.length) {
|
||||
currentIndex = widget.items.isEmpty ? 0 : widget.items.length - 1;
|
||||
}
|
||||
|
||||
if (widget.items.isNotEmpty && parentNode.hasFocus) {
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
_focusNodes[currentIndex].requestFocus();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _scrollToPosition(int index) async {
|
||||
if (_firstItemWidth == null) return;
|
||||
|
||||
final offset = index * (_firstItemWidth! + contentPadding);
|
||||
final clamped = math.min(offset, _scrollController.position.maxScrollExtent);
|
||||
|
||||
await _scrollController.animateTo(
|
||||
clamped,
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut,
|
||||
curve: Curves.fastOutSlowIn,
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -90,34 +152,35 @@ class _HorizontalListState extends ConsumerState<HorizontalList> {
|
|||
_scrollController.animateTo(
|
||||
0,
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut,
|
||||
curve: Curves.fastOutSlowIn,
|
||||
);
|
||||
}
|
||||
|
||||
void _scrollToEnd() {
|
||||
Future<void> _scrollToEnd() async {
|
||||
final offset = (_firstItemWidth ?? 200) * widget.items.length + 200;
|
||||
_scrollController.animateTo(
|
||||
(_firstItemWidth ?? 200) * widget.items.length + 200,
|
||||
math.min(offset, _scrollController.position.maxScrollExtent),
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut,
|
||||
curve: Curves.fastOutSlowIn,
|
||||
);
|
||||
}
|
||||
|
||||
int getFirstVisibleIndex() {
|
||||
if (widget.startIndex == null) return 0;
|
||||
if (!_scrollController.hasClients || _firstItemWidth == null) return 0;
|
||||
return (_scrollController.offset / _firstItemWidth!).floor().clamp(0, widget.items.length - 1);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final hasPointer = AdaptiveLayout.of(context).inputDevice == InputDevice.pointer;
|
||||
final content = Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
DisableFocus(
|
||||
child: Padding(
|
||||
return Focus(
|
||||
focusNode: parentNode,
|
||||
onFocusChange: (value) {
|
||||
if (value) {
|
||||
_focusNodes[currentIndex].requestFocus();
|
||||
}
|
||||
},
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Padding(
|
||||
padding: widget.contentPadding,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
|
|
@ -128,18 +191,22 @@ class _HorizontalListState extends ConsumerState<HorizontalList> {
|
|||
children: [
|
||||
if (widget.label != null)
|
||||
Flexible(
|
||||
child: StickyHeaderText(
|
||||
label: widget.label ?? "",
|
||||
onClick: widget.onLabelClick,
|
||||
child: ExcludeFocus(
|
||||
child: StickyHeaderText(
|
||||
label: widget.label ?? "",
|
||||
onClick: widget.onLabelClick,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (widget.subtext != null)
|
||||
Flexible(
|
||||
child: Opacity(
|
||||
opacity: 0.5,
|
||||
child: Text(
|
||||
widget.subtext!,
|
||||
style: Theme.of(context).textTheme.titleMedium,
|
||||
child: ExcludeFocus(
|
||||
child: Opacity(
|
||||
opacity: 0.5,
|
||||
child: Text(
|
||||
widget.subtext!,
|
||||
style: Theme.of(context).textTheme.titleMedium,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
@ -148,89 +215,135 @@ class _HorizontalListState extends ConsumerState<HorizontalList> {
|
|||
),
|
||||
),
|
||||
if (widget.items.length > 1)
|
||||
Card(
|
||||
elevation: 5,
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
if (hasPointer)
|
||||
GestureDetector(
|
||||
onLongPress: () => _scrollToStart(),
|
||||
child: IconButton(
|
||||
ExcludeFocus(
|
||||
child: Card(
|
||||
elevation: 5,
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
if (hasPointer)
|
||||
GestureDetector(
|
||||
onLongPress: () => _scrollToStart(),
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
_scrollController.animateTo(
|
||||
_scrollController.offset + -(MediaQuery.of(context).size.width / 1.75),
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut);
|
||||
},
|
||||
icon: const Icon(
|
||||
IconsaxPlusLinear.arrow_left_1,
|
||||
size: 20,
|
||||
)),
|
||||
),
|
||||
if (widget.startIndex != null)
|
||||
IconButton(
|
||||
tooltip: "Scroll to current",
|
||||
onPressed: () {
|
||||
_scrollController.animateTo(
|
||||
_scrollController.offset + -(MediaQuery.of(context).size.width / 1.75),
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut);
|
||||
},
|
||||
icon: const Icon(
|
||||
IconsaxPlusLinear.arrow_left_1,
|
||||
size: 20,
|
||||
)),
|
||||
),
|
||||
if (widget.startIndex != null)
|
||||
IconButton(
|
||||
tooltip: "Scroll to current",
|
||||
onPressed: () {
|
||||
if (_firstItemWidth != null && widget.startIndex != null) {
|
||||
_scrollToPosition(widget.startIndex!);
|
||||
}
|
||||
},
|
||||
icon: const Icon(
|
||||
Icons.circle,
|
||||
size: 16,
|
||||
)),
|
||||
if (hasPointer)
|
||||
GestureDetector(
|
||||
onLongPress: () => _scrollToEnd(),
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
_scrollController.animateTo(
|
||||
_scrollController.offset + (MediaQuery.of(context).size.width / 1.75),
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut);
|
||||
},
|
||||
icon: const Icon(
|
||||
IconsaxPlusLinear.arrow_right_3,
|
||||
size: 20,
|
||||
Icons.circle,
|
||||
size: 16,
|
||||
)),
|
||||
),
|
||||
],
|
||||
if (hasPointer)
|
||||
GestureDetector(
|
||||
onLongPress: () => _scrollToEnd(),
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
_scrollController.animateTo(
|
||||
_scrollController.offset + (MediaQuery.of(context).size.width / 1.75),
|
||||
duration: const Duration(milliseconds: 250),
|
||||
curve: Curves.easeInOut);
|
||||
},
|
||||
icon: const Icon(
|
||||
IconsaxPlusLinear.arrow_right_3,
|
||||
size: 20,
|
||||
)),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
].addPadding(const EdgeInsets.symmetric(horizontal: 6)),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
SizedBox(
|
||||
height: widget.height ??
|
||||
((AdaptiveLayout.poster(context).size *
|
||||
ref.watch(clientSettingsProvider.select((value) => value.posterSize))) /
|
||||
pow((widget.dominantRatio ?? 1.0), 0.55)) *
|
||||
0.72,
|
||||
child: ListView.separated(
|
||||
controller: _scrollController,
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: widget.contentPadding,
|
||||
itemBuilder: (context, index) => index == getFirstVisibleIndex()
|
||||
? Container(
|
||||
key: _firstItemKey,
|
||||
child: widget.itemBuilder(context, index),
|
||||
)
|
||||
: widget.itemBuilder(context, index),
|
||||
separatorBuilder: (context, index) => SizedBox(width: contentPadding),
|
||||
itemCount: widget.items.length,
|
||||
const SizedBox(height: 8),
|
||||
SizedBox(
|
||||
height: widget.height ??
|
||||
((AdaptiveLayout.poster(context).size *
|
||||
ref.watch(clientSettingsProvider.select((value) => value.posterSize))) /
|
||||
math.pow((widget.dominantRatio ?? 1.0), 0.55)) *
|
||||
0.72,
|
||||
child: FocusTraversalGroup(
|
||||
policy: HorizontalRailFocus(
|
||||
parentNode: parentNode,
|
||||
nodes: _focusNodes,
|
||||
onChanged: (value) {
|
||||
currentIndex = value;
|
||||
_focusNodes[value].requestFocus();
|
||||
}),
|
||||
child: ExcludeFocusTraversal(
|
||||
child: ListView.separated(
|
||||
controller: _scrollController,
|
||||
scrollDirection: Axis.horizontal,
|
||||
padding: widget.contentPadding,
|
||||
itemBuilder: (context, index) {
|
||||
return FocusProvider(
|
||||
focusNode: _focusNodes[index],
|
||||
hasFocus: hasFocus && index == currentIndex,
|
||||
key: index == 0 ? _firstItemKey : null,
|
||||
child: widget.itemBuilder(context, index, hasFocus ? currentIndex : -1),
|
||||
);
|
||||
},
|
||||
separatorBuilder: (context, index) => SizedBox(width: contentPadding),
|
||||
itemCount: widget.items.length,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
return widget.startIndex == null
|
||||
? content
|
||||
: LayoutBuilder(builder: (context, constraints) {
|
||||
_measureFirstItem();
|
||||
return content;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
class HorizontalRailFocus extends WidgetOrderTraversalPolicy {
|
||||
final FocusNode parentNode;
|
||||
final List<FocusNode> nodes;
|
||||
final Function(int value) onChanged;
|
||||
HorizontalRailFocus({
|
||||
required this.parentNode,
|
||||
required this.nodes,
|
||||
required this.onChanged,
|
||||
});
|
||||
|
||||
@override
|
||||
bool inDirection(FocusNode currentNode, TraversalDirection direction) {
|
||||
// Find the index of the currently focused node
|
||||
final int current = nodes.indexWhere((node) => node.hasFocus);
|
||||
// If nothing is focused, default to 0
|
||||
final int currentIndex = current == -1 ? 0 : current;
|
||||
|
||||
if (direction == TraversalDirection.left) {
|
||||
if (currentIndex <= 0) {
|
||||
navBarNode.requestFocus();
|
||||
return true;
|
||||
} else {
|
||||
onChanged(math.max(currentIndex - 1, 0));
|
||||
return true;
|
||||
}
|
||||
} else if (direction == TraversalDirection.right) {
|
||||
if (currentIndex >= nodes.length - 1) {
|
||||
// Corrected boundary check
|
||||
return super.inDirection(parentNode, direction);
|
||||
} else {
|
||||
onChanged(math.min(currentIndex + 1, nodes.length - 1));
|
||||
return true;
|
||||
}
|
||||
}
|
||||
parentNode.requestFocus();
|
||||
return super.inDirection(parentNode, direction);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue