Add swipe gesture to Tabs in Interests screen

pull/63/head^2
Dark-Knight11 3 years ago
parent 0edac18b10
commit 9041ed206e

@ -21,3 +21,10 @@ plugins {
id("dagger.hilt.android.plugin") id("dagger.hilt.android.plugin")
id("nowinandroid.spotless") id("nowinandroid.spotless")
} }
dependencies {
//compose pagers
implementation(libs.accompanist.pager)
implementation(libs.accompanist.pager.indicators)
}

@ -16,14 +16,7 @@
package com.google.samples.apps.nowinandroid.feature.interests package com.google.samples.apps.nowinandroid.feature.interests
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.*
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.WindowInsetsSides
import androidx.compose.foundation.layout.only
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.safeDrawing
import androidx.compose.foundation.layout.windowInsetsPadding
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.MoreVert import androidx.compose.material.icons.filled.MoreVert
import androidx.compose.material.icons.filled.Search import androidx.compose.material.icons.filled.Search
@ -31,15 +24,18 @@ import androidx.compose.material3.Text
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel import androidx.hilt.navigation.compose.hiltViewModel
import com.google.accompanist.pager.ExperimentalPagerApi
import com.google.accompanist.pager.HorizontalPager
import com.google.accompanist.pager.rememberPagerState
import com.google.samples.apps.nowinandroid.core.ui.LoadingWheel import com.google.samples.apps.nowinandroid.core.ui.LoadingWheel
import com.google.samples.apps.nowinandroid.core.ui.component.NiaTab import com.google.samples.apps.nowinandroid.core.ui.component.*
import com.google.samples.apps.nowinandroid.core.ui.component.NiaTabRow import kotlinx.coroutines.launch
import com.google.samples.apps.nowinandroid.core.ui.component.NiaTopAppBar
@Composable @Composable
fun InterestsRoute( fun InterestsRoute(
@ -118,6 +114,8 @@ fun InterestsScreen(
} }
} }
@OptIn(ExperimentalPagerApi::class)
@Composable @Composable
private fun InterestsContent( private fun InterestsContent(
tabState: InterestsTabState, tabState: InterestsTabState,
@ -130,26 +128,38 @@ private fun InterestsContent(
modifier: Modifier = Modifier modifier: Modifier = Modifier
) { ) {
Column(modifier) { Column(modifier) {
NiaTabRow(selectedTabIndex = tabState.currentIndex) { val pagerState = rememberPagerState()
val scope = rememberCoroutineScope()
NiaTabRow(
selectedTabIndex = pagerState.currentPage
) {
tabState.titles.forEachIndexed { index, titleId -> tabState.titles.forEachIndexed { index, titleId ->
NiaTab( NiaTab(
selected = index == tabState.currentIndex, selected = pagerState.currentPage == index,
onClick = { switchTab(index) }, onClick = {
switchTab(index)
scope.launch {
pagerState.scrollToPage(index)
}
},
text = { Text(text = stringResource(id = titleId)) } text = { Text(text = stringResource(id = titleId)) }
) )
} }
} }
when (tabState.currentIndex) { HorizontalPager(
0 -> { state = pagerState,
TopicsTabContent( count = tabState.titles.size,
verticalAlignment = Alignment.Top,
contentPadding = PaddingValues(top = 12.dp),
) { index ->
when (index) {
0 -> TopicsTabContent(
topics = uiState.topics, topics = uiState.topics,
onTopicClick = navigateToTopic, onTopicClick = navigateToTopic,
onFollowButtonClick = followTopic, onFollowButtonClick = followTopic,
modifier = Modifier.padding(top = 8.dp) modifier = Modifier.padding(top = 8.dp)
) )
} 1 -> AuthorsTabContent(
1 -> {
AuthorsTabContent(
authors = uiState.authors, authors = uiState.authors,
onAuthorClick = navigateToAuthor, onAuthorClick = navigateToAuthor,
onFollowButtonClick = followAuthor, onFollowButtonClick = followAuthor,

@ -1,5 +1,5 @@
[versions] [versions]
accompanist = "0.24.8-beta" accompanist = "0.24.9-beta"
androidDesugarJdkLibs = "1.1.5" androidDesugarJdkLibs = "1.1.5"
androidGradlePlugin = "7.1.2" androidGradlePlugin = "7.1.2"
androidxActivity = "1.4.0" androidxActivity = "1.4.0"
@ -47,6 +47,8 @@ turbine = "0.7.0"
[libraries] [libraries]
accompanist-flowlayout = { group = "com.google.accompanist", name = "accompanist-flowlayout", version.ref = "accompanist" } accompanist-flowlayout = { group = "com.google.accompanist", name = "accompanist-flowlayout", version.ref = "accompanist" }
accompanist-pager = { group = "com.google.accompanist", name = "accompanist-pager", version.ref = "accompanist" }
accompanist-pager-indicators = { group = "com.google.accompanist", name = "accompanist-pager-indicators", version.ref = "accompanist" }
android-desugarJdkLibs = { group = "com.android.tools", name = "desugar_jdk_libs", version.ref = "androidDesugarJdkLibs" } android-desugarJdkLibs = { group = "com.android.tools", name = "desugar_jdk_libs", version.ref = "androidDesugarJdkLibs" }
android-gradlePlugin = { group = "com.android.tools.build", name = "gradle", version.ref = "androidGradlePlugin" } android-gradlePlugin = { group = "com.android.tools.build", name = "gradle", version.ref = "androidGradlePlugin" }
androidx-activity-compose = { group = "androidx.activity", name = "activity-compose", version.ref = "androidxActivity" } androidx-activity-compose = { group = "androidx.activity", name = "activity-compose", version.ref = "androidxActivity" }

Loading…
Cancel
Save