I am trying to use VerticalScroller but it is not ...
# compose
a
I am trying to use VerticalScroller but it is not working properly. Whole ui lags
Copy code
@Composable
private fun ShowArticle(
    articleList: List<NewsArticle>
) {
    val scrollerPosition: ScrollerPosition = +memo {ScrollerPosition(0f)}
    if(scrollerPosition.isAtEndOfList) {
        newArticleModel.loadMoreNationData(2)
    }
    VerticalScroller(scrollerPosition = scrollerPosition) {
        Column(Expanded) {
            articleList.forEach {
                ArticleTicket(
                    backgroundColor = (+MaterialTheme.colors()).background,
                    article = it
                )
            }
        }
    }
}
val ScrollerPosition.isAtEndOfList: Boolean get() = value >= maxPosition
I am loading data as verticalscroller reaches its end..
m
Try to wrap the "isAtTheEndOfList" if statement inside a Observe { ... }
Because you reading the scrollPosition.value the whole list is recomposed any time you scroll. By wrapping the code in a Observe it will only recompose the code inside it.
👍 1
a
Copy code
val observe  = Observer<Boolean> {
    if (it) {
        newArticleModel.loadMoreNationData(2)
    }
}
observe.onChanged(scrollerPosition.isAtEndOfList)
Like this ?
m
No i mean androidx.compose.Observe
Copy code
androidx.compose.Observe {
    if(scrollerPosition.isAtEndOfList) {
        newArticleModel.loadMoreNationData(2)
    }
}
Like this
👍 3
a
Yeah thanks
Now, It is working fine
m
Great:)
c
As the above discussion shows
Observe
is a confusing name. Any recommendations for renaming it?
v
It’s better to name the component Observe as BodyScope as it “creates a scope which will be the root of recomposition for any reads or writes to Model classes that happen inside of it.
m
I think Observe is ok. The problem is that we have to get used to the fact that each composable lambda without a return type is a scope which can be invoked when ever something has changed.
k
I had a similar problem and this thread helped me in solving it.