如何使 Jetpack Compose 生命周期与 Fragment 生命周期兼容？

Question

My app previous was made using Fragments as pages. Now i'm integrating Jetpack Compose into my app. The pages are like this:

HomePageFragment -> the home page made with traditional XML

ItemListPageFragment -> a fragment wraps ComposeView that everything is done by Compose

ItemDetailPageFragment -> item detail page made with traditional XML

Here are the effects I want to achieve:

• When entering ItemListPage, show loading then a list of items. then user scroll down a bit, select an item, jump to ItemDetailPage
• When go back from ItemDetailPage to ItemListPage, UI shouldn't reload, but stays at where it was left with.

My ItemListPage is like this:

@Composable
fun Content(){

   // third party lib that kind of like useSWR for React
   val states = useRequest(fetcher = {....})
   
   if(states.error) {...}
   if(states.loading) {....}

   // render list of items
   ....
}

right now it triggers fetch and loading UI when I go back from ItemDetailPage to ItemListPage.

I think the issue is Fragment destroy views when "page-out". Then when it is "back-to" page, it creates new ComposeView and triggered onLoad event.

Answer 1

Use ViewModel

OR

Use rememberSavable so that there won't be change even if there are any configuration changes