android-jetpack-composeandroid-jetpackandroid-tvandroid-jetpack-compose-tv

Is there anyway to remove default focus highlighting on a composable in a lazyrow?


When I move focus to any of the items in a lazy row (Box composable), android by default darkens the background of that element to show that it being focussed. I don't need this as I am adding my own focus effects.

Is there some way to remove this?

The following is the implementation of the lazy row I have:

LazyRow(
            horizontalArrangement = Arrangement.spacedBy(8.dp),
            contentPadding = PaddingValues(horizontal = 16.dp),
            modifier = Modifier
                        .fillMaxHeight()
                        .align(Alignment.BottomStart)){
                 items(dataList){item -> SceneCard(data)}

Fun SceneCard:

Box(contentAlignment = Alignment.BottomCenter,modifier = Modifier
    .onFocusChanged { isFocused = it.hasFocus }
    .clickable(enabled = true) {}
    .animateContentSize(
        animationSpec = tween(durationMillis = 300)
    )
    .fillMaxHeight()
){//some content}

Solution

  • Found a solution to this, the trick was in the .clickable modifier function:

    Instead of just using

    Modifier.clickable(enabled = true) {}
    

    I fixed it by using

    Modifier.clickable(
        interactionSource = MutableInteractionSource(),
        indication = null,
        onClick = {})