Atte149/book-story
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🛠️ Add CustomBottomSheetTabRow

Browse source 
* Added custom implementation of TabRow to use in BottomSheets
This commit is contained in:
Acclorite 2024-09-06 08:34:58 +03:00
parent 7a3774f018
commit 19dd345b5c
8 changed files with 73 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

2
app/src/main/java/ua/acclorite/book_story/presentation/core/components/CustomBottomSheet.kt → app/src/main/java/ua/acclorite/book_story/presentation/core/components/custom_bottom_sheet/CustomBottomSheet.kt
View file

@ -1,4 +1,4 @@
package ua.acclorite.book_story.presentation.core.components
package ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.ColumnScope

54
app/src/main/java/ua/acclorite/book_story/presentation/core/components/custom_bottom_sheet/CustomBottomSheetTabRow.kt Normal file
View file

@ -0,0 +1,54 @@
package ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.PrimaryTabRow
import androidx.compose.material3.Tab
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.style.TextOverflow
/**
* Custom Primary Row. Used in BottomSheet in pair with HorizontalPager.
* Better to not use too many tabs, as they will overflow.
*
* @param selectedTabIndex Selected index, typically pager.currentPage.
* @param tabs Tabs to be shown, should match HorizontalPager's page count.
* @param onClick OnClick callback, gives you an index of clicked item.
*/
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CustomBottomSheetTabRow(
selectedTabIndex: Int,
tabs: List<String>,
onClick: (index: Int) -> Unit
) {
PrimaryTabRow(
modifier = Modifier
.fillMaxWidth(),
selectedTabIndex = selectedTabIndex,
containerColor = Color.Transparent
) {
tabs.forEachIndexed { index, tabItem ->
Tab(
selected = selectedTabIndex == index,
onClick = {
onClick(index)
},
selectedContentColor = MaterialTheme.colorScheme.primary,
unselectedContentColor = MaterialTheme.colorScheme.onSurfaceVariant,
text = {
Text(
tabItem,
style = MaterialTheme.typography.bodyLarge,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
}
)
}
}
}

2
app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/change_cover_bottom_sheet/BookInfoChangeCoverBottomSheet.kt
View file

@ -18,10 +18,10 @@ import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import ua.acclorite.book_story.R
import ua.acclorite.book_story.presentation.core.components.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.components.LocalBookInfoViewModel
import ua.acclorite.book_story.presentation.core.components.LocalHistoryViewModel
import ua.acclorite.book_story.presentation.core.components.LocalLibraryViewModel
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.util.showToast
import ua.acclorite.book_story.presentation.screens.book_info.data.BookInfoEvent
import ua.acclorite.book_story.presentation.screens.history.data.HistoryEvent

2
app/src/main/java/ua/acclorite/book_story/presentation/screens/book_info/components/details_bottom_sheet/BookInfoDetailsBottomSheet.kt
View file

@ -10,8 +10,8 @@ import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import ua.acclorite.book_story.R
import ua.acclorite.book_story.presentation.core.components.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.components.LocalBookInfoViewModel
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.util.showToast
import ua.acclorite.book_story.presentation.screens.book_info.data.BookInfoEvent
import java.io.File

2
app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/filter_bottom_sheet/BrowseFilterBottomSheet.kt
View file

@ -10,8 +10,8 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import ua.acclorite.book_story.presentation.core.components.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.components.LocalBrowseViewModel
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheet
import ua.acclorite.book_story.presentation.screens.browse.data.BrowseEvent
import ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.subcategories.BrowseFilterSubcategory
import ua.acclorite.book_story.presentation.screens.settings.nested.browse.components.subcategories.BrowseGeneralSubcategory

37
app/src/main/java/ua/acclorite/book_story/presentation/screens/browse/components/filter_bottom_sheet/BrowseFilterBottomSheetTabRow.kt
View file

@ -1,17 +1,10 @@
package ua.acclorite.book_story.presentation.screens.browse.components.filter_bottom_sheet
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.pager.PagerState
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.PrimaryTabRow
import androidx.compose.material3.Tab
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import ua.acclorite.book_story.R
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheetTabRow
import ua.acclorite.book_story.presentation.screens.browse.data.BrowseEvent
/**
@ -21,7 +14,6 @@ import ua.acclorite.book_story.presentation.screens.browse.data.BrowseEvent
* @param onEvent [BrowseEvent] callback.
* @param pagerState [PagerState].
*/
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun BrowseFilterBottomSheetTabRow(
onEvent: (BrowseEvent) -> Unit,
@ -33,29 +25,10 @@ fun BrowseFilterBottomSheetTabRow(
stringResource(id = R.string.sort_tab)
)
PrimaryTabRow(
modifier = Modifier
.fillMaxWidth(),
CustomBottomSheetTabRow(
selectedTabIndex = pagerState.currentPage,
containerColor = Color.Transparent
) {
tabItems.forEachIndexed { index, tabItem ->
Tab(
modifier = Modifier,
selected = pagerState.currentPage == index,
onClick = {
onEvent(BrowseEvent.OnScrollToFilterPage(index, pagerState))
},
selectedContentColor = MaterialTheme.colorScheme.primary,
unselectedContentColor = MaterialTheme.colorScheme.onSurfaceVariant,
text = {
Text(
tabItem,
style = MaterialTheme.typography.bodyLarge,
maxLines = 1
)
}
)
}
tabs = tabItems
) { index ->
onEvent(BrowseEvent.OnScrollToFilterPage(index, pagerState))
}
}

2
app/src/main/java/ua/acclorite/book_story/presentation/screens/reader/components/settings_bottom_sheet/ReaderSettingsBottomSheet.kt
View file

@ -19,8 +19,8 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.unit.dp
import ua.acclorite.book_story.presentation.core.components.CustomBottomSheet
import ua.acclorite.book_story.presentation.core.components.LocalReaderViewModel
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheet
import ua.acclorite.book_story.presentation.screens.reader.data.ReaderEvent
import ua.acclorite.book_story.presentation.screens.settings.nested.appearance.components.subcategories.ColorsSubcategory
import ua.acclorite.book_story.presentation.screens.settings.nested.reader.components.ReaderSettingsCategory

42
app/src/main/java/ua/acclorite/book_story/presentation/screens/reader/components/settings_bottom_sheet/ReaderSettingsBottomSheetTabRow.kt
View file

@ -1,25 +1,19 @@
package ua.acclorite.book_story.presentation.screens.reader.components.settings_bottom_sheet
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.pager.PagerState
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.PrimaryTabRow
import androidx.compose.material3.Tab
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import ua.acclorite.book_story.R
import ua.acclorite.book_story.presentation.core.components.LocalReaderViewModel
import ua.acclorite.book_story.presentation.core.components.custom_bottom_sheet.CustomBottomSheetTabRow
import ua.acclorite.book_story.presentation.screens.reader.data.ReaderEvent
/**
* Settings bottom sheet tab row. It is used to switch between categories.
* Settings bottom sheet tab row.
* It is used to switch between categories.
*
* @param pagerState PagerState to use along with TabRow.
*/
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ReaderSettingsBottomSheetTabRow(pagerState: PagerState) {
val onEvent = LocalReaderViewModel.current.onEvent
@ -29,28 +23,10 @@ fun ReaderSettingsBottomSheetTabRow(pagerState: PagerState) {
stringResource(id = R.string.color_tab)
)
PrimaryTabRow(
modifier = Modifier
.fillMaxWidth(),
CustomBottomSheetTabRow(
selectedTabIndex = pagerState.currentPage,
containerColor = Color.Transparent
) {
tabItems.forEachIndexed { index, tabItem ->
Tab(
selected = pagerState.currentPage == index,
onClick = {
onEvent(ReaderEvent.OnScrollToSettingsPage(index, pagerState))
},
selectedContentColor = MaterialTheme.colorScheme.primary,
unselectedContentColor = MaterialTheme.colorScheme.onSurfaceVariant,
text = {
Text(
tabItem,
style = MaterialTheme.typography.bodyLarge,
maxLines = 1
)
}
)
}
tabs = tabItems
) { index ->
onEvent(ReaderEvent.OnScrollToSettingsPage(index, pagerState))
}
}