Skip to content

Commit

Permalink
support large screens
Browse files Browse the repository at this point in the history
  • Loading branch information
@mosayeb-a
mosayeb-a committed Dec 23, 2023
1 parent ed893c3 commit 4f0758b
Show file tree
Hide file tree
Showing 3 changed files with 144 additions and 57 deletions.
164 changes: 116 additions & 48 deletions app/src/main/java/me/ash/reader/ui/component/FilterBar.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import me.ash.reader.domain.model.general.Filter
import me.ash.reader.infrastructure.preference.FlowFilterBarStylePreference
import me.ash.reader.infrastructure.preference.LocalThemeIndex
import me.ash.reader.ui.ext.surfaceColorAtElevation
import me.ash.reader.ui.page.home.feeds.WindowInfo
import me.ash.reader.ui.page.home.feeds.rememberWindowInfo
import me.ash.reader.ui.theme.palette.onDark

@Composable
Expand All @@ -30,59 +32,125 @@ fun FilterBar(
val view = LocalView.current
val themeIndex = LocalThemeIndex.current

NavigationBar(
modifier = Modifier
.background(MaterialTheme.colorScheme.surfaceColorAtElevation(filterBarTonalElevation))
.navigationBarsPadding(),
tonalElevation = filterBarTonalElevation,
) {
Spacer(modifier = Modifier.width(filterBarPadding))
Filter.values.forEach { item ->
NavigationBarItem(
val windowInfo = rememberWindowInfo()


if (windowInfo.screenWidthInfo is WindowInfo.WindowType.Compat) {
NavigationBar(
modifier = Modifier
.background(
MaterialTheme.colorScheme.surfaceColorAtElevation(
filterBarTonalElevation
)
)
.navigationBarsPadding(),
tonalElevation = filterBarTonalElevation,
) {
Spacer(modifier = Modifier.width(filterBarPadding))
Filter.values.forEach { item ->
NavigationBarItem(
// modifier = Modifier.height(60.dp),
alwaysShowLabel = when (filterBarStyle) {
FlowFilterBarStylePreference.Icon.value -> false
FlowFilterBarStylePreference.IconLabel.value -> true
FlowFilterBarStylePreference.IconLabelOnlySelected.value -> false
else -> false
},
icon = {
Icon(
imageVector = if (filter == item && filterBarFilled) {
item.iconFilled
alwaysShowLabel = when (filterBarStyle) {
FlowFilterBarStylePreference.Icon.value -> false
FlowFilterBarStylePreference.IconLabel.value -> true
FlowFilterBarStylePreference.IconLabelOnlySelected.value -> false
else -> false
},
icon = {
Icon(
imageVector = if (filter == item && filterBarFilled) {
item.iconFilled
} else {
item.iconOutline
},
contentDescription = item.toName()
)
},
label = if (filterBarStyle == FlowFilterBarStylePreference.Icon.value) {
null
} else {
{
Text(
text = item.toName(),
// style = MaterialTheme.typography.labelLarge,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
}
},
selected = filter == item,
onClick = {
// view.performHapticFeedback(HapticFeedbackConstants.KEYBOARD_TAP)
view.playSoundEffect(SoundEffectConstants.CLICK)
filterOnClick(item)
},
colors = NavigationBarItemDefaults.colors(
indicatorColor = if (themeIndex == 5 && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
MaterialTheme.colorScheme.secondaryContainer
} else {
item.iconOutline
},
contentDescription = item.toName()
MaterialTheme.colorScheme.primaryContainer
} onDark MaterialTheme.colorScheme.secondaryContainer,
),
)
}
Spacer(modifier = Modifier.width(filterBarPadding))
}
} else {
NavigationRail(
modifier = Modifier
.background(
MaterialTheme.colorScheme.surfaceColorAtElevation(
filterBarTonalElevation
)
},
label = if (filterBarStyle == FlowFilterBarStylePreference.Icon.value) {
null
} else {
{
Text(
text = item.toName(),
// style = MaterialTheme.typography.labelLarge,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)

) {
Filter.values.forEach { item ->
NavigationRailItem(
// modifier = Modifier.height(60.dp),
alwaysShowLabel = when (filterBarStyle) {
FlowFilterBarStylePreference.Icon.value -> false
FlowFilterBarStylePreference.IconLabel.value -> true
FlowFilterBarStylePreference.IconLabelOnlySelected.value -> false
else -> false
},
icon = {
Icon(
imageVector = if (filter == item && filterBarFilled) {
item.iconFilled
} else {
item.iconOutline
},
contentDescription = item.toName()
)
}
},
selected = filter == item,
onClick = {
// view.performHapticFeedback(HapticFeedbackConstants.KEYBOARD_TAP)
view.playSoundEffect(SoundEffectConstants.CLICK)
filterOnClick(item)
},
colors = NavigationBarItemDefaults.colors(
indicatorColor = if (themeIndex == 5 && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
MaterialTheme.colorScheme.secondaryContainer
},
label = if (filterBarStyle == FlowFilterBarStylePreference.Icon.value) {
null
} else {
MaterialTheme.colorScheme.primaryContainer
} onDark MaterialTheme.colorScheme.secondaryContainer,
),
)
{
Text(
text = item.toName(),
// style = MaterialTheme.typography.labelLarge,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
}
},
selected = filter == item,
onClick = {
// view.performHapticFeedback(HapticFeedbackConstants.KEYBOARD_TAP)
view.playSoundEffect(SoundEffectConstants.CLICK)
filterOnClick(item)
},
colors = NavigationRailItemDefaults.colors(
indicatorColor = if (themeIndex == 5 && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
MaterialTheme.colorScheme.secondaryContainer
} else {
MaterialTheme.colorScheme.primaryContainer
} onDark MaterialTheme.colorScheme.secondaryContainer,
),
)
}
}
Spacer(modifier = Modifier.width(filterBarPadding))
}
}
23 changes: 16 additions & 7 deletions app/src/main/java/me/ash/reader/ui/page/home/feeds/FeedsPage.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,8 @@ fun FeedsPage(
}
}

val windowInfo = rememberWindowInfo()

LaunchedEffect(Unit) {
feedsViewModel.fetchAccount()
}
Expand Down Expand Up @@ -157,7 +159,12 @@ fun FeedsPage(
}
},
content = {
LazyColumn {
LazyColumn(
modifier = Modifier
.padding(
start = if (windowInfo.screenWidthInfo is WindowInfo.WindowType.Compat) 0.dp else 66.dp ,
end = if (windowInfo.screenWidthInfo is WindowInfo.WindowType.Compat) 0.dp else 36.dp)
) {
item {
DisplayText(
modifier = Modifier
Expand Down Expand Up @@ -226,10 +233,11 @@ fun FeedsPage(
indicatorAlpha = groupIndicatorAlpha,
isEnded = { index == groupWithFeedList.lastIndex },
onExpanded = {
groupsVisible[groupWithFeed.group.id] = groupsVisible.getOrPut(
groupWithFeed.group.id,
groupListExpand::value
).not()
groupsVisible[groupWithFeed.group.id] =
groupsVisible.getOrPut(
groupWithFeed.group.id,
groupListExpand::value
).not()
}
) {
filterChange(
Expand Down Expand Up @@ -274,6 +282,7 @@ fun FeedsPage(
}
}
},

bottomBar = {
FilterBar(
filter = filterUiState.filter,
Expand All @@ -289,8 +298,8 @@ fun FeedsPage(
isNavigate = false,
)
}
}
)

})

SubscribeDialog()
GroupOptionDrawer()
Expand Down
14 changes: 12 additions & 2 deletions app/src/main/java/me/ash/reader/ui/page/home/flow/FlowPage.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ import me.ash.reader.ui.component.base.*
import me.ash.reader.ui.ext.collectAsStateValue
import me.ash.reader.ui.page.common.RouteName
import me.ash.reader.ui.page.home.HomeViewModel
import me.ash.reader.ui.page.home.feeds.WindowInfo
import me.ash.reader.ui.page.home.feeds.rememberWindowInfo

@OptIn(
com.google.accompanist.pager.ExperimentalPagerApi::class,
Expand Down Expand Up @@ -69,6 +71,9 @@ fun FlowPage(
it?.let { isSyncing = it.any { it.state == WorkInfo.State.RUNNING } }
}

val windowInfo = rememberWindowInfo()


LaunchedEffect(onSearch) {
snapshotFlow { onSearch }.collect {
if (it) {
Expand Down Expand Up @@ -166,7 +171,12 @@ fun FlowPage(
}
) {
LazyColumn(
modifier = Modifier.fillMaxSize(),
modifier = Modifier
.fillMaxSize()
.padding(
start = if (windowInfo.screenWidthInfo is WindowInfo.WindowType.Compat) 0.dp else 66.dp ,
end = if (windowInfo.screenWidthInfo is WindowInfo.WindowType.Compat) 0.dp else 38.dp)
,
state = listState,
) {
item {
Expand Down Expand Up @@ -247,7 +257,7 @@ fun FlowPage(
feedId = filterUiState.feed?.id,
articleId = it.article.id,
MarkAsReadConditions.All
)
)
}
item {
Spacer(modifier = Modifier.height(128.dp))
Expand Down

0 comments on commit 4f0758b

Please sign in to comment.