Close search suggestions when tapping outside the suggestion area

This commit is contained in:
Shawn 2022-12-08 19:08:59 -07:00
parent a4f2daffec
commit dbe051961d
2 changed files with 45 additions and 33 deletions

View File

@ -38,7 +38,7 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
@override @override
void initState() { void initState() {
_search(); _updateResults();
panelController.addListener(() { panelController.addListener(() {
AppHaptics.lightImpact(); AppHaptics.lightImpact();
}); });
@ -47,16 +47,18 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
void _handleSearchSubmitted(String query) { void _handleSearchSubmitted(String query) {
_query = query; _query = query;
_search(); _updateResults();
} }
void _handleTimelineChanged(double start, double end) { void _handleTimelineChanged(double start, double end) {
_startYear = start; _startYear = start;
_endYear = end; _endYear = end;
_filter(); _updateFilter();
} }
void _search() { void _handleResultPressed(SearchData o) => context.push(ScreenPaths.artifact(o.id.toString()));
void _updateResults() {
if (_query.isEmpty) { if (_query.isEmpty) {
_searchResults = wonder.searchData; _searchResults = wonder.searchData;
} else { } else {
@ -66,10 +68,10 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
_searchResults = wonder.searchData.where((o) => o.title.contains(q) || o.keywords.contains(q)).toList(); _searchResults = wonder.searchData.where((o) => o.title.contains(q) || o.keywords.contains(q)).toList();
} }
vizController.value = _searchResults; vizController.value = _searchResults;
_filter(); _updateFilter();
} }
void _filter() { void _updateFilter() {
_filteredResults = _searchResults.where((o) => o.year >= _startYear && o.year <= _endYear).toList(); _filteredResults = _searchResults.where((o) => o.year >= _startYear && o.year <= _endYear).toList();
setState(() {}); setState(() {});
} }
@ -79,7 +81,7 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
// tone down the orange just a bit: // tone down the orange just a bit:
vizController.color = Color.lerp($styles.colors.accent1, $styles.colors.black, 0.2)!; vizController.color = Color.lerp($styles.colors.accent1, $styles.colors.black, 0.2)!;
Widget content = GestureDetector( Widget content = GestureDetector(
onTap: () => WidgetsBinding.instance.focusManager.primaryFocus?.unfocus(), onTap: FocusManager.instance.primaryFocus?.unfocus,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
@ -101,7 +103,7 @@ class _ArtifactSearchScreenState extends State<ArtifactSearchScreen> with GetItS
? _buildEmptyIndicator(context) ? _buildEmptyIndicator(context)
: _ResultsGrid( : _ResultsGrid(
searchResults: _filteredResults, searchResults: _filteredResults,
onPressed: (o) => context.push(ScreenPaths.artifact(o.id.toString())), onPressed: _handleResultPressed,
), ),
), ),
), ),

View File

@ -34,36 +34,46 @@ class _SearchInput extends StatelessWidget {
Widget _buildSuggestionsView(BuildContext context, onSelected, Iterable<String> results, BoxConstraints constraints) { Widget _buildSuggestionsView(BuildContext context, onSelected, Iterable<String> results, BoxConstraints constraints) {
List<Widget> items = results.map((str) => _buildSuggestion(context, str, () => onSelected(str))).toList(); List<Widget> items = results.map((str) => _buildSuggestion(context, str, () => onSelected(str))).toList();
items.insert(0, _buildSuggestionTitle(context)); items.insert(0, _buildSuggestionTitle(context));
return Stack(
return TopLeft( children: [
child: Container( ExcludeSemantics(
margin: EdgeInsets.only(top: $styles.insets.xxs), child: AppBtn.basic(
width: constraints.maxWidth, onPressed: FocusManager.instance.primaryFocus!.unfocus,
decoration: BoxDecoration( semanticLabel: '',
boxShadow: [ child: SizedBox.expand(),
BoxShadow(
color: $styles.colors.black.withOpacity(0.25),
blurRadius: 4,
offset: Offset(0, 4),
),
],
),
child: Container(
padding: EdgeInsets.all($styles.insets.xs),
decoration: BoxDecoration(
color: $styles.colors.offWhite.withOpacity(0.92),
borderRadius: BorderRadius.circular($styles.insets.xs),
), ),
child: ConstrainedBox( ),
constraints: BoxConstraints(maxHeight: 200), TopLeft(
child: ListView( child: Container(
margin: EdgeInsets.only(top: $styles.insets.xxs),
width: constraints.maxWidth,
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: $styles.colors.black.withOpacity(0.25),
blurRadius: 4,
offset: Offset(0, 4),
),
],
),
child: Container(
padding: EdgeInsets.all($styles.insets.xs), padding: EdgeInsets.all($styles.insets.xs),
shrinkWrap: true, decoration: BoxDecoration(
children: items, color: $styles.colors.offWhite.withOpacity(0.92),
borderRadius: BorderRadius.circular($styles.insets.xs),
),
child: ConstrainedBox(
constraints: BoxConstraints(maxHeight: 200),
child: ListView(
padding: EdgeInsets.all($styles.insets.xs),
shrinkWrap: true,
children: items,
),
),
), ),
), ),
), ),
), ],
); );
} }