Hello everyone, Greetings of the day! Thank you fo...

# multiplatform

[Jeetesh surana]

Hello everyone,
Greetings of the day! Thank you for creating this Slack group; I really appreciate it.
I’m working on a project that’s almost finished, but I’m encountering an issue with scrolling. I’m using a horizontal pager with a LazyColumn inside it, and I’m having trouble with scrolling behavior. If anyone could help me with this, I would be very grateful.

[Jeetesh surana]

@OptIn(ExperimentalFoundationApi::class, FlowPreview::class)
@Composable
fun horizontalPager(
    pagerState: PagerState,
    pagerFlingBehavior: SnapFlingBehavior,
    bookId: Long,
    chapterId: Long,
    writerId: Long,
    verseNumber: Int,
    fontSize: TextUnit,
    selectedChapterPosition: Int,
    masterList: List<VersesItems>,
    listState: LazyListState,
    selectedItems: Set<VersesItems>,
    isHideFavoriteTop: () -> Unit,
    onSelectionChanged: (Set<VersesItems>) -> Unit,
    isMultiSelectMode: Boolean,
    onMultiSelectModeChanged: (Boolean) -> Unit,
    clearSelection: () -> Unit,
    onChapterIdChange: (Long) -> Unit,
    onSetCharacterSelectedPosition: (Int) -> Unit,
    onVerseNumberChange: (Int) -> Unit,
) {
    val singleSelectedItem by remember { mutableStateOf<VersesItems?>(null) }
    // Use LaunchedEffect to scroll to the index after composition
    val filterList = mutableStateListOf<VersesItems>()
    LaunchedEffect(
        bookId, chapterId, writerId
    ) {
        if (masterList.isNotEmpty()) {
            filterList.swapList(
                getFilterList(
                    bookId, chapterId, writerId, masterList
                )
            )
        }
    }
    if (masterList.isNotEmpty()) {
        filterList.swapList(
            getFilterList(
                bookId, chapterId, writerId, masterList
            )
        )
    }
    LaunchedEffect(listState) {
        snapshotFlow {
            listState.firstVisibleItemIndex
        }.debounce(500L).collectLatest { index ->
            onVerseNumberChange(index)
        }
    }

    LaunchedEffect(filterList.isNotEmpty()) {
        if (filterList.isNotEmpty() && verseNumber > 0) {
            listState.scrollToItem(verseNumber)
        }
    }

    LaunchedEffect(selectedChapterPosition) {
        pagerState.animateScrollToPage(selectedChapterPosition)
    }

    LaunchedEffect(pagerState.currentPage) {
        onSetCharacterSelectedPosition(pagerState.currentPage)
        if (filterList.isNotEmpty()) {
            listState.animateScrollToItem(verseNumber)
        }
    }

    LaunchedEffect(Unit) {
        delay(100)
        if (selectedChapterPosition != -1) {
            pagerState.animateScrollToPage(selectedChapterPosition)
        }
    }

    LaunchedEffect(pagerState.currentPage) {
        if (pagerState.currentPage != -1) {
            clearSelection()
        }
    }
    HorizontalPager(state = pagerState,
        modifier = Modifier.fillMaxWidth().wrapContentHeight(),
        flingBehavior = pagerFlingBehavior,
        contentPadding = PaddingValues(0.dp),
        userScrollEnabled = true,
        pageNestedScrollConnection = remember {
            object : NestedScrollConnection {
                override fun onPreScroll(available: Offset, source: NestedScrollSource): Offset {
                    return if (available.x < 0 && source == NestedScrollSource.Drag) {
                        available.copy(y = 0f)
                    } else {
                        Offset.Zero
                    }
                }
            }
        }) { page ->
        if (page != pagerState.currentPage) {
            return@HorizontalPager
        }
        if (page == pagerState.currentPage) {
            onChapterIdChange(page.toLong() + 1)
            LazyColumn(
                verticalArrangement = <http://Arrangement.Top|Arrangement.Top>,
                modifier = Modifier.fillMaxWidth(),
                state = listState,
            ) {
                items(filterList, key = { data -> data.id ?: 0L }) { verseData ->
                    Box(
                        modifier = Modifier.fillMaxWidth().clickable {
                            if (isMultiSelectMode) {
                                onSelectionChanged(
                                    if (verseData in selectedItems) {
                                        selectedItems - verseData
                                    } else {
                                        selectedItems + verseData
                                    }
                                )
                            } else {
                                if (!isMultiSelectMode) {
                                    onMultiSelectModeChanged(true)
                                    onSelectionChanged(setOf(verseData))
                                } else {
                                    onSelectionChanged(selectedItems + verseData)
                                }
                                isHideFavoriteTop()
                            }
                        }.background(
                            when {
                                isMultiSelectMode && selectedItems.contains(verseData) -> getGray300Color()
                                !isMultiSelectMode && singleSelectedItem == verseData -> getGray300Color()
                                verseData.isFavourite == 1L -> ThemeColors.Primary200
                                else -> ThemeColors.Transparent
                            }
                        ).padding(10.dp)
                    ) {
                        Text(
                            text = "${verseData.order}. ${decodeHtmlText(verseData.content ?: "")}",
                            fontWeight = FontWeight.Bold,
                            fontSize = fontSize,
                            color = getGray900Color()
                        )
                    }
                }
            }
        }
    }
    Spacer(modifier = Modifier.height(20.dp))
}

[Jeetesh surana]

Can ANYONE please check, it’s a small issue for you and your help is huge for me?, thanks

[Jeetesh surana]

@jw ^

[Jeetesh surana]

@jw thank you for reply

[Caleb Kiage]

Most people will not install a random apk from the internet 😐

[Jeetesh surana]

Okay, Can you please look the code I shared above also I removed the apk

[Jeetesh surana]

Scrolling is working fine on iOS, but it’s getting stuck on the Android side.

[Jeetesh surana]

you can see in the video

WhatsApp Video 2024-08-07 at 12.33.06.mp4

[Jeetesh surana]

@Caleb Kiage

[Jeetesh surana]

hope you can understand the situation