helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-14 17:36:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

feat(mobile): Home screen customization options (#1563)

Browse source 
* Try staggered layout for home page

* Introduce setting for dynamic layout

* Fix some provider related bugs

* Make asset grouping configurable

* Add translation keys, refactor group title

* Rename enum values

* Fix enum names

* Reformat long if statement

* Fix timezone related bug

* Minor clean up

* Fix unit test

* Add second assets check back to home screen
This commit is contained in:
Matthias Rupp 2023-02-09 18:35:44 +01:00 • committed by GitHub
parent 911c35a7f1
commit fd13265131
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 298 additions and 125 deletions
Download patch file Download diff file Expand all files Collapse all files

2
mobile/lib/modules/settings/services/app_settings.service.dart
View file

@ -6,6 +6,8 @@ enum AppSettingsEnum<T> {
loadOriginal<bool>("loadOriginal", false),
themeMode<String>("themeMode", "system"), // "light","dark","system"
tilesPerRow<int>("tilesPerRow", 4),
dynamicLayout<bool>("dynamicLayout", false),
groupAssetsBy<int>("groupBy", 0),
uploadErrorNotificationGracePeriod<int>(
"uploadErrorNotificationGracePeriod",
2,

99
mobile/lib/modules/settings/ui/asset_list_settings/asset_list_layout_settings.dart Normal file
View file

@ -0,0 +1,99 @@
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/modules/home/ui/asset_grid/asset_grid_data_structure.dart';
import 'package:immich_mobile/modules/settings/providers/app_settings.provider.dart';
import 'package:immich_mobile/modules/settings/services/app_settings.service.dart';
import 'package:immich_mobile/shared/providers/asset.provider.dart';
class LayoutSettings extends HookConsumerWidget {
const LayoutSettings({
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
final appSettingService = ref.watch(appSettingsServiceProvider);
final useDynamicLayout = useState(true);
final groupBy = useState(GroupAssetsBy.day);
void switchChanged(bool value) {
appSettingService.setSetting(AppSettingsEnum.dynamicLayout, value);
useDynamicLayout.value = value;
ref.watch(assetProvider.notifier).rebuildAssetGridDataStructure();
}
void changeGroupValue(GroupAssetsBy? value) {
if (value != null) {
appSettingService.setSetting(AppSettingsEnum.groupAssetsBy, value.index);
groupBy.value = value;
ref.watch(assetProvider.notifier).rebuildAssetGridDataStructure();
}
}
useEffect(
() {
useDynamicLayout.value =
appSettingService.getSetting<bool>(AppSettingsEnum.dynamicLayout);
groupBy.value =
GroupAssetsBy.values[appSettingService.getSetting<int>(AppSettingsEnum.groupAssetsBy)];
return null;
},
[],
);
return Column(
children: [
SwitchListTile.adaptive(
activeColor: Theme.of(context).primaryColor,
title: const Text(
"asset_list_layout_settings_dynamic_layout_title",
style: TextStyle(
fontSize: 12,
),
).tr(),
onChanged: switchChanged,
value: useDynamicLayout.value,
),
ListTile(
title: const Text(
"asset_list_layout_settings_group_by",
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.bold,
),
).tr(),
),
RadioListTile(
activeColor: Theme.of(context).primaryColor,
title: const Text(
"asset_list_layout_settings_group_by_month_day",
style: TextStyle(
fontSize: 12,
),
).tr(),
value: GroupAssetsBy.day,
groupValue: groupBy.value,
onChanged: changeGroupValue,
controlAffinity: ListTileControlAffinity.trailing,
),
RadioListTile(
activeColor: Theme.of(context).primaryColor,
title: const Text(
"asset_list_layout_settings_group_by_month",
style: TextStyle(
fontSize: 12,
),
).tr(),
value: GroupAssetsBy.month,
groupValue: groupBy.value,
onChanged: changeGroupValue,
controlAffinity: ListTileControlAffinity.trailing,
),
],
);
}
}

2
mobile/lib/modules/settings/ui/asset_list_settings/asset_list_settings.dart
View file

@ -1,5 +1,6 @@
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:immich_mobile/modules/settings/ui/asset_list_settings/asset_list_layout_settings.dart';
import 'package:immich_mobile/modules/settings/ui/asset_list_settings/asset_list_storage_indicator.dart';
import 'asset_list_tiles_per_row.dart';
@ -27,6 +28,7 @@ class AssetListSettings extends StatelessWidget {
children: const [
TilesPerRow(),
StorageIndicator(),
LayoutSettings(),
],
);
}

3
mobile/lib/modules/settings/ui/asset_list_settings/asset_list_storage_indicator.dart
View file

@ -20,8 +20,7 @@ class StorageIndicator extends HookConsumerWidget {
void switchChanged(bool value) {
appSettingService.setSetting(AppSettingsEnum.storageIndicator, value);
showStorageIndicator.value = value;
ref.invalidate(assetProvider);
ref.watch(assetProvider.notifier).rebuildAssetGridDataStructure();
}
useEffect(

3
mobile/lib/modules/settings/ui/asset_list_settings/asset_list_tiles_per_row.dart
View file

@ -23,8 +23,7 @@ class TilesPerRow extends HookConsumerWidget {
}
void sliderChangedEnd(double _) {
ref.invalidate(assetProvider);
ref.watch(assetProvider.notifier).getAllAsset();
ref.watch(assetProvider.notifier).rebuildAssetGridDataStructure();
}
useEffect(