{% setvar book_path %}/reference/androidx/_book.yaml{% endsetvar %} {% include "_shared/_reference-head-tags.html" %}

HoverableKt

public final class HoverableKt


Summary

Public methods

static final @NonNull Modifier
hoverable(
    @NonNull Modifier receiver,
    @NonNull MutableInteractionSource interactionSource,
    boolean enabled
)

Configure component to be hoverable via pointer enter/exit events.

Public methods

hoverable

public static final @NonNull Modifier hoverable(
    @NonNull Modifier receiver,
    @NonNull MutableInteractionSource interactionSource,
    boolean enabled
)

Configure component to be hoverable via pointer enter/exit events.

import androidx.compose.foundation.background
import androidx.compose.foundation.hoverable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.collectIsHoveredAsState
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.material.Text
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

// MutableInteractionSource to track changes of the component's interactions (like "hovered")
val interactionSource = remember { MutableInteractionSource() }
val isHovered by interactionSource.collectIsHoveredAsState()

// the color will change depending on the presence of a hover
Box(
    modifier = Modifier
        .size(128.dp)
        .background(if (isHovered) Color.Red else Color.Blue)
        .hoverable(interactionSource = interactionSource),
    contentAlignment = Alignment.Center
) {
    Text(if (isHovered) "Hovered" else "Unhovered")
}
Parameters
@NonNull MutableInteractionSource interactionSource

MutableInteractionSource that will be used to emit HoverInteraction.Enter when this element is being hovered.

boolean enabled

Controls the enabled state. When false, hover events will be ignored.