Ability to add custom button inside message composer input

[kylecfoley]

We are looking to add a custom button inside the composer input. Please see desired layout below. We have been able to achieve this using the Swift UI SDK, but not the Android SDK.

[filbabic]

Hey @kylecfoley!

Are you using the XML or Compose SDK in Android? :]

Since you've already customized a bit of the content, I imagine it's Compose?

You can actually achieve this in Compose too - we have a slot called input and within the MessageInput, we have a slot called innerTrailingContent.

You can do something like this to replicate your behavior:

        val state by composerViewModel.messageComposerState.collectAsState()

        MessageComposer(
            viewModel = composerViewModel,
            input = {
                MessageInput(
                    messageComposerState = state,
                    onValueChange = { composerViewModel.setMessageInput(it) },
                    onAttachmentRemoved = { composerViewModel.removeSelectedAttachment(it) },
                    innerTrailingContent = {
                        // my custom icon goes here
                    }
                )
            }
        )

This should render an icon in the inner content of the input, which is the input itself, in the trailing slot (the slot at the end).

[kylecfoley]

Hi @filbabic! Thank you for the fast reply. We actually haven't introduced Compose yet, apologies for not including that in my notes 🙂

[filbabic]

Ohh okay in that sense, I'm afraid we don't have a direct way of exposing this customization. SwiftUI is declarative, like Compose, so it's much easier to customize.

In this case, you'd have to alternatively build your own component that represents the UI and actions you'd like. We are working on releasing a more customizable XML variant of the MessageComposerView, but at this point it's not available yet!

[filbabic]

This is covered in the MessageComposerView impl and will be available from v6 on as a default.