Proper way to store tab states in Compose Multiplatform - kotlin

What is the proper way to store tab content state in Compose Multiplatform? "Remember" keeps state only during recompositions, not when one view replaces another. On Android ViewModel should be used, but in Compose Multiplatform there is no ViewModel class.

Related

How to create diagram from a composable function in jetpack compose?

I am working on Frontends using Kotlin and Jetpack compose in Android Studio.
I have created a Kotlin-File that contains a composable function and no attributes.
I was thinking of a class diagram, but the file has no attributes, only a function.
How can I draw a diagram that represents this file and its composable function?
Which diagram should I choose?

How can I replace Context Api and redux in wix/react-native-navigation

We use wix/react-native-navigation and tried to use Context API from react.We need all the screenshots to receive data and when changing in one place, there is a change in all places.The api context is not suitable, it makes a context for each screen, that is, when changed in 1 screen, the data will not be rerender in another. I would also not like to use Redux since editors are not signed in all screenshots, and it’s too difficult to forward props.
Does anyone have any ideas how to solve this problem?
This seems to be a case for the model view controller pattern.
Each screen would be a view in this pattern. You need to trigger a rerender when the data changes. You can define functions in the react context (model) and then reference it in your lifecycle methods (controller) of your different views.

How do I integrate react-navigation with an existing tab view component

I would like to use React Navigation with a tab view component that is not its default tab view (the one I have chosen to use is react-native-tab-view, as it provides a much more comprehensive interface for customization of its appearance). However, I just don't seem to be able to understand the documentation for writing custom navigators and routers. What are the basic steps I will need to perform this integration? How is this going to be affected by the fact that I will need to be able to compose a StackNavigator inside of some of my tab view's tabs?
As pointed out by #MarsonMao in the comments, the default implementation is based on react-native-tab-view. Unfortunately, it didn't provide the hooks I needed to make it work, but I was able to make a subclass of TabBarTop with a copy of the original render function modified to include the change I needed.

RNRF and displaying a scene based on redux store state

I've got a app that has a collection of scenes, and make many calls to a remote server that because they control hardware can take quite a while. In my redux store I have a variable that represents if there are any requests inflight.
What I'm trying to achieve is having a spinner or loading scene defined in a single place, and having automatically show dependent on the state of variable in the redux store.
I think that the answer lies in having a modal scene for the loading page, but the bit I'm missing is how to have it automatically displayed (and hidden) based from the state in the store. I don't want to call Actions.loadingScene() from all the places that makes the requests.
I've got a reducer in place that see's all the actions (both the application and the RNRF actions), but I couldn't work how what state I had to mutate to get it to display the modal scene.
Any pointers would be great!.
It appears that redux-saga would be the way to solve this, however I ended up making a HOC that adds the spinner, and displays it when required. It does mean that I have to remember to wrap all scenes with the HOC but that it OK.

What classifies a container in React Native?

I have started working with flex box on React native, on CSS you should set the display to flex but on RN, this is set by default.
What classifies a container object where you can set alignItems, justifyContent?
Does it only need to be a view? or is every single component a potential container?
In my experience objects that honour flex box are ones you would expect to such as View and ScrollView - whereas views like Text do not and are likened to display: inline-block or <span />.
In the example here, The View within the ScrollView honours it's parents flex properties, and similarly the Text inside the View. However the Text objects do not behave in the same way and if I'm not mistaken, would not appear to change when adjusting it's flex properties.
Container components are those React Native components which have access to the store. These components make API calls, do processing and contain the business logic of the app. Container components shouldn't have the view logic or presentational logic. The job of container components is to compute the values and pass them as props to the presentational components.
Difference between Presentational Components Container Components
Purpose How things look (markup, styles) How things work (data fetching, state updates)
Aware of Redux No Yes
To read data Read data from props Subscribe to Redux state
To change data Invoke callbacks from props Dispatch Redux actions
Are written By hand Usually generated by React Native Redux