CODEWITHSUNDEEP
android-jetpack-composeandroid-tvandroid-jetpack-compose-tv
Aitor Gómez
Aitor Gómez

Reputation: 7326

Jetpack Compose: Firing onClick events using a remote control in Android TV

I'm building my Android TV app using Jetpack Compose, and I'm trying to fire some onClick events on some Text components.

I've implemented the Modifier.focusable, so it can be focused using the remote control, and I've implemented Modifier.clickable to be launched when, well, the component is clicked.

However, when I launch the app on an emulator, I can focus and select the component properly, as I can see the change on the background color, but I can't fire the event inside Modifier.clickable when pressing on the OK button on my remote control (in my case it's KEYCODE_DPAD_CENTER). The event is fired if I click with the mouse inside the emulator, however.

Here is my code

   @Composable
   fun FocusablePill(text: String, focusRequester: FocusRequester = FocusRequester()) {

        val interactionSource = remember { MutableInteractionSource() }
        val isFocused by interactionSource.collectIsFocusedAsState()
        val isPressed by interactionSource.collectIsPressedAsState()
        val color = if (isFocused || isPressed) action else lightTranslucent_10
        val shape = RoundedCornerShape(CornerSize(24.dp))

        Text(
            text = text,
            color = MaterialTheme.colors.onPrimary,
            style = MaterialTheme.typography.button,
            modifier = Modifier
                .focusRequester(focusRequester)
                .focusable(
                    interactionSource = interactionSource
                )
                .clickable(
                    interactionSource = interactionSource,
                    indication = null //this is just cosmetic, setting LocalIndication.current still doesn't work
                ) {
                    onCommandEntered(text)
                }
                .background(color, shape)
                .padding(16.dp, 8.dp)
        )
    }

I've also tried with Modifier.selectable, but the result is the same. Event is only fired on mouse click. Also, using Button components doesn't work either.

Upvotes: 0

Views: 2282

Answers (1)

Ian G. Clifton
Ian G. Clifton

Reputation: 9439

For future reference, this was fixed and should be working as of 1.1.0-beta01. Both the Dpad center and the enter key will trigger a click on the focused view now. If you want to handle other keys (e.g., a game controller), you can use Modifier.onKeyEvent.

Upvotes: 4

Related Questions