feat(ui): Implement a generic list item
This commit is contained in:
parent
a60e9e8e81
commit
cd1291a192
@ -3,7 +3,7 @@ import 'package:anitrack/src/data/type.dart';
|
|||||||
import 'package:anitrack/src/ui/bloc/anime_list_bloc.dart';
|
import 'package:anitrack/src/ui/bloc/anime_list_bloc.dart';
|
||||||
import 'package:anitrack/src/ui/bloc/anime_search_bloc.dart';
|
import 'package:anitrack/src/ui/bloc/anime_search_bloc.dart';
|
||||||
import 'package:anitrack/src/ui/constants.dart';
|
import 'package:anitrack/src/ui/constants.dart';
|
||||||
import 'package:anitrack/src/ui/widgets/anime.dart';
|
import 'package:anitrack/src/ui/widgets/list_item.dart';
|
||||||
import 'package:bottom_bar/bottom_bar.dart';
|
import 'package:bottom_bar/bottom_bar.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||||
@ -81,8 +81,15 @@ class AnimeListPage extends StatelessWidget {
|
|||||||
if (anime.state != state.filterState) return Container();
|
if (anime.state != state.filterState) return Container();
|
||||||
}
|
}
|
||||||
|
|
||||||
return AnimeListWidget(
|
return ListItem(
|
||||||
data: anime,
|
title: anime.title,
|
||||||
|
thumbnailUrl: anime.thumbnailUrl,
|
||||||
|
extra: [
|
||||||
|
Text(
|
||||||
|
'${anime.episodesWatched}/${anime.episodesTotal ?? "???"}',
|
||||||
|
style: Theme.of(context).textTheme.titleMedium,
|
||||||
|
),
|
||||||
|
],
|
||||||
onLeftSwipe: () {
|
onLeftSwipe: () {
|
||||||
context.read<AnimeListBloc>().add(
|
context.read<AnimeListBloc>().add(
|
||||||
AnimeEpisodeDecrementedEvent(state.animes[index].id),
|
AnimeEpisodeDecrementedEvent(state.animes[index].id),
|
||||||
|
@ -3,7 +3,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
|
|||||||
import 'package:anitrack/src/data/anime.dart';
|
import 'package:anitrack/src/data/anime.dart';
|
||||||
import 'package:anitrack/src/ui/bloc/anime_search_bloc.dart';
|
import 'package:anitrack/src/ui/bloc/anime_search_bloc.dart';
|
||||||
import 'package:anitrack/src/ui/constants.dart';
|
import 'package:anitrack/src/ui/constants.dart';
|
||||||
import 'package:anitrack/src/ui/widgets/anime.dart';
|
import 'package:anitrack/src/ui/widgets/list_item.dart';
|
||||||
import 'package:anitrack/src/ui/widgets/image.dart';
|
import 'package:anitrack/src/ui/widgets/image.dart';
|
||||||
|
|
||||||
class AnimeSearchPage extends StatelessWidget {
|
class AnimeSearchPage extends StatelessWidget {
|
||||||
@ -54,7 +54,6 @@ class AnimeSearchPage extends StatelessWidget {
|
|||||||
else
|
else
|
||||||
Expanded(
|
Expanded(
|
||||||
child: ListView.builder(
|
child: ListView.builder(
|
||||||
//shrinkWrap: true,
|
|
||||||
itemCount: state.searchResults.length,
|
itemCount: state.searchResults.length,
|
||||||
itemBuilder: (context, index) {
|
itemBuilder: (context, index) {
|
||||||
final item = state.searchResults[index];
|
final item = state.searchResults[index];
|
||||||
@ -64,32 +63,10 @@ class AnimeSearchPage extends StatelessWidget {
|
|||||||
AnimeAddedEvent(item),
|
AnimeAddedEvent(item),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
child: Padding(
|
child: ListItem(
|
||||||
padding: const EdgeInsets.all(8),
|
title: item.title,
|
||||||
child: Row(
|
thumbnailUrl: item.thumbnailUrl,
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
extra: [
|
||||||
children: [
|
|
||||||
AnimeCoverImage(
|
|
||||||
url: item.thumbnailUrl,
|
|
||||||
),
|
|
||||||
|
|
||||||
Expanded(
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 8),
|
|
||||||
child: Column(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
children: [
|
|
||||||
Align(
|
|
||||||
alignment: Alignment.centerLeft,
|
|
||||||
child: Text(
|
|
||||||
item.title,
|
|
||||||
style: Theme.of(context).textTheme.titleLarge,
|
|
||||||
maxLines: 2,
|
|
||||||
softWrap: true,
|
|
||||||
overflow: TextOverflow.ellipsis,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
Align(
|
Align(
|
||||||
alignment: Alignment.centerLeft,
|
alignment: Alignment.centerLeft,
|
||||||
child: Text(
|
child: Text(
|
||||||
@ -103,11 +80,6 @@ class AnimeSearchPage extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
),
|
),
|
||||||
|
@ -4,29 +4,37 @@ import 'package:flutter/material.dart';
|
|||||||
import 'package:swipeable_tile/swipeable_tile.dart';
|
import 'package:swipeable_tile/swipeable_tile.dart';
|
||||||
|
|
||||||
/// A widget for displaying simple data about an anime in the listview
|
/// A widget for displaying simple data about an anime in the listview
|
||||||
class AnimeListWidget extends StatelessWidget {
|
class ListItem extends StatelessWidget {
|
||||||
const AnimeListWidget({
|
ListItem({
|
||||||
required this.data,
|
required this.thumbnailUrl,
|
||||||
required this.onLeftSwipe,
|
required this.title,
|
||||||
required this.onRightSwipe,
|
this.onLeftSwipe,
|
||||||
|
this.onRightSwipe,
|
||||||
|
this.extra = const [],
|
||||||
super.key,
|
super.key,
|
||||||
});
|
});
|
||||||
|
|
||||||
/// The anime to display
|
/// URL for the cover image.
|
||||||
final AnimeTrackingData data;
|
final String thumbnailUrl;
|
||||||
|
|
||||||
/// Callbacks for the swipe functionality
|
/// The title of the item
|
||||||
final void Function() onLeftSwipe;
|
final String title;
|
||||||
final void Function() onRightSwipe;
|
|
||||||
|
/// Extra widgets.
|
||||||
|
final List<Widget> extra;
|
||||||
|
|
||||||
|
/// Callbacks for the swipe functionality.
|
||||||
|
final void Function()? onLeftSwipe;
|
||||||
|
final void Function()? onRightSwipe;
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return SwipeableTile.swipeToTrigger(
|
return SwipeableTile.swipeToTrigger(
|
||||||
onSwiped: (direction) {
|
onSwiped: (direction) {
|
||||||
if (direction == SwipeDirection.endToStart) {
|
if (direction == SwipeDirection.endToStart) {
|
||||||
onRightSwipe();
|
onRightSwipe!();
|
||||||
} else if (direction == SwipeDirection.startToEnd) {
|
} else if (direction == SwipeDirection.startToEnd) {
|
||||||
onLeftSwipe();
|
onLeftSwipe!();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// TODO(PapaTutuWawa): Fix
|
// TODO(PapaTutuWawa): Fix
|
||||||
@ -51,7 +59,9 @@ class AnimeListWidget extends StatelessWidget {
|
|||||||
return Container();
|
return Container();
|
||||||
},
|
},
|
||||||
color: Theme.of(context).scaffoldBackgroundColor,
|
color: Theme.of(context).scaffoldBackgroundColor,
|
||||||
direction: SwipeDirection.horizontal,
|
direction: onRightSwipe != null && onLeftSwipe != null ?
|
||||||
|
SwipeDirection.horizontal :
|
||||||
|
SwipeDirection.none,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(8),
|
padding: const EdgeInsets.all(8),
|
||||||
child: Row(
|
child: Row(
|
||||||
@ -62,7 +72,7 @@ class AnimeListWidget extends StatelessWidget {
|
|||||||
child: SizedBox(
|
child: SizedBox(
|
||||||
width: 100,
|
width: 100,
|
||||||
child: Image.network(
|
child: Image.network(
|
||||||
data.thumbnailUrl,
|
thumbnailUrl,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@ -75,7 +85,7 @@ class AnimeListWidget extends StatelessWidget {
|
|||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(
|
||||||
data.title,
|
title,
|
||||||
textAlign: TextAlign.left,
|
textAlign: TextAlign.left,
|
||||||
style: Theme.of(context).textTheme.titleLarge,
|
style: Theme.of(context).textTheme.titleLarge,
|
||||||
maxLines: 2,
|
maxLines: 2,
|
||||||
@ -83,10 +93,7 @@ class AnimeListWidget extends StatelessWidget {
|
|||||||
overflow: TextOverflow.ellipsis,
|
overflow: TextOverflow.ellipsis,
|
||||||
),
|
),
|
||||||
|
|
||||||
Text(
|
...extra,
|
||||||
'${data.episodesWatched}/${data.episodesTotal ?? "???"}',
|
|
||||||
style: Theme.of(context).textTheme.titleMedium,
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
Loading…
Reference in New Issue
Block a user