Replace zoom button with gesture in collection browser

This commit is contained in:
Ming Ming 2023-06-18 03:31:21 +08:00
parent d511158e27
commit ebd593e5be
10 changed files with 292 additions and 171 deletions

View file

@ -1,7 +1,7 @@
part of '../account_picker_dialog.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required DiContainer container,
required this.accountController,
@ -29,6 +29,12 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
super.onError(error, stackTrace);
}
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => null;
void _onToggleDropdown(_ToggleDropdown ev, Emitter<_State> emit) {
_log.info(ev);
emit(state.copyWith(isOpenDropdown: !state.isOpenDropdown));
@ -99,9 +105,6 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
}
}
@override
String get tag => _log.fullName;
final DiContainer _c;
final AccountController accountController;
late final Account activeAccount = accountController.account;

View file

@ -61,7 +61,6 @@ import 'package:nc_photos/widget/share_collection_dialog.dart';
import 'package:nc_photos/widget/shared_album_info_dialog.dart';
import 'package:nc_photos/widget/simple_input_dialog.dart';
import 'package:nc_photos/widget/viewer.dart';
import 'package:nc_photos/widget/zoom_menu_button.dart';
import 'package:np_codegen/np_codegen.dart';
import 'package:to_string/to_string.dart';
@ -106,6 +105,7 @@ class CollectionBrowser extends StatelessWidget {
create: (_) => _Bloc(
container: KiwiContainer().resolve(),
account: context.read<AccountController>().account,
prefController: context.read(),
collectionsController:
context.read<AccountController>().collectionsController,
collection: collection,
@ -238,52 +238,63 @@ class _WrappedCollectionBrowserState extends State<_WrappedCollectionBrowser>
children: [
Listener(
onPointerMove: (event) => _onPointerMove(context, event),
child: CustomScrollView(
controller: _scrollController,
slivers: [
_BlocBuilder(
buildWhen: (previous, current) =>
previous.selectedItems.isEmpty !=
current.selectedItems.isEmpty ||
previous.isEditMode != current.isEditMode,
builder: (context, state) {
if (state.isEditMode) {
return const _EditAppBar();
} else if (state.selectedItems.isNotEmpty) {
return const _SelectionAppBar();
} else {
return const _AppBar();
}
},
),
SliverToBoxAdapter(
child: _BlocBuilder(
child: GestureDetector(
onScaleStart: (_) {
_bloc.add(const _StartScaling());
},
onScaleUpdate: (details) {
_bloc.add(_SetScale(details.scale));
},
onScaleEnd: (_) {
_bloc.add(const _EndScaling());
},
child: CustomScrollView(
controller: _scrollController,
slivers: [
_BlocBuilder(
buildWhen: (previous, current) =>
previous.isLoading != current.isLoading,
builder: (context, state) => state.isLoading
? const LinearProgressIndicator()
: const SizedBox(height: 4),
),
),
_BlocBuilder(
buildWhen: (previous, current) =>
previous.isEditMode != current.isEditMode,
builder: (context, state) {
if (!state.isEditMode) {
return const _ContentList();
} else {
if (context
.read<_Bloc>()
.isCollectionCapabilityPermitted(
CollectionCapability.manualSort)) {
return const _EditContentList();
previous.selectedItems.isEmpty !=
current.selectedItems.isEmpty ||
previous.isEditMode != current.isEditMode,
builder: (context, state) {
if (state.isEditMode) {
return const _EditAppBar();
} else if (state.selectedItems.isNotEmpty) {
return const _SelectionAppBar();
} else {
return const _UnmodifiableEditContentList();
return const _AppBar();
}
}
},
),
],
},
),
SliverToBoxAdapter(
child: _BlocBuilder(
buildWhen: (previous, current) =>
previous.isLoading != current.isLoading,
builder: (context, state) => state.isLoading
? const LinearProgressIndicator()
: const SizedBox(height: 4),
),
),
_BlocBuilder(
buildWhen: (previous, current) =>
previous.isEditMode != current.isEditMode,
builder: (context, state) {
if (!state.isEditMode) {
return const _ContentList();
} else {
if (context
.read<_Bloc>()
.isCollectionCapabilityPermitted(
CollectionCapability.manualSort)) {
return const _EditContentList();
} else {
return const _UnmodifiableEditContentList();
}
}
},
),
],
),
),
),
_BlocBuilder(
@ -372,65 +383,69 @@ class _ContentList extends StatelessWidget {
@override
Widget build(BuildContext context) {
final bloc = context.read<_Bloc>();
return StreamBuilder<int>(
stream: context.read<PrefController>().albumBrowserZoomLevel,
initialData: context.read<PrefController>().albumBrowserZoomLevel.value,
builder: (_, zoomLevel) {
if (zoomLevel.hasError) {
bloc.add(
_SetMessage(L10n.global().writePreferenceFailureNotification));
}
return _BlocBuilder(
buildWhen: (previous, current) =>
previous.collection != current.collection ||
previous.transformedItems != current.transformedItems ||
previous.selectedItems != current.selectedItems,
builder: (context, state) {
return SelectableItemList<_Item>(
maxCrossAxisExtent: photo_list_util
.getThumbSize(zoomLevel.requireData)
.toDouble(),
items: state.transformedItems,
itemBuilder: (context, _, item) => item.buildWidget(context),
staggeredTileBuilder: (_, item) => item.staggeredTile,
selectedItems: state.selectedItems,
onSelectionChange: (_, selected) {
bloc.add(_SetSelectedItems(items: selected.cast()));
},
onItemTap: (context, index, _) {
final actualIndex = index -
state.transformedItems
.sublist(0, index)
.where((e) => e is! _ActualItem)
.length;
Navigator.of(context).pushNamed(
Viewer.routeName,
arguments: ViewerArguments(
bloc.account,
state.transformedItems
.whereType<_FileItem>()
.map((e) => e.file)
.toList(),
actualIndex,
fromCollection: ViewerCollectionData(
state.collection,
state.transformedItems
.whereType<_ActualItem>()
.map((e) => e.original)
.toList(),
),
),
);
},
);
},
);
},
return _BlocBuilder(
buildWhen: (previous, current) => previous.zoom != current.zoom,
builder: (context, state) => _ContentListBody(
maxCrossAxisExtent: photo_list_util.getThumbSize(state.zoom).toDouble(),
),
);
}
}
class _ContentListBody extends StatelessWidget {
const _ContentListBody({
required this.maxCrossAxisExtent,
});
@override
Widget build(BuildContext context) {
final bloc = context.read<_Bloc>();
return _BlocBuilder(
buildWhen: (previous, current) =>
previous.collection != current.collection ||
previous.transformedItems != current.transformedItems ||
previous.selectedItems != current.selectedItems,
builder: (context, state) => SelectableItemList<_Item>(
maxCrossAxisExtent: maxCrossAxisExtent,
items: state.transformedItems,
itemBuilder: (context, _, item) => item.buildWidget(context),
staggeredTileBuilder: (_, item) => item.staggeredTile,
selectedItems: state.selectedItems,
onSelectionChange: (_, selected) {
bloc.add(_SetSelectedItems(items: selected.cast()));
},
onItemTap: (context, index, _) {
final actualIndex = index -
state.transformedItems
.sublist(0, index)
.where((e) => e is! _ActualItem)
.length;
Navigator.of(context).pushNamed(
Viewer.routeName,
arguments: ViewerArguments(
bloc.account,
state.transformedItems
.whereType<_FileItem>()
.map((e) => e.file)
.toList(),
actualIndex,
fromCollection: ViewerCollectionData(
state.collection,
state.transformedItems
.whereType<_ActualItem>()
.map((e) => e.original)
.toList(),
),
),
);
},
),
);
}
final double maxCrossAxisExtent;
}
class _EditContentList extends StatelessWidget {
const _EditContentList();

View file

@ -29,6 +29,8 @@ abstract class $_StateCopyWithWorker {
List<_Item>? editTransformedItems,
CollectionItemSort? editSort,
bool? isDragging,
int? zoom,
double? scale,
Collection? importResult,
ExceptionEvent? error,
String? message});
@ -54,6 +56,8 @@ class _$_StateCopyWithWorkerImpl implements $_StateCopyWithWorker {
dynamic editTransformedItems = copyWithNull,
dynamic editSort = copyWithNull,
dynamic isDragging,
dynamic zoom,
dynamic scale = copyWithNull,
dynamic importResult = copyWithNull,
dynamic error = copyWithNull,
dynamic message = copyWithNull}) {
@ -84,6 +88,8 @@ class _$_StateCopyWithWorkerImpl implements $_StateCopyWithWorker {
? that.editSort
: editSort as CollectionItemSort?,
isDragging: isDragging as bool? ?? that.isDragging,
zoom: zoom as int? ?? that.zoom,
scale: scale == copyWithNull ? that.scale : scale as double?,
importResult: importResult == copyWithNull
? that.importResult
: importResult as Collection?,
@ -133,7 +139,7 @@ extension _$_BlocNpLog on _Bloc {
extension _$_StateToString on _State {
String _$toString() {
// ignore: unnecessary_string_interpolations
return "_State {collection: $collection, coverUrl: $coverUrl, items: [length: ${items.length}], isLoading: $isLoading, transformedItems: [length: ${transformedItems.length}], selectedItems: $selectedItems, isSelectionRemovable: $isSelectionRemovable, isSelectionManageableFile: $isSelectionManageableFile, isEditMode: $isEditMode, isEditBusy: $isEditBusy, editName: $editName, editItems: ${editItems == null ? null : "[length: ${editItems!.length}]"}, editTransformedItems: ${editTransformedItems == null ? null : "[length: ${editTransformedItems!.length}]"}, editSort: ${editSort == null ? null : "${editSort!.name}"}, isDragging: $isDragging, importResult: $importResult, error: $error, message: $message}";
return "_State {collection: $collection, coverUrl: $coverUrl, items: [length: ${items.length}], isLoading: $isLoading, transformedItems: [length: ${transformedItems.length}], selectedItems: $selectedItems, isSelectionRemovable: $isSelectionRemovable, isSelectionManageableFile: $isSelectionManageableFile, isEditMode: $isEditMode, isEditBusy: $isEditBusy, editName: $editName, editItems: ${editItems == null ? null : "[length: ${editItems!.length}]"}, editTransformedItems: ${editTransformedItems == null ? null : "[length: ${editTransformedItems!.length}]"}, editSort: ${editSort == null ? null : "${editSort!.name}"}, isDragging: $isDragging, zoom: $zoom, scale: ${scale == null ? null : "${scale!.toStringAsFixed(3)}"}, importResult: $importResult, error: $error, message: $message}";
}
}
@ -294,6 +300,27 @@ extension _$_SetDraggingToString on _SetDragging {
}
}
extension _$_StartScalingToString on _StartScaling {
String _$toString() {
// ignore: unnecessary_string_interpolations
return "_StartScaling {}";
}
}
extension _$_EndScalingToString on _EndScaling {
String _$toString() {
// ignore: unnecessary_string_interpolations
return "_EndScaling {}";
}
}
extension _$_SetScaleToString on _SetScale {
String _$toString() {
// ignore: unnecessary_string_interpolations
return "_SetScale {scale: ${scale.toStringAsFixed(3)}}";
}
}
extension _$_SetErrorToString on _SetError {
String _$toString() {
// ignore: unnecessary_string_interpolations

View file

@ -18,64 +18,6 @@ class _AppBar extends StatelessWidget {
adapter.isPermitted(CollectionCapability.manualCover);
final canShare = adapter.isPermitted(CollectionCapability.share);
final actions = <Widget>[
ZoomMenuButton(
initialZoom: 0,
minZoom: 0,
maxZoom: 2,
onZoomChanged: (value) {
context.read<PrefController>().setAlbumBrowserZoomLevel(value);
},
),
if (canShare)
IconButton(
onPressed: () => _onSharePressed(context),
icon: const Icon(Icons.share),
tooltip: L10n.global().shareTooltip,
),
if (state.collection.isPendingSharedAlbum)
IconButton(
onPressed: () => _onAddToCollectionsViewPressed(context),
icon: const AssetIcon(asset.icAddCollectionsOutlined24),
tooltip: L10n.global().addToCollectionsViewTooltip,
),
];
if (state.items.isNotEmpty || canRename) {
actions.add(PopupMenuButton<_MenuOption>(
tooltip: MaterialLocalizations.of(context).moreButtonTooltip,
itemBuilder: (_) => [
if (canRename)
PopupMenuItem(
value: _MenuOption.edit,
child: Text(L10n.global().editTooltip),
),
if (canManualCover && adapter.isManualCover())
PopupMenuItem(
value: _MenuOption.unsetCover,
child: Text(L10n.global().unsetAlbumCoverTooltip),
),
if (state.items.isNotEmpty) ...[
PopupMenuItem(
value: _MenuOption.download,
child: Text(L10n.global().downloadTooltip),
),
PopupMenuItem(
value: _MenuOption.export,
child: Text(L10n.global().exportCollectionTooltip),
),
],
if (state.collection.contentProvider is CollectionAlbumProvider)
PopupMenuItem(
value: _MenuOption.albumFixShare,
child: Text(L10n.global().fixSharesTooltip),
),
],
onSelected: (option) {
_onMenuSelected(context, option);
},
));
}
return SliverAppBar(
floating: true,
expandedHeight: 160,
@ -88,7 +30,55 @@ class _AppBar extends StatelessWidget {
),
),
),
actions: actions,
actions: [
if (canShare)
IconButton(
onPressed: () => _onSharePressed(context),
icon: const Icon(Icons.share),
tooltip: L10n.global().shareTooltip,
),
if (state.collection.isPendingSharedAlbum)
IconButton(
onPressed: () => _onAddToCollectionsViewPressed(context),
icon: const AssetIcon(asset.icAddCollectionsOutlined24),
tooltip: L10n.global().addToCollectionsViewTooltip,
),
if (state.items.isNotEmpty || canRename)
PopupMenuButton<_MenuOption>(
tooltip: MaterialLocalizations.of(context).moreButtonTooltip,
itemBuilder: (_) => [
if (canRename)
PopupMenuItem(
value: _MenuOption.edit,
child: Text(L10n.global().editTooltip),
),
if (canManualCover && adapter.isManualCover())
PopupMenuItem(
value: _MenuOption.unsetCover,
child: Text(L10n.global().unsetAlbumCoverTooltip),
),
if (state.items.isNotEmpty) ...[
PopupMenuItem(
value: _MenuOption.download,
child: Text(L10n.global().downloadTooltip),
),
PopupMenuItem(
value: _MenuOption.export,
child: Text(L10n.global().exportCollectionTooltip),
),
],
if (state.collection.contentProvider
is CollectionAlbumProvider)
PopupMenuItem(
value: _MenuOption.albumFixShare,
child: Text(L10n.global().fixSharesTooltip),
),
],
onSelected: (option) {
_onMenuSelected(context, option);
},
),
],
);
},
);

View file

@ -1,10 +1,11 @@
part of '../collection_browser.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required DiContainer container,
required this.account,
required this.prefController,
required this.collectionsController,
required Collection collection,
}) : _c = container,
@ -13,6 +14,7 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
super(_State.init(
collection: collection,
coverUrl: _getCoverUrl(collection),
zoom: prefController.albumBrowserZoomLevel.value,
)) {
_initItemController(collection);
@ -45,6 +47,10 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
on<_SetDragging>(_onSetDragging);
on<_StartScaling>(_onStartScaling);
on<_EndScaling>(_onEndScaling);
on<_SetScale>(_onSetScale);
on<_SetError>(_onSetError);
on<_SetMessage>(_onSetMessage);
@ -75,6 +81,14 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
return super.close();
}
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => (currentState, nextState) {
return currentState.scale == nextState.scale;
};
@override
void onError(Object error, StackTrace stackTrace) {
// we need this to prevent onError being triggered recursively
@ -93,9 +107,6 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
.isPermitted(capability);
}
@override
String get tag => _log.fullName;
void _onUpdateCollection(_UpdateCollection ev, Emitter<_State> emit) {
_log.info("$ev");
emit(state.copyWith(collection: ev.collection));
@ -345,6 +356,35 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
emit(state.copyWith(isDragging: ev.flag));
}
void _onStartScaling(_StartScaling ev, Emitter<_State> emit) {
_log.info(ev);
}
void _onEndScaling(_EndScaling ev, Emitter<_State> emit) {
_log.info(ev);
if (state.scale == null) {
return;
}
final int newZoom;
if (state.scale! >= 1.25) {
// scale up
newZoom = (state.zoom + 1).clamp(-1, 2);
} else if (state.scale! <= 0.75) {
newZoom = (state.zoom - 1).clamp(-1, 2);
} else {
newZoom = state.zoom;
}
emit(state.copyWith(
zoom: newZoom,
scale: null,
));
unawaited(prefController.setAlbumBrowserZoomLevel(newZoom));
}
void _onSetScale(_SetScale ev, Emitter<_State> emit) {
emit(state.copyWith(scale: ev.scale));
}
void _onSetError(_SetError ev, Emitter<_State> emit) {
_log.info("$ev");
emit(state.copyWith(error: ExceptionEvent(ev.error, ev.stackTrace)));
@ -475,6 +515,7 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
final DiContainer _c;
final Account account;
final PrefController prefController;
final CollectionsController collectionsController;
late final CollectionItemsController itemsController;

View file

@ -19,6 +19,8 @@ class _State {
this.editTransformedItems,
this.editSort,
required this.isDragging,
required this.zoom,
this.scale,
this.importResult,
this.error,
this.message,
@ -27,6 +29,7 @@ class _State {
factory _State.init({
required Collection collection,
required String? coverUrl,
required int zoom,
}) {
return _State(
collection: collection,
@ -40,6 +43,7 @@ class _State {
isEditMode: false,
isEditBusy: false,
isDragging: false,
zoom: zoom,
);
}
@ -67,6 +71,9 @@ class _State {
final bool isDragging;
final int zoom;
final double? scale;
final Collection? importResult;
final ExceptionEvent? error;
@ -284,6 +291,32 @@ class _SetDragging implements _Event {
final bool flag;
}
@toString
class _StartScaling implements _Event {
const _StartScaling();
@override
String toString() => _$toString();
}
@toString
class _EndScaling implements _Event {
const _EndScaling();
@override
String toString() => _$toString();
}
@toString
class _SetScale implements _Event {
const _SetScale(this.scale);
@override
String toString() => _$toString();
final double scale;
}
@toString
class _SetError implements _Event {
const _SetError(this.error, [this.stackTrace]);

View file

@ -1,7 +1,7 @@
part of '../collection_picker.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required this.account,
required this.controller,
@ -16,6 +16,9 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => null;
@override
void onError(Object error, StackTrace stackTrace) {
// we need this to prevent onError being triggered recursively

View file

@ -1,7 +1,7 @@
part of '../file_sharer_dialog.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required DiContainer container,
required this.account,
@ -19,6 +19,9 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => null;
@override
void onError(Object error, StackTrace stackTrace) {
// we need this to prevent onError being triggered recursively

View file

@ -1,7 +1,7 @@
part of '../home_collections.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required this.account,
required this.controller,
@ -34,6 +34,9 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => null;
@override
void onError(Object error, StackTrace stackTrace) {
// we need this to prevent onError being triggered recursively

View file

@ -1,7 +1,7 @@
part of '../language_settings.dart';
@npLog
class _Bloc extends Bloc<_Event, _State> implements BlocTag {
class _Bloc extends Bloc<_Event, _State> implements BlocLogger {
_Bloc({
required this.prefController,
}) : super(_State.init(
@ -15,6 +15,9 @@ class _Bloc extends Bloc<_Event, _State> implements BlocTag {
@override
String get tag => _log.fullName;
@override
bool Function(dynamic, dynamic)? get shouldLog => null;
@override
void onError(Object error, StackTrace stackTrace) {
// we need this to prevent onError being triggered recursively