Skip to content

Commit 6e444d2

Browse files
nsh07nsh07
committed
feat: Search suggestions now morph to a circular shape when clicked
1 parent 5f58e5f commit 6e444d2

File tree

3 files changed

+349
-166
lines changed

3 files changed

+349
-166
lines changed

‎app/src/main/java/org/nsh07/wikireader/ui/AppScreen.kt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ import org.nsh07.wikireader.data.UserLanguage
8585
import org.nsh07.wikireader.ui.aboutScreen.AboutScreen
8686
import org.nsh07.wikireader.ui.historyScreen.HistoryScreenRoot
8787
import org.nsh07.wikireader.ui.homeScreen.AppHomeScreen
88-
import org.nsh07.wikireader.ui.homeScreen.AppSearchBar
88+
import org.nsh07.wikireader.ui.homeScreen.search.AppSearchBar
8989
import org.nsh07.wikireader.ui.homeScreen.viewModel.HomeAction
9090
import org.nsh07.wikireader.ui.homeScreen.viewModel.HomeScreenViewModel
9191
import org.nsh07.wikireader.ui.homeScreen.viewModel.HomeSubscreen

‎app/src/main/java/org/nsh07/wikireader/ui/homeScreen/AppSearchBar.kt‎ renamed to ‎app/src/main/java/org/nsh07/wikireader/ui/homeScreen/search/AppSearchBar.kt‎

Lines changed: 38 additions & 165 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
package org.nsh07.wikireader.ui.homeScreen
1+
package org.nsh07.wikireader.ui.homeScreen.search
22

33
import android.os.Build
44
import androidx.activity.compose.BackHandler
@@ -26,7 +26,6 @@ import androidx.compose.foundation.layout.padding
2626
import androidx.compose.foundation.layout.size
2727
import androidx.compose.foundation.layout.systemBars
2828
import androidx.compose.foundation.layout.width
29-
import androidx.compose.foundation.layout.wrapContentSize
3029
import androidx.compose.foundation.lazy.LazyColumn
3130
import androidx.compose.foundation.lazy.LazyListState
3231
import androidx.compose.foundation.lazy.grid.GridCells
@@ -103,9 +102,6 @@ import org.nsh07.wikireader.ui.image.FeedImage
103102
import org.nsh07.wikireader.ui.settingsScreen.LanguageBottomSheet
104103
import org.nsh07.wikireader.ui.settingsScreen.viewModel.PreferencesState
105104
import org.nsh07.wikireader.ui.settingsScreen.viewModel.SettingsAction
106-
import org.nsh07.wikireader.ui.theme.WRShapeDefaults.bottomListItemShape
107-
import org.nsh07.wikireader.ui.theme.WRShapeDefaults.middleListItemShape
108-
import org.nsh07.wikireader.ui.theme.WRShapeDefaults.topListItemShape
109105

110106
@OptIn(
111107
ExperimentalMaterial3Api::class,
@@ -166,7 +162,10 @@ fun AppSearchBar(
166162
SearchBarDefaults.InputField(
167163
textFieldState = textFieldState,
168164
searchBarState = searchBarState,
169-
onSearch = { onAction(HomeAction.LoadSearch(it)) },
165+
onSearch = {
166+
onSearchBarExpandedChange(false)
167+
onAction(HomeAction.LoadSearch(it))
168+
},
170169
placeholder = {
171170
val alignment by animateHorizontalAlignmentAsState(
172171
if (searchBarState.targetValue == SearchBarValue.Expanded) -1f else 0f,
@@ -249,8 +248,10 @@ fun AppSearchBar(
249248
IconButton(
250249
shapes = IconButtonDefaults.shapes(),
251250
onClick = {
252-
if (searchBarState.currentValue == SearchBarValue.Expanded)
251+
if (searchBarState.currentValue == SearchBarValue.Expanded) {
252+
onSearchBarExpandedChange(false)
253253
onAction(HomeAction.LoadSearch(textFieldState.text.toString()))
254+
}
254255
else
255256
focusRequester.requestFocus()
256257
}
@@ -350,56 +351,18 @@ fun AppSearchBar(
350351
}
351352
}
352353
items(size, key = { searchHistory[it].time }) {
353-
val currentText = searchHistory[it].query
354-
ListItem(
355-
leadingContent = {
356-
Icon(
357-
painterResource(R.drawable.history),
358-
contentDescription = null
359-
)
360-
},
361-
headlineContent = {
362-
Text(
363-
currentText,
364-
softWrap = false,
365-
overflow = TextOverflow.Ellipsis
366-
)
367-
},
368-
trailingContent = {
369-
IconButton(
370-
shapes = IconButtonDefaults.shapes(),
371-
onClick = { onAction(HomeAction.SetQuery(currentText)) },
372-
modifier = Modifier.wrapContentSize()
373-
) {
374-
Icon(
375-
painterResource(R.drawable.north_west),
376-
contentDescription = null
377-
)
378-
}
379-
},
380-
modifier = Modifier
381-
.padding(horizontal = 16.dp)
382-
.clip(
383-
if (size == 1) shapes.large
384-
else if (it == 0) topListItemShape
385-
else if (it == size - 1) bottomListItemShape
386-
else middleListItemShape
387-
)
388-
.combinedClickable(
389-
onClick = {
390-
onAction(HomeAction.LoadSearch(currentText))
391-
textFieldState.setTextAndPlaceCursorAtEnd(
392-
currentText
393-
)
394-
},
395-
onLongClick = {
396-
haptic.performHapticFeedback(
397-
HapticFeedbackType.LongPress
398-
)
399-
removeHistoryItem(searchHistory[it])
400-
}
401-
)
402-
.animateItem()
354+
SearchHistoryListItem(
355+
index = it,
356+
items = size,
357+
currentItem = searchHistory[it],
358+
haptic = haptic,
359+
onAction = onAction,
360+
removeHistoryItem = removeHistoryItem,
361+
onClick = {
362+
textFieldState.setTextAndPlaceCursorAtEnd(searchHistory[it].query)
363+
onSearchBarExpandedChange(false)
364+
onAction(HomeAction.LoadSearch(searchHistory[it].query))
365+
}
403366
)
404367
}
405368
item {
@@ -708,54 +671,15 @@ fun AppSearchBar(
708671
appSearchBarState.prefixSearchResults ?: emptyList(),
709672
key = { index: Int, it: WikiPrefixSearchResult -> "${it.title}-prefix" }
710673
) { index: Int, it: WikiPrefixSearchResult ->
711-
ListItem(
712-
headlineContent = {
713-
Text(
714-
it.title,
715-
softWrap = false,
716-
overflow = TextOverflow.Ellipsis
717-
)
718-
},
719-
supportingContent = if (it.terms != null) {
720-
{
721-
Text(
722-
it.terms.description[0],
723-
softWrap = true,
724-
maxLines = 2,
725-
overflow = TextOverflow.Ellipsis
726-
)
727-
}
728-
} else null,
729-
trailingContent = {
730-
if (it.thumbnail != null && !preferencesState.dataSaver)
731-
FeedImage(
732-
source = it.thumbnail.source,
733-
imageLoader = imageLoader,
734-
contentScale = ContentScale.Crop,
735-
loadingIndicator = true,
736-
background = preferencesState.imageBackground,
737-
modifier = Modifier
738-
.padding(vertical = 4.dp)
739-
.size(56.dp)
740-
.clip(shapes.large)
741-
)
742-
else null
743-
},
744-
modifier = Modifier
745-
.padding(horizontal = 16.dp)
746-
.clip(
747-
if (appSearchBarState.prefixSearchResults?.size == 1) shapes.large
748-
else if (index == 0) topListItemShape
749-
else if (index == appSearchBarState.prefixSearchResults?.lastIndex) bottomListItemShape
750-
else middleListItemShape
751-
)
752-
.clickable(
753-
onClick = {
754-
onSearchBarExpandedChange(false)
755-
onAction(HomeAction.LoadPage(it.title))
756-
}
757-
)
758-
.animateItem()
674+
PrefixSearchResultListItem(
675+
item = it,
676+
dataSaver = preferencesState.dataSaver,
677+
imageBackground = preferencesState.imageBackground,
678+
imageLoader = imageLoader,
679+
onSearchBarExpandedChange = onSearchBarExpandedChange,
680+
onAction = onAction,
681+
items = appSearchBarState.prefixSearchResults?.size ?: 0,
682+
index = index
759683
)
760684
}
761685
item {
@@ -772,66 +696,15 @@ fun AppSearchBar(
772696
appSearchBarState.searchResults ?: emptyList(),
773697
key = { index: Int, it: WikiSearchResult -> "${it.title}-search" }
774698
) { index: Int, it: WikiSearchResult ->
775-
ListItem(
776-
overlineContent = if (it.redirectTitle != null) {
777-
{
778-
Text(
779-
stringResource(
780-
R.string.redirectedFrom,
781-
it.redirectTitle
782-
),
783-
maxLines = 1,
784-
overflow = TextOverflow.Ellipsis
785-
)
786-
}
787-
} else null,
788-
headlineContent = {
789-
Text(
790-
AnnotatedString.fromHtml(
791-
it.titleSnippet.ifEmpty { it.title }
792-
),
793-
softWrap = false,
794-
overflow = TextOverflow.Ellipsis
795-
)
796-
},
797-
supportingContent = {
798-
Text(
799-
AnnotatedString.fromHtml(it.snippet),
800-
softWrap = true,
801-
maxLines = 2,
802-
overflow = TextOverflow.Ellipsis
803-
)
804-
},
805-
trailingContent = {
806-
if (it.thumbnail != null && !preferencesState.dataSaver)
807-
FeedImage(
808-
source = it.thumbnail.source,
809-
imageLoader = imageLoader,
810-
contentScale = ContentScale.Crop,
811-
loadingIndicator = true,
812-
background = preferencesState.imageBackground,
813-
modifier = Modifier
814-
.padding(vertical = 4.dp)
815-
.size(56.dp)
816-
.clip(shapes.large)
817-
)
818-
else null
819-
},
820-
modifier = Modifier
821-
.padding(horizontal = 16.dp)
822-
.clip(
823-
if (appSearchBarState.searchResults?.size == 1) shapes.large
824-
else if (index == 0) topListItemShape
825-
else if (index == appSearchBarState.searchResults?.lastIndex) bottomListItemShape
826-
else middleListItemShape
827-
)
828-
.clickable(
829-
onClick = {
830-
onSearchBarExpandedChange(false)
831-
onAction(HomeAction.LoadPage(it.title))
832-
}
833-
)
834-
.animateItem()
699+
SearchResultListItem(
700+
it = it,
701+
index = index,
702+
items = appSearchBarState.searchResults?.size ?: 0,
703+
dataSaver = preferencesState.dataSaver,
704+
imageBackground = preferencesState.imageBackground,
705+
imageLoader = imageLoader,
706+
onSearchBarExpandedChange = onSearchBarExpandedChange,
707+
onAction = onAction
835708
)
836709
}
837710
item {

0 commit comments

Comments
 (0)