redux-kotlin icon indicating copy to clipboard operation
redux-kotlin copied to clipboard

Jetpack Compose example

Open DerekBeam opened this issue 3 years ago • 1 comments

I would like to use this in my jetpack compose project, but I'm not sure how to pull off the subscribe in conjunction with compose to trigger recompositions. Any tips or examples? I put what I have below... Note that this is for a library, so I am not exposing compose to the consumer which is why it is wrapped in the RelativeLayout.

Example code:

class MyWidget @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyle: Int = 0
) : RelativeLayout(context, attrs, defStyle), MyView {
    private var listener: MyView.Listener? = null
    private var properties: MyView.Properties = MyView.Properties()

    init {
        val composeView = ComposeView(context).apply {
            setContent {
                MyWidget(listener = listener, properties = properties)
            }
        }
        addView(composeView)
    }

    override fun configureView(properties: MyView.Properties) {
        this.properties = properties
    }

    override fun setListener(listener: MyView.Listener) {
        this.listener = listener
    }
}

@Composable
fun MyWidget(
    listener: MyView.Listener?,
    properties: MyView.Properties
) {
    // TODO subscribe somehow? how to unsubscribe?

    MyWidgetContent(
        state = store.state.subState,
        listener = listener,
        properties = properties
    )
}

@Composable
internal fun MyWidgetContent(
    state: Substate,
    listener: MyView.Listener?,
    properties: MyView.Properties
) {
    Card(
        elevation = properties.elevation.dp,
        modifier = Modifier.fillMaxWidth(),
        shape = RoundedCornerShape(size = properties.cornerRadius.dp)
    ) {
        // do stuff with listener, etc
        // dispatch store actions and update the state, trigger recomposition?
    }

DerekBeam avatar May 13 '22 15:05 DerekBeam

So I didn't see this at first, but it seems to solve my main issue. It would be nice to get official support for it https://github.com/reduxkotlin/redux-kotlin/pull/94

DerekBeam avatar May 13 '22 17:05 DerekBeam

This will be released as soon as compose 1.3.0 lands via https://github.com/reduxkotlin/redux-kotlin-compose

mpetuska avatar Jan 16 '23 21:01 mpetuska