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

FocusProperties

public interface FocusProperties


Properties that are applied to focusTarget that is the first child of the FocusPropertiesModifierNode that sets these properties.

See also
focusProperties

Summary

Public methods

abstract boolean

When set to false, indicates that the focusTarget that this is applied to can no longer take focus.

default @NonNull FocusRequester

A custom item to be used when the user moves focus "down".

default @NonNull FocusRequester

A custom item to be used when the user requests a focus moves to the "right" in LTR mode and "left" in RTL mode.

default @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequester>

A custom item to be used when the user requests focus to move focus in (FocusDirection.Enter).

default @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequester>

A custom item to be used when the user requests focus to move out (FocusDirection.Exit).

default @NonNull FocusRequester

A custom item to be used when the user requests a focus moves to the "left" item.

default @NonNull FocusRequester

A custom item to be used when the user requests the focus to move to the "next" item.

default @NonNull FocusRequester

A custom item to be used when the user requests the focus to move to the "previous" item.

default @NonNull FocusRequester

A custom item to be used when the user requests a focus moves to the "right" item.

default @NonNull FocusRequester

A custom item to be used when the user requests a focus moves to the "left" in LTR mode and "right" in RTL mode.

default @NonNull FocusRequester

A custom item to be used when the user moves focus "up".

abstract void
setCanFocus(boolean canFocus)

When set to false, indicates that the focusTarget that this is applied to can no longer take focus.

default void

A custom item to be used when the user moves focus "down".

default void

A custom item to be used when the user requests a focus moves to the "right" in LTR mode and "left" in RTL mode.

default void

A custom item to be used when the user requests focus to move focus in (FocusDirection.Enter).

default void

A custom item to be used when the user requests focus to move out (FocusDirection.Exit).

default void

A custom item to be used when the user requests a focus moves to the "left" item.

default void

A custom item to be used when the user requests the focus to move to the "next" item.

default void

A custom item to be used when the user requests the focus to move to the "previous" item.

default void

A custom item to be used when the user requests a focus moves to the "right" item.

default void

A custom item to be used when the user requests a focus moves to the "left" in LTR mode and "right" in RTL mode.

default void

A custom item to be used when the user moves focus "up".

Public methods

getCanFocus

abstract boolean getCanFocus()

When set to false, indicates that the focusTarget that this is applied to can no longer take focus. If the focusTarget is currently focused, setting this property to false will end up clearing focus.

getDown

default @NonNull FocusRequester getDown()

A custom item to be used when the user moves focus "down".

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getEnd

default @NonNull FocusRequester getEnd()

A custom item to be used when the user requests a focus moves to the "right" in LTR mode and "left" in RTL mode.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getEnter

@ExperimentalComposeUiApi
default @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequestergetEnter()

A custom item to be used when the user requests focus to move focus in (FocusDirection.Enter). An automatic Enter" can be triggered when we move focus to a focus group that is not itself focusable. In this case, users can use the the focus direction that triggered the move in to determine the next item to be focused on.

When you set the enter property, provide a lambda that takes the FocusDirection that triggered the enter as an input, and provides a FocusRequester as an output. You can return a custom destination by providing a FocusRequester attached to that destination, a Cancel to cancel the focus enter or Default to use the default focus enter behavior.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

// If the row is focused, performing a moveFocus(Enter) will move focus to item2.
val item2 = remember { FocusRequester() }
Row(Modifier.focusProperties { enter = { item2 } }.focusable()) {
    Box(Modifier.focusable())
    Box(Modifier.focusRequester(item2).focusable())
    Box(Modifier.focusable())
}

getExit

@ExperimentalComposeUiApi
default @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequestergetExit()

A custom item to be used when the user requests focus to move out (FocusDirection.Exit). An automatic Exit can be triggered when we move focus outside the edge of a parent. In this case, users can use the the focus direction that triggered the move out to determine the next focus destination.

When you set the exit property, provide a lambda that takes the FocusDirection that triggered the exit as an input, and provides a FocusRequester as an output. You can return a custom destination by providing a FocusRequester attached to that destination, a Cancel to cancel the focus exit or Default to use the default focus exit behavior.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

// If one of the boxes in Row1 is focused, performing a moveFocus(Exit)
// will move focus to the specified next item instead of moving focus to row1.
val nextItem = remember { FocusRequester() }
Column {
    Row(Modifier.focusProperties { exit = { nextItem } }.focusable()) {
        Box(Modifier.focusable())
        Box(Modifier.focusable())
        Box(Modifier.focusable())
    }
    Row(Modifier.focusable()) {
        Box(Modifier.focusable())
        Box(Modifier.focusRequester(nextItem).focusable())
    }
}

getLeft

default @NonNull FocusRequester getLeft()

A custom item to be used when the user requests a focus moves to the "left" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getNext

default @NonNull FocusRequester getNext()

A custom item to be used when the user requests the focus to move to the "next" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getPrevious

default @NonNull FocusRequester getPrevious()

A custom item to be used when the user requests the focus to move to the "previous" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getRight

default @NonNull FocusRequester getRight()

A custom item to be used when the user requests a focus moves to the "right" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getStart

default @NonNull FocusRequester getStart()

A custom item to be used when the user requests a focus moves to the "left" in LTR mode and "right" in RTL mode.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

getUp

default @NonNull FocusRequester getUp()

A custom item to be used when the user moves focus "up".

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setCanFocus

abstract void setCanFocus(boolean canFocus)

When set to false, indicates that the focusTarget that this is applied to can no longer take focus. If the focusTarget is currently focused, setting this property to false will end up clearing focus.

setDown

default void setDown(@NonNull FocusRequester down)

A custom item to be used when the user moves focus "down".

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setEnd

default void setEnd(@NonNull FocusRequester end)

A custom item to be used when the user requests a focus moves to the "right" in LTR mode and "left" in RTL mode.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setEnter

@ExperimentalComposeUiApi
default void setEnter(
    @ExperimentalComposeUiApi @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequester> enter
)

A custom item to be used when the user requests focus to move focus in (FocusDirection.Enter). An automatic Enter" can be triggered when we move focus to a focus group that is not itself focusable. In this case, users can use the the focus direction that triggered the move in to determine the next item to be focused on.

When you set the enter property, provide a lambda that takes the FocusDirection that triggered the enter as an input, and provides a FocusRequester as an output. You can return a custom destination by providing a FocusRequester attached to that destination, a Cancel to cancel the focus enter or Default to use the default focus enter behavior.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

// If the row is focused, performing a moveFocus(Enter) will move focus to item2.
val item2 = remember { FocusRequester() }
Row(Modifier.focusProperties { enter = { item2 } }.focusable()) {
    Box(Modifier.focusable())
    Box(Modifier.focusRequester(item2).focusable())
    Box(Modifier.focusable())
}

setExit

@ExperimentalComposeUiApi
default void setExit(
    @ExperimentalComposeUiApi @NonNull Function1<@NonNull FocusDirection, @NonNull FocusRequester> exit
)

A custom item to be used when the user requests focus to move out (FocusDirection.Exit). An automatic Exit can be triggered when we move focus outside the edge of a parent. In this case, users can use the the focus direction that triggered the move out to determine the next focus destination.

When you set the exit property, provide a lambda that takes the FocusDirection that triggered the exit as an input, and provides a FocusRequester as an output. You can return a custom destination by providing a FocusRequester attached to that destination, a Cancel to cancel the focus exit or Default to use the default focus exit behavior.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

// If one of the boxes in Row1 is focused, performing a moveFocus(Exit)
// will move focus to the specified next item instead of moving focus to row1.
val nextItem = remember { FocusRequester() }
Column {
    Row(Modifier.focusProperties { exit = { nextItem } }.focusable()) {
        Box(Modifier.focusable())
        Box(Modifier.focusable())
        Box(Modifier.focusable())
    }
    Row(Modifier.focusable()) {
        Box(Modifier.focusable())
        Box(Modifier.focusRequester(nextItem).focusable())
    }
}

setLeft

default void setLeft(@NonNull FocusRequester left)

A custom item to be used when the user requests a focus moves to the "left" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setNext

default void setNext(@NonNull FocusRequester next)

A custom item to be used when the user requests the focus to move to the "next" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setPrevious

default void setPrevious(@NonNull FocusRequester previous)

A custom item to be used when the user requests the focus to move to the "previous" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setRight

default void setRight(@NonNull FocusRequester right)

A custom item to be used when the user requests a focus moves to the "right" item.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setStart

default void setStart(@NonNull FocusRequester start)

A custom item to be used when the user requests a focus moves to the "left" in LTR mode and "right" in RTL mode.

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}

setUp

default void setUp(@NonNull FocusRequester up)

A custom item to be used when the user moves focus "up".

import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester

Column(Modifier.fillMaxSize(), Arrangement.SpaceEvenly) {
    val (item1, item2, item3, item4) = remember { FocusRequester.createRefs() }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item1)
                .focusProperties {
                    next = item2
                    right = item2
                    down = item3
                    previous = item4
                }
                .focusable()
        )
        Box(
            Modifier
                .focusRequester(item2)
                .focusProperties {
                    next = item3
                    right = item1
                    down = item4
                    previous = item1
                }
                .focusable()
        )
    }
    Row(Modifier.fillMaxWidth(), Arrangement.SpaceEvenly) {
        Box(
            Modifier
                .focusRequester(item3)
                .focusProperties {
                    next = item4
                    right = item4
                    up = item1
                    previous = item2
                }
        )
        Box(
            Modifier
                .focusRequester(item4)
                .focusProperties {
                    next = item1
                    left = item3
                    up = item2
                    previous = item3
                }
        )
    }
}