beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Improve SearchSectionCTAIcon widget and add it at the end of each search section's scrollable

Browse source
This commit is contained in:
ashilkn 2023-10-07 13:52:56 +05:30
parent 94b0256fc5
commit 1941d6d6fa
3 changed files with 56 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
lib/ui/search_tab.dart
View file

@ -86,6 +86,7 @@ class _AllSearchSectionsState extends State<AllSearchSections> {
},
);
} else if (snapshot.hasError) {
//todo: Show something went wrong here
return const EnteLoadingWidget();
} else {
return const EnteLoadingWidget();

50
lib/ui/viewer/search/search_section.dart
View file

@ -22,42 +22,34 @@ class SearchSection extends StatelessWidget {
final textTheme = getEnteTextTheme(context);
return Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
sectionType.sectionTitle(context),
style: textTheme.largeBold,
),
const SizedBox(height: 16),
// wrap below text in next line
// Text(
// sectionType.getEmptyStateText(context),
// style: textTheme.smallMuted,
// softWrap: true,
// ),
SearchExampleRow(examples),
],
child: Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
sectionType.sectionTitle(context),
style: textTheme.largeBold,
),
),
SizedBox(
width: 85,
child: SearchSectionCTAIcon(sectionType),
),
],
const SizedBox(height: 16),
// wrap below text in next line
// Text(
// sectionType.getEmptyStateText(context),
// style: textTheme.smallMuted,
// softWrap: true,
// ),
SearchExampleRow(examples, sectionType),
],
),
),
);
}
}
class SearchExampleRow extends StatelessWidget {
final SectionType sectionType;
final List<SearchResult> reccomendations;
const SearchExampleRow(this.reccomendations, {super.key});
const SearchExampleRow(this.reccomendations, this.sectionType, {super.key});
@override
Widget build(BuildContext context) {
@ -70,10 +62,12 @@ class SearchExampleRow extends StatelessWidget {
),
);
});
scrollableExamples.add(SearchSectionCTAIcon(sectionType));
return SizedBox(
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: scrollableExamples,
),
),
@ -106,7 +100,7 @@ class SearchExample extends StatelessWidget {
height: 10,
),
Text(
"Title is spread on max 2 lines",
searchResult.name(),
maxLines: 2,
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,

56
lib/ui/viewer/search/search_section_cta.dart
View file

@ -1,3 +1,4 @@
import "package:dotted_border/dotted_border.dart";
import "package:flutter/material.dart";
import "package:photos/models/search/search_types.dart";
import "package:photos/theme/ente_theme.dart";
@ -14,33 +15,42 @@ class SearchSectionCTAIcon extends StatelessWidget {
}
final textTheme = getEnteTextTheme(context);
final colorScheme = getEnteColorScheme(context);
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: 48,
height: 48,
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(32),
border: Border.all(
color: colorScheme.strokeFaint,
width: 1,
return SizedBox(
width: 84,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 8),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
DottedBorder(
color: colorScheme.strokeFaint,
dashPattern: const [3.9, 3.9],
borderType: BorderType.Circle,
strokeWidth: 1.5,
radius: const Radius.circular(30.5),
child: SizedBox(
width: 61,
height: 61,
child: Icon(
sectionType.getCTAIcon() ?? Icons.add,
color: colorScheme.strokeFaint,
size: 20,
),
),
),
child: Icon(
sectionType.getCTAIcon() ?? Icons.add,
color: colorScheme.strokeFaint,
size: 20,
const SizedBox(
height: 10,
),
),
Text(
sectionType.getCTAText(context),
maxLines: 2,
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,
style: textTheme.miniFaint,
),
],
),
const SizedBox(height: 10),
Text(
sectionType.getCTAText(context),
style: textTheme.miniFaint,
),
],
),
);
}
}