如何使用jetpack compose将焦点状态设置为按钮? [英] How to set a focused state to a Button with jetpack compose?

问题描述

compose_version = '1.0.0-beta02'.

compose_version = '1.0.0-beta02'.

我可以通过 FocusRequester 设置焦点状态 TextField，但不能设置 Button.

I can set a focused state TextField by FocusRequester, but Button not.

        val requester1 = FocusRequester()
       
        TextField(value = text1,
            { newValue ->
                text1 = newValue
            },
            modifier = Modifier
                .focusable(true)
                .focusRequester(requester1)
                .background(focusedColor1)
                .onFocusChanged {
                    focusedColor1 = if (it.isFocused) {
                        text1 = "TextField1 focused"
                        Color.Red
                    } else {
                        text1 = "TextField1 unfocused"
                        Color.Green
                    }
                }

        )

方法onFocusChanged"的 TextField 将被调用.

The method "onFocusChanged" of TextField would be invoked.

        val requester3 = FocusRequester()
        Button(
            onClick = {
                requester3.requestFocus()

            },
            modifier = Modifier
                .focusModifier()
                .focusable(true)
                .focusRequester(requester3)
                .onFocusEvent {
                    Toast
                        .makeText(
                            context,
                            "Button onFocusEvent it.isFocused:${it.isFocused}. ${it.name}",
                            Toast.LENGTH_SHORT
                        )
                        .show()
                }
                .onFocusChanged {
                    Toast
                        .makeText(
                            context,
                            "Button onFocusChanged it.isFocused:${it.isFocused}",
                            Toast.LENGTH_SHORT
                        )
                        .show()
                }.background(Color.Red)

        ) {
            Text(text = text2,Modifier.background(Color.Red))
        }

但是方法onFocusChanged"Button 不会被调用.

But the method "onFocusChanged" of Button would not be invoked.

推荐答案

使用类似:

val focusRequester = FocusRequester()
val interactionSource = remember { MutableInteractionSource() }
val isFocused = interactionSource.collectIsFocusedAsState().value
// if (isFocused....)

Button(
    onClick = {
        focusRequester.requestFocus()
    },
    modifier = Modifier
        // add focusRequester modifier before the focusable (or even in the parent)
        .focusRequester(focusRequester)
        .focusable(interactionSource = interactionSource)
 ){ ...  }

这篇关于如何使用jetpack compose将焦点状态设置为按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！