xevion/paperless-mobile
1
0
Fork 0
mirror of https://github.com/Xevion/paperless-mobile.git synced 2025-12-10 14:07:59 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat: Implemented new view type, fix connectivity issues, fix offline issues, fix loading animations, fix documents page paging

Browse Source
This commit is contained in:
Anton Stubenbord
2023-02-14 00:24:14 +01:00
parent c5033792aa
commit 6f66bf27fd
29 changed files with 806 additions and 606 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
lib/features/documents/view/pages/document_view.dart
View File

@@ -36,11 +36,14 @@ class _DocumentViewState extends State<DocumentView> {
),
body: PdfView(
builders: PdfViewBuilders<DefaultBuilderOptions>(
options: const DefaultBuilderOptions(),
options: const DefaultBuilderOptions(
loaderSwitchDuration: Duration(milliseconds: 500),
),
pageLoaderBuilder: (context) => const Center(
child: CircularProgressIndicator(),
),
),
scrollDirection: Axis.vertical,
controller: _pdfController,
),
);

419
lib/features/documents/view/pages/documents_page.dart
View File

@@ -14,6 +14,7 @@ import 'package:paperless_mobile/features/documents/view/widgets/selection/bulk_
import 'package:paperless_mobile/features/documents/view/widgets/selection/view_type_selection_widget.dart';
import 'package:paperless_mobile/features/documents/view/widgets/sort_documents_button.dart';
import 'package:paperless_mobile/features/labels/cubit/providers/labels_bloc_provider.dart';
import 'package:paperless_mobile/features/paged_document_view/view/document_paging_view_mixin.dart';
import 'package:paperless_mobile/features/saved_view/cubit/saved_view_cubit.dart';
import 'package:paperless_mobile/features/saved_view/view/add_saved_view_page.dart';
import 'package:paperless_mobile/features/saved_view/view/saved_view_list.dart';
@@ -42,10 +43,18 @@ class DocumentsPage extends StatefulWidget {
}
class _DocumentsPageState extends State<DocumentsPage>
with SingleTickerProviderStateMixin {
with
SingleTickerProviderStateMixin,
DocumentPagingViewMixin<DocumentsPage, DocumentsCubit> {
late final TabController _tabController;
@override
ScrollController get pagingScrollController =>
_nestedScrollViewKey.currentState?.innerController ?? ScrollController();
final GlobalKey<NestedScrollViewState> _nestedScrollViewKey = GlobalKey();
int _currentTab = 0;
bool _showBackToTopButton = false;
@override
void initState() {
@@ -53,21 +62,40 @@ class _DocumentsPageState extends State<DocumentsPage>
_tabController = TabController(
length: 2,
vsync: this,
initialIndex: 0,
);
try {
context.read<DocumentsCubit>().reload();
context.read<SavedViewCubit>().reload();
} on PaperlessServerException catch (error, stackTrace) {
showErrorMessage(context, error, stackTrace);
}
_tabController.addListener(_listenForTabChanges);
Future.wait([
context.read<DocumentsCubit>().reload(),
context.read<SavedViewCubit>().reload(),
]).onError<PaperlessServerException>(
(error, stackTrace) {
showErrorMessage(context, error, stackTrace);
return [];
},
);
_tabController.addListener(_tabChangesListener);
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
_nestedScrollViewKey.currentState!.innerController
..addListener(_scrollExtentListener)
..addListener(shouldLoadMoreDocumentsListener);
});
}
void _listenForTabChanges() {
setState(() {
_currentTab = _tabController.index;
});
void _tabChangesListener() {
setState(() => _currentTab = _tabController.index);
}
void _scrollExtentListener() {
if (pagingScrollController.position.pixels >
MediaQuery.of(context).size.height) {
if (!_showBackToTopButton) {
setState(() => _showBackToTopButton = true);
}
} else {
if (_showBackToTopButton) {
setState(() => _showBackToTopButton = false);
}
}
}
@override
@@ -145,186 +173,100 @@ class _DocumentsPageState extends State<DocumentsPage>
}
return false;
},
child: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
// This widget takes the overlapping behavior of the SliverAppBar,
// and redirects it to the SliverOverlapInjector below. If it is
// missing, then it is possible for the nested "inner" scroll view
// below to end up under the SliverAppBar even when the inner
// scroll view thinks it has not been scrolled.
// This is not necessary if the "headerSliverBuilder" only builds
// widgets that do not overlap the next sliver.
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(
context,
),
sliver: BlocBuilder<DocumentsCubit, DocumentsState>(
builder: (context, state) {
if (state.selection.isNotEmpty) {
return SliverAppBar(
floating: false,
pinned: true,
leading: IconButton(
icon: const Icon(Icons.close),
onPressed: () => context
.read<DocumentsCubit>()
.resetSelection(),
),
title: Text(
"${state.selection.length} ${S.of(context).documentsSelectedText}",
),
actions: [
IconButton(
icon: const Icon(Icons.delete),
onPressed: () => _onDelete(state),
child: Stack(
children: [
NestedScrollView(
key: _nestedScrollViewKey,
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
// This widget takes the overlapping behavior of the SliverAppBar,
// and redirects it to the SliverOverlapInjector below. If it is
// missing, then it is possible for the nested "inner" scroll view
// below to end up under the SliverAppBar even when the inner
// scroll view thinks it has not been scrolled.
// This is not necessary if the "headerSliverBuilder" only builds
// widgets that do not overlap the next sliver.
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(
context,
),
sliver: BlocBuilder<DocumentsCubit, DocumentsState>(
builder: (context, state) {
if (state.selection.isNotEmpty) {
return SliverAppBar(
floating: false,
pinned: true,
leading: IconButton(
icon: const Icon(Icons.close),
onPressed: () => context
.read<DocumentsCubit>()
.resetSelection(),
),
title: Text(
"${state.selection.length} ${S.of(context).documentsSelectedText}",
),
actions: [
IconButton(
icon: const Icon(Icons.delete),
onPressed: () => _onDelete(state),
),
],
);
}
return SearchAppBar(
hintText:
S.of(context).documentSearchSearchDocuments,
onOpenSearch: showDocumentSearchPage,
bottom: TabBar(
controller: _tabController,
tabs: [
Tab(text: S.of(context).documentsPageTitle),
Tab(text: S.of(context).savedViewsLabel),
],
),
],
);
);
},
),
),
],
body: NotificationListener<ScrollNotification>(
onNotification: (notification) {
final metrics = notification.metrics;
if (metrics.maxScrollExtent == 0) {
return true;
}
return SearchAppBar(
hintText: S.of(context).documentSearchSearchDocuments,
onOpenSearch: showDocumentSearchPage,
bottom: TabBar(
controller: _tabController,
tabs: [
Tab(text: S.of(context).documentsPageTitle),
Tab(text: S.of(context).savedViewsLabel),
],
),
);
final desiredTab =
(metrics.pixels / metrics.maxScrollExtent).round();
if (metrics.axis == Axis.horizontal &&
_currentTab != desiredTab) {
setState(() => _currentTab = desiredTab);
}
return false;
},
),
),
],
body: NotificationListener<ScrollNotification>(
onNotification: (notification) {
final metrics = notification.metrics;
if (metrics.maxScrollExtent == 0) {
return true;
}
final desiredTab =
(metrics.pixels / metrics.maxScrollExtent).round();
if (metrics.axis == Axis.horizontal &&
_currentTab != desiredTab) {
setState(() => _currentTab = desiredTab);
}
return false;
},
child: NotificationListener<ScrollMetricsNotification>(
onNotification: (notification) {
// Listen for scroll notifications to load new data.
// Scroll controller does not work here due to nestedscrollview limitations.
final currState = context.read<DocumentsCubit>().state;
final max = notification.metrics.maxScrollExtent;
if (max == 0 ||
_currentTab != 0 ||
currState.isLoading ||
currState.isLastPageLoaded) {
return true;
}
final offset = notification.metrics.pixels;
if (offset >= max * 0.7) {
context
.read<DocumentsCubit>()
.loadMore()
.onError<PaperlessServerException>(
(error, stackTrace) => showErrorMessage(
child: TabBarView(
controller: _tabController,
children: [
Builder(
builder: (context) {
return _buildDocumentsTab(
connectivityState,
context,
error,
stackTrace,
),
);
}
return false;
},
child: TabBarView(
controller: _tabController,
children: [
Builder(
builder: (context) {
return RefreshIndicator(
edgeOffset: kToolbarHeight + kTextTabBarHeight,
onRefresh: _onReloadDocuments,
notificationPredicate: (_) =>
connectivityState.isConnected,
child: CustomScrollView(
key: const PageStorageKey<String>("documents"),
slivers: <Widget>[
SliverOverlapInjector(
handle: NestedScrollView
.sliverOverlapAbsorberHandleFor(
context),
),
_buildViewActions(),
BlocBuilder<DocumentsCubit, DocumentsState>(
builder: (context, state) {
if (state.hasLoaded &&
state.documents.isEmpty) {
return SliverToBoxAdapter(
child: DocumentsEmptyState(
state: state,
onReset: () {
context
.read<DocumentsCubit>()
.resetFilter();
},
),
);
}
return SliverAdaptiveDocumentsView(
viewType: state.viewType,
onTap: _openDetails,
onSelected: context
.read<DocumentsCubit>()
.toggleDocumentSelection,
hasInternetConnection:
connectivityState.isConnected,
onTagSelected: _addTagToFilter,
onCorrespondentSelected:
_addCorrespondentToFilter,
onDocumentTypeSelected:
_addDocumentTypeToFilter,
onStoragePathSelected:
_addStoragePathToFilter,
documents: state.documents,
hasLoaded: state.hasLoaded,
isLabelClickable: true,
isLoading: state.isLoading,
selectedDocumentIds: state.selectedIds,
);
},
),
],
),
);
},
),
Builder(
builder: (context) {
return RefreshIndicator(
edgeOffset: kToolbarHeight + kTextTabBarHeight,
onRefresh: _onReloadSavedViews,
notificationPredicate: (_) =>
connectivityState.isConnected,
child: CustomScrollView(
key: const PageStorageKey<String>("savedViews"),
slivers: <Widget>[
SliverOverlapInjector(
handle: NestedScrollView
.sliverOverlapAbsorberHandleFor(
context),
),
const SavedViewList(),
],
),
);
},
),
],
);
},
),
Builder(
builder: (context) {
return _buildSavedViewsTab(
connectivityState,
context,
);
},
),
],
),
),
),
),
if (_showBackToTopButton) _buildBackToTopAction(context),
],
),
),
);
@@ -333,6 +275,109 @@ class _DocumentsPageState extends State<DocumentsPage>
);
}
Widget _buildBackToTopAction(BuildContext context) {
return Transform.translate(
offset: const Offset(24, -24),
child: Align(
alignment: Alignment.bottomLeft,
child: ActionChip(
backgroundColor: Theme.of(context).colorScheme.primary,
side: BorderSide.none,
avatar: Icon(
Icons.expand_less,
color: Theme.of(context).colorScheme.onPrimary,
),
onPressed: () async {
await pagingScrollController.animateTo(
0,
duration: const Duration(milliseconds: 300),
curve: Curves.easeInExpo,
);
_nestedScrollViewKey.currentState?.outerController.jumpTo(0);
},
label: Text(
"Go to top", //TODO: INTL
style: DefaultTextStyle.of(context).style.apply(
color: Theme.of(context).colorScheme.onPrimary,
),
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(24),
),
),
),
);
}
Widget _buildSavedViewsTab(
ConnectivityState connectivityState,
BuildContext context,
) {
return RefreshIndicator(
edgeOffset: kToolbarHeight + kTextTabBarHeight,
onRefresh: _onReloadSavedViews,
notificationPredicate: (_) => connectivityState.isConnected,
child: CustomScrollView(
key: const PageStorageKey<String>("savedViews"),
slivers: <Widget>[
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
const SavedViewList(),
],
),
);
}
Widget _buildDocumentsTab(
ConnectivityState connectivityState,
BuildContext context,
) {
return RefreshIndicator(
edgeOffset: kToolbarHeight + kTextTabBarHeight,
onRefresh: _onReloadDocuments,
notificationPredicate: (_) => connectivityState.isConnected,
child: CustomScrollView(
key: const PageStorageKey<String>("documents"),
slivers: <Widget>[
SliverOverlapInjector(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
),
_buildViewActions(),
BlocBuilder<DocumentsCubit, DocumentsState>(
builder: (context, state) {
if (state.hasLoaded && state.documents.isEmpty) {
return SliverToBoxAdapter(
child: DocumentsEmptyState(
state: state,
onReset: context.read<DocumentsCubit>().resetFilter,
),
);
}
return SliverAdaptiveDocumentsView(
viewType: state.viewType,
onTap: _openDetails,
onSelected:
context.read<DocumentsCubit>().toggleDocumentSelection,
hasInternetConnection: connectivityState.isConnected,
onTagSelected: _addTagToFilter,
onCorrespondentSelected: _addCorrespondentToFilter,
onDocumentTypeSelected: _addDocumentTypeToFilter,
onStoragePathSelected: _addStoragePathToFilter,
documents: state.documents,
hasLoaded: state.hasLoaded,
isLabelClickable: true,
isLoading: state.isLoading,
selectedDocumentIds: state.selectedIds,
);
},
),
],
),
);
}
Widget _buildViewActions() {
return SliverToBoxAdapter(
child: Row(

30
lib/features/documents/view/widgets/adaptive_documents_view.dart
View File

@@ -1,11 +1,12 @@
import 'package:flutter/material.dart';
import 'package:paperless_api/paperless_api.dart';
import 'package:paperless_mobile/core/repository/provider/label_repositories_provider.dart';
import 'package:paperless_mobile/features/documents/view/widgets/document_grid_loading_widget.dart';
import 'package:paperless_mobile/features/documents/view/widgets/documents_list_loading_widget.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/document_grid_loading_widget.dart';
import 'package:paperless_mobile/features/documents/view/widgets/items/document_detailed_item.dart';
import 'package:paperless_mobile/features/documents/view/widgets/items/document_grid_item.dart';
import 'package:paperless_mobile/features/documents/view/widgets/items/document_list_item.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/documents_list_loading_widget.dart';
import 'package:paperless_mobile/features/paged_document_view/cubit/paged_documents_state.dart';
import 'package:paperless_mobile/features/settings/model/view_type.dart';
abstract class AdaptiveDocumentsView extends StatelessWidget {
@@ -42,6 +43,24 @@ abstract class AdaptiveDocumentsView extends StatelessWidget {
required this.hasLoaded,
this.enableHeroAnimation = true,
});
AdaptiveDocumentsView.fromPagedState(
DocumentPagingState state, {
super.key,
this.onSelected,
this.onTap,
this.onCorrespondentSelected,
this.onDocumentTypeSelected,
this.onStoragePathSelected,
this.onTagSelected,
this.isLabelClickable = true,
this.enableHeroAnimation = true,
required this.hasInternetConnection,
this.viewType = ViewType.list,
this.selectedDocumentIds = const [],
}) : documents = state.documents,
isLoading = state.isLoading,
hasLoaded = state.hasLoaded;
}
class SliverAdaptiveDocumentsView extends AdaptiveDocumentsView {
@@ -115,7 +134,7 @@ class SliverAdaptiveDocumentsView extends AdaptiveDocumentsView {
(context, index) {
final document = documents.elementAt(index);
return LabelRepositoriesProvider(
child: DocumentGridItem(
child: DocumentDetailedItem(
isLabelClickable: isLabelClickable,
document: document,
onTap: onTap,
@@ -136,7 +155,7 @@ class SliverAdaptiveDocumentsView extends AdaptiveDocumentsView {
Widget _buildGridView() {
if (showLoadingPlaceholder) {
return DocumentGridLoadingWidget.sliver();
return const DocumentGridLoadingWidget.sliver();
}
return SliverGrid.builder(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
@@ -205,6 +224,7 @@ class DefaultAdaptiveDocumentsView extends AdaptiveDocumentsView {
}
return ListView.builder(
padding: EdgeInsets.zero,
controller: scrollController,
primary: false,
itemCount: documents.length,
@@ -235,6 +255,7 @@ class DefaultAdaptiveDocumentsView extends AdaptiveDocumentsView {
}
return ListView.builder(
padding: EdgeInsets.zero,
physics: const PageScrollPhysics(),
controller: scrollController,
primary: false,
@@ -265,6 +286,7 @@ class DefaultAdaptiveDocumentsView extends AdaptiveDocumentsView {
return DocumentGridLoadingWidget();
}
return GridView.builder(
padding: EdgeInsets.zero,
controller: scrollController,
primary: false,
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(

52
lib/features/documents/view/widgets/document_preview.dart
View File

@@ -2,51 +2,59 @@ import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cache_manager/flutter_cache_manager.dart';
import 'package:paperless_api/paperless_api.dart';
import 'package:paperless_mobile/features/documents/view/pages/document_view.dart';
import 'package:provider/provider.dart';
import 'package:shimmer/shimmer.dart';
class DocumentPreview extends StatelessWidget {
final int id;
final DocumentModel document;
final BoxFit fit;
final Alignment alignment;
final double borderRadius;
final bool enableHero;
final double scale;
const DocumentPreview({
super.key,
required this.id,
required this.document,
this.fit = BoxFit.cover,
this.alignment = Alignment.center,
this.borderRadius = 8.0,
this.alignment = Alignment.topCenter,
this.borderRadius = 12.0,
this.enableHero = true,
this.scale = 1.1,
});
@override
Widget build(BuildContext context) {
if (!enableHero) {
return _buildPreview(context);
}
return Hero(
tag: "thumb_$id",
child: _buildPreview(context),
return HeroMode(
enabled: enableHero,
child: Hero(
tag: "thumb_${document.id}",
child: _buildPreview(context),
),
);
}
ClipRRect _buildPreview(BuildContext context) {
Widget _buildPreview(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(borderRadius),
child: CachedNetworkImage(
fit: fit,
alignment: Alignment.topCenter,
cacheKey: "thumb_$id",
imageUrl: context.read<PaperlessDocumentsApi>().getThumbnailUrl(id),
errorWidget: (ctxt, msg, __) => Text(msg),
placeholder: (context, value) => Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: const SizedBox(height: 100, width: 100),
child: Transform.scale(
scale: scale,
child: CachedNetworkImage(
fit: fit,
alignment: alignment,
cacheKey: "thumb_${document.id}",
imageUrl: context
.read<PaperlessDocumentsApi>()
.getThumbnailUrl(document.id),
errorWidget: (ctxt, msg, __) => Text(msg),
placeholder: (context, value) => Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: const SizedBox(height: 100, width: 100),
),
cacheManager: context.watch<CacheManager>(),
),
cacheManager: context.watch<CacheManager>(),
),
);
}

123
lib/features/documents/view/widgets/items/document_detailed_item.dart
View File

@@ -1,6 +1,13 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
import 'package:paperless_mobile/features/documents/view/widgets/document_preview.dart';
import 'package:paperless_mobile/features/documents/view/widgets/items/document_item.dart';
import 'package:paperless_mobile/features/labels/correspondent/view/widgets/correspondent_widget.dart';
import 'package:paperless_mobile/features/labels/document_type/view/widgets/document_type_widget.dart';
import 'package:paperless_mobile/features/labels/tags/view/widgets/tags_widget.dart';
class DocumentDetailedItem extends DocumentItem {
const DocumentDetailedItem({
@@ -20,12 +27,118 @@ class DocumentDetailedItem extends DocumentItem {
@override
Widget build(BuildContext context) {
final size = MediaQuery.of(context).size;
final insets = MediaQuery.of(context).viewInsets;
final padding = MediaQuery.of(context).viewPadding;
final availableHeight = size.height -
insets.top -
insets.bottom -
padding.top -
padding.bottom -
kBottomNavigationBarHeight -
kToolbarHeight;
final maxHeight = min(500.0, availableHeight);
return Card(
child: Column(
children: [
DocumentPreview(id: document.id),
],
child: InkWell(
enableFeedback: true,
borderRadius: BorderRadius.circular(12),
onTap: () {
if (isSelectionActive) {
onSelected?.call(document);
} else {
onTap?.call(document);
}
},
onLongPress: () {
onSelected?.call(document);
},
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: BoxConstraints.tightFor(
width: double.infinity,
height: maxHeight / 2,
),
child: DocumentPreview(
document: document,
fit: BoxFit.cover,
alignment: Alignment.topCenter,
),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
DateFormat.yMMMMd().format(document.created),
style: Theme.of(context)
.textTheme
.bodySmall
?.apply(color: Theme.of(context).hintColor),
),
if (document.archiveSerialNumber != null)
Row(
children: [
Text(
'#${document.archiveSerialNumber}',
style: Theme.of(context)
.textTheme
.bodySmall
?.apply(color: Theme.of(context).hintColor),
),
],
),
],
).paddedLTRB(8, 8, 8, 4),
Text(
document.title,
style: Theme.of(context).textTheme.titleMedium,
maxLines: 2,
overflow: TextOverflow.ellipsis,
).paddedLTRB(8, 0, 8, 4),
Row(
children: [
const Icon(
Icons.person_outline,
size: 16,
).paddedOnly(right: 4.0),
CorrespondentWidget(
onSelected: onCorrespondentSelected,
textStyle: Theme.of(context).textTheme.titleSmall?.apply(
color:
Theme.of(context).colorScheme.onSurfaceVariant,
),
correspondentId: document.correspondent,
),
],
).paddedLTRB(8, 0, 8, 4),
Row(
children: [
const Icon(
Icons.description_outlined,
size: 16,
).paddedOnly(right: 4.0),
DocumentTypeWidget(
onSelected: onDocumentTypeSelected,
textStyle: Theme.of(context).textTheme.titleSmall?.apply(
color:
Theme.of(context).colorScheme.onSurfaceVariant,
),
documentTypeId: document.documentType,
),
],
).paddedLTRB(8, 0, 8, 4),
TagsWidget(
isMultiLine: false,
tagIds: document.tags,
).padded(),
],
),
],
),
),
);
).padded();
}
}

112
lib/features/documents/view/widgets/items/document_grid_item.dart
View File

@@ -25,66 +25,62 @@ class DocumentGridItem extends DocumentItem {
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: _onTap,
onLongPress: onSelected != null ? () => onSelected!(document) : null,
child: AbsorbPointer(
absorbing: isSelectionActive,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
elevation: 1.0,
color: isSelected
? Theme.of(context).colorScheme.inversePrimary
: Theme.of(context).cardColor,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AspectRatio(
aspectRatio: 1,
child: DocumentPreview(
id: document.id,
borderRadius: 12.0,
enableHero: enableHeroAnimation,
return Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
elevation: 1.0,
color: isSelected
? Theme.of(context).colorScheme.inversePrimary
: Theme.of(context).cardColor,
child: InkWell(
borderRadius: BorderRadius.circular(12),
onTap: _onTap,
onLongPress: onSelected != null ? () => onSelected!(document) : null,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AspectRatio(
aspectRatio: 1,
child: DocumentPreview(
document: document,
borderRadius: 12.0,
enableHero: enableHeroAnimation,
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
CorrespondentWidget(
correspondentId: document.correspondent,
),
DocumentTypeWidget(
documentTypeId: document.documentType,
),
Text(
document.title,
maxLines: document.tags.isEmpty ? 3 : 2,
overflow: TextOverflow.ellipsis,
style: Theme.of(context).textTheme.titleMedium,
),
const Spacer(),
TagsWidget(
tagIds: document.tags,
isMultiLine: false,
onTagSelected: onTagSelected,
),
const Spacer(),
Text(
DateFormat.yMMMd().format(document.created),
style: Theme.of(context).textTheme.bodySmall,
),
],
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
CorrespondentWidget(
correspondentId: document.correspondent,
),
DocumentTypeWidget(
documentTypeId: document.documentType,
),
Text(
document.title,
maxLines: document.tags.isEmpty ? 3 : 2,
overflow: TextOverflow.ellipsis,
style: Theme.of(context).textTheme.titleMedium,
),
const Spacer(),
TagsWidget(
tagIds: document.tags,
isMultiLine: false,
onTagSelected: onTagSelected,
),
const Spacer(),
Text(
DateFormat.yMMMd().format(
document.created,
),
style: Theme.of(context).textTheme.bodySmall,
),
],
),
),
),
],
),
),
],
),
),
),

2
lib/features/documents/view/widgets/items/document_list_item.dart
View File

@@ -122,7 +122,7 @@ class DocumentListItem extends DocumentItem {
aspectRatio: _a4AspectRatio,
child: GestureDetector(
child: DocumentPreview(
id: document.id,
document: document,
fit: BoxFit.cover,
alignment: Alignment.topCenter,
enableHero: enableHeroAnimation,

43
lib/features/documents/view/widgets/document_grid_loading_widget.dart → lib/features/documents/view/widgets/placeholder/document_grid_loading_widget.dart
View File

@@ -1,24 +1,15 @@
import 'dart:math';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:paperless_mobile/core/widgets/shimmer_placeholder.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
import 'package:paperless_mobile/features/documents/view/widgets/document_preview.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/document_item_placeholder.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/tags_placeholder.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/text_placeholder.dart';
import 'package:shimmer/shimmer.dart';
class DocumentGridLoadingWidget extends StatelessWidget
with DocumentItemPlaceholder {
class DocumentGridLoadingWidget extends StatelessWidget {
final bool _isSliver;
@override
final Random random = Random(1257195195);
DocumentGridLoadingWidget({super.key}) : _isSliver = false;
const DocumentGridLoadingWidget({super.key}) : _isSliver = false;
DocumentGridLoadingWidget.sliver({super.key}) : _isSliver = true;
const DocumentGridLoadingWidget.sliver({super.key}) : _isSliver = true;
@override
Widget build(BuildContext context) {
@@ -41,8 +32,6 @@ class DocumentGridLoadingWidget extends StatelessWidget
}
Widget _buildPlaceholderGridItem(BuildContext context) {
final values = nextValues;
return Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
@@ -68,21 +57,25 @@ class DocumentGridLoadingWidget extends StatelessWidget
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TextPlaceholder(
length: values.correspondentLength,
const TextPlaceholder(
length: 70,
fontSize: 16,
).padded(1),
const TextPlaceholder(
length: 50,
fontSize: 16,
).padded(1),
TextPlaceholder(
length: values.titleLength,
fontSize: 16,
length: 200,
fontSize:
Theme.of(context).textTheme.titleMedium?.fontSize ??
10,
).padded(1),
const Spacer(),
const TagsPlaceholder(
count: 2,
dense: true,
),
if (values.tagCount > 0) ...[
const Spacer(),
TagsPlaceholder(
count: values.tagCount,
dense: true,
),
],
const Spacer(),
TextPlaceholder(
length: 100,

30
lib/features/documents/view/widgets/placeholder/document_item_placeholder.dart
View File

@@ -1,30 +0,0 @@
import 'dart:math';
mixin DocumentItemPlaceholder {
static const _tags = [" ", " ", " "];
static const _titleLengths = <double>[double.infinity, 150.0, 200.0];
static const _correspondentLengths = <double>[120.0, 80.0, 40.0];
Random get random;
RandomDocumentItemPlaceholderValues get nextValues {
return RandomDocumentItemPlaceholderValues(
tagCount: random.nextInt(_tags.length + 1),
correspondentLength: _correspondentLengths[
random.nextInt(_correspondentLengths.length - 1)],
titleLength: _titleLengths[random.nextInt(_titleLengths.length - 1)],
);
}
}
class RandomDocumentItemPlaceholderValues {
final int tagCount;
final double correspondentLength;
final double titleLength;
RandomDocumentItemPlaceholderValues({
required this.tagCount,
required this.correspondentLength,
required this.titleLength,
});
}

39
lib/features/documents/view/widgets/documents_list_loading_widget.dart → lib/features/documents/view/widgets/placeholder/documents_list_loading_widget.dart
View File

@@ -1,21 +1,13 @@
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:paperless_mobile/core/widgets/shimmer_placeholder.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/document_item_placeholder.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/tags_placeholder.dart';
import 'package:paperless_mobile/features/documents/view/widgets/placeholder/text_placeholder.dart';
class DocumentsListLoadingWidget extends StatelessWidget
with DocumentItemPlaceholder {
class DocumentsListLoadingWidget extends StatelessWidget {
final bool _isSliver;
DocumentsListLoadingWidget({super.key}) : _isSliver = false;
const DocumentsListLoadingWidget({super.key}) : _isSliver = false;
DocumentsListLoadingWidget.sliver({super.key}) : _isSliver = true;
@override
final Random random = Random(1209571050);
const DocumentsListLoadingWidget.sliver({super.key}) : _isSliver = true;
@override
Widget build(BuildContext context) {
@@ -35,26 +27,31 @@ class DocumentsListLoadingWidget extends StatelessWidget
Widget _buildFakeListItem(BuildContext context) {
const fontSize = 14.0;
final values = nextValues;
return ShimmerPlaceholder(
child: ListTile(
contentPadding: const EdgeInsets.all(8),
dense: true,
isThreeLine: true,
leading: ClipRRect(
borderRadius: BorderRadius.circular(8),
borderRadius: BorderRadius.circular(12),
child: Container(
color: Colors.white,
height: double.infinity,
width: 35,
),
),
title: Row(
title: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TextPlaceholder(
length: values.correspondentLength,
const TextPlaceholder(
length: 120,
fontSize: fontSize,
),
const SizedBox(height: 2),
TextPlaceholder(
length: 220,
fontSize: Theme.of(context).textTheme.titleMedium!.fontSize!,
),
],
),
subtitle: Padding(
@@ -63,14 +60,10 @@ class DocumentsListLoadingWidget extends StatelessWidget
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
TagsPlaceholder(count: 2, dense: true),
SizedBox(height: 2),
TextPlaceholder(
length: values.titleLength,
fontSize: fontSize,
),
if (values.tagCount > 0)
TagsPlaceholder(count: values.tagCount, dense: true),
TextPlaceholder(
length: 100,
length: 250,
fontSize: Theme.of(context).textTheme.labelSmall!.fontSize!,
),
],

1
lib/features/documents/view/widgets/placeholder/tags_placeholder.dart
View File

@@ -15,6 +15,7 @@ class TagsPlaceholder extends StatelessWidget {
return SizedBox(
height: 32,
child: ListView.separated(
padding: EdgeInsets.zero,
itemCount: count,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) => FilterChip(

5
lib/features/documents/view/widgets/placeholder/text_placeholder.dart
View File

@@ -1,9 +1,4 @@
import 'dart:math';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:paperless_mobile/extensions/flutter_extensions.dart';
class TextPlaceholder extends StatelessWidget {
final double length;

42
lib/features/documents/view/widgets/selection/view_type_selection_widget.dart
View File

@@ -1,5 +1,4 @@
import 'package:flutter/material.dart';
import 'package:paperless_api/paperless_api.dart';
import 'package:paperless_mobile/features/settings/model/view_type.dart';
/// Meant to be used with blocbuilder.
@@ -28,22 +27,26 @@ class ViewTypeSelectionWidget extends StatelessWidget {
break;
}
return PopupMenuButton<ViewType>(
child: Icon(icon),
initialValue: viewType,
icon: Icon(icon),
itemBuilder: (context) => [
_buildViewTypeOption(
ViewType.list,
'List',
Icons.list,
context,
type: ViewType.list,
label: 'List', //TODO: INTL
icon: Icons.list,
),
_buildViewTypeOption(
ViewType.grid,
'Grid',
Icons.grid_view_rounded,
context,
type: ViewType.grid,
label: 'Grid', //TODO: INTL
icon: Icons.grid_view_rounded,
),
_buildViewTypeOption(
ViewType.detailed,
'Detailed',
Icons.article_outlined,
context,
type: ViewType.detailed,
label: 'Detailed', //TODO: INTL
icon: Icons.article_outlined,
),
],
onSelected: (next) {
@@ -53,17 +56,22 @@ class ViewTypeSelectionWidget extends StatelessWidget {
}
PopupMenuItem<ViewType> _buildViewTypeOption(
ViewType type,
String label,
IconData icon,
) {
BuildContext context, {
required ViewType type,
required String label,
required IconData icon,
}) {
final selected = type == viewType;
return PopupMenuItem(
value: type,
child: ListTile(
selected: type == viewType,
trailing: type == viewType ? const Icon(Icons.done) : null,
selected: selected,
trailing: selected ? const Icon(Icons.done) : null,
title: Text(label),
iconColor: Theme.of(context).colorScheme.onSurface,
textColor: Theme.of(context).colorScheme.onSurface,
leading: Icon(icon),
contentPadding: EdgeInsets.zero,
),
);
}