[mob][photos] Fade the left edge of applied filters in appbar so that the filters fade away to the left when scrolling

This commit is contained in:
ashilkn
2024-10-23 18:06:09 +05:30
parent b7f23a74c3
commit 9983689c74

View File

@@ -1,6 +1,7 @@
import "package:flutter/material.dart";
import "package:photos/models/search/hierarchical/face_filter.dart";
import "package:photos/models/search/hierarchical/hierarchical_search_filter.dart";
import "package:photos/theme/ente_theme.dart";
import "package:photos/ui/viewer/gallery/state/inherited_search_filter_data.dart";
import "package:photos/ui/viewer/gallery/state/search_filter_data_provider.dart";
import "package:photos/ui/viewer/hierarchicial_search/filter_chip.dart";
@@ -49,41 +50,61 @@ class _AppliedFiltersState extends State<AppliedFilters> {
@override
Widget build(BuildContext context) {
return ListView.builder(
itemBuilder: (context, index) {
final filter = _appliedFilters[index];
return Padding(
return Stack(
alignment: Alignment.centerLeft,
children: [
ListView.builder(
itemBuilder: (context, index) {
final filter = _appliedFilters[index];
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 4),
child: filter is FaceFilter
? FaceFilterChip(
personId: filter.personId,
clusterId: filter.clusterId,
faceThumbnailFile: filter.faceFile,
name: filter.name(),
apply: () {
_searchFilterDataProvider.applyFilters([filter]);
},
remove: () {
_searchFilterDataProvider
.removeAppliedFilters([filter]);
},
isApplied: filter.isApplied,
)
: GenericFilterChip(
label: filter.name(),
apply: () {
_searchFilterDataProvider.applyFilters([filter]);
},
remove: () {
_searchFilterDataProvider
.removeAppliedFilters([filter]);
},
leadingIcon: filter.icon(),
isApplied: filter.isApplied,
),
);
},
scrollDirection: Axis.horizontal,
itemCount: _appliedFilters.length,
padding: const EdgeInsets.symmetric(horizontal: 4),
child: filter is FaceFilter
? FaceFilterChip(
personId: filter.personId,
clusterId: filter.clusterId,
faceThumbnailFile: filter.faceFile,
name: filter.name(),
apply: () {
_searchFilterDataProvider.applyFilters([filter]);
},
remove: () {
_searchFilterDataProvider.removeAppliedFilters([filter]);
},
isApplied: filter.isApplied,
)
: GenericFilterChip(
label: filter.name(),
apply: () {
_searchFilterDataProvider.applyFilters([filter]);
},
remove: () {
_searchFilterDataProvider.removeAppliedFilters([filter]);
},
leadingIcon: filter.icon(),
isApplied: filter.isApplied,
),
);
},
scrollDirection: Axis.horizontal,
itemCount: _appliedFilters.length,
padding: const EdgeInsets.symmetric(horizontal: 4),
),
Container(
width: 12,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
getEnteColorScheme(context).backdropBase,
getEnteColorScheme(context).backdropBase.withOpacity(0),
],
begin: Alignment.centerLeft,
end: Alignment.centerRight,
),
),
),
],
);
}