https://kotlinlang.org logo
a

Austin Nelson

11/07/2021, 1:06 PM
Is there any better way to add Text Input to Compose for Wear? I'm currently using a BasicTextField (seems to be the only thing available). The keyboard pops up (but flickers and you have to click it twice), but I don't get any text in the keyboard preview as I'm typing. If I exit the keyboard view, the text does appear in the UI and if I tap on the BasicTextField again, then the previously entered text will appear in the keyboard layout.
Copy code
@Composable
fun TextField() {
    var value by remember { mutableStateOf(TextFieldValue("")) }
    val keyboardController = LocalSoftwareKeyboardController.current

    BasicTextField(
        value = value,
        onValueChange = { value = it },

        keyboardOptions = KeyboardOptions(
            imeAction = ImeAction.Done,
            keyboardType = KeyboardType.Number
        ),
        keyboardActions = KeyboardActions(
            onDone = { keyboardController?.hide() }),
        decorationBox = { innerTextField ->
            Row(
                Modifier
                    .background(Color.DarkGray, RoundedCornerShape(percent = 50))
                    .padding(12.dp)
            ) {

                if (value.text.isEmpty()) {
                    Text("Manual IP Address")
                }
                innerTextField() 
            }
        },
    )
}
j

John Nichol

11/08/2021, 12:02 PM
So I will start by saying the Text Input on a wearable is not something that we have prioritised on Compose for WearOS as it's not a user experience we typically want to promote. Our UX teams guidance doesn't talk about text input. That said it's not unreasonable to expect the low level components to work, so feel free to raise a bug and we will take a look at some point to understand what the integration problems between Compose and the keyboard on Wear are and look to get them addressed.
👍🏻 1
👍 1
a

Austin Nelson

11/15/2021, 2:42 PM
I was able to use
wear-input
and use a
RemoteInputIntentHelper
to solve my use case. Implementation in case anyone is curious:
Copy code
val launcher =
    rememberLauncherForActivityResult(ActivityResultContracts.StartActivityForResult()) {
        it.data?.let { data ->
            val results: Bundle = RemoteInput.getResultsFromIntent(data)
            val ipAddress: CharSequence? = results.getCharSequence("ip_address")
            Timber.i(ipAddress.toString())
        }
    }

...

Chip(
    label = { Text("Search with specific IP") },
    onClick = {
        val remoteInputs: List<RemoteInput> = listOf(
            RemoteInput.Builder("ip_address")
                .setLabel("Manual IP Entry")
                .wearableExtender {
                    setEmojisAllowed(false)
                    setInputActionType(EditorInfo.IME_ACTION_DONE)
                }.build()
        )

        val intent: Intent = RemoteInputIntentHelper.createActionRemoteInputIntent()

        RemoteInputIntentHelper.putRemoteInputsExtra(intent, remoteInputs)

        launcher.launch(intent)
    }
)
9 Views