A煤n no tienes acceso a esta clase

Crea una cuenta y contin煤a viendo este curso

Desarrollando un campo de texto personalizado

20/26
Recursos

Aportes 4

Preguntas 1

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

No explica como trabaja los mutable State, literal

importamos lo que pide que importemos 馃槀

Enserio?

si alguien no le cambia el valor en el Edit text, hay que darle el valor del OnChange a 鈥渘ame鈥, no lo dice y mucho menos lo explica, pero se ve ah铆 como se corta el video 13:32

Buenas quisiera aportar y enriquecer el tema con este video, como siempre el feedback es bien recibido, saludos

Ejemplo State Jetpack Compose

mutableStateOf

State y MutableState
Para que un Composable sea consciente de que su estado ha cambiado y se recomponga, los par谩metros de composici贸n tienen que usar instancias de State. Si no, con una variable normal, Compose no es capaz de detectar que algo ha cambiado, y por tanto no se lanza la recomposici贸n.

Tenemos dos variantes:

State: es un estado inmutable. Normalmente se usa de interfaz para proteger la modificacion del estado desde sitios en los que no queremos.
MutableState: se puede tanto leer como modificar su valor
Cuando el valor de un MutableState se modifica, todos los Composables que dependen de ese estado se recomponen, y por tanto, la UI se actualiza basada en ese nuevo estado de forma autom谩tica.

Fuente: https://devexperto.com/estado-jetpack-compose/

CustomTextField

package tech.yeswecode.coffe4coders.components

import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedTextField
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.LayoutCoordinates
import androidx.compose.ui.layout.onGloballyPositioned
import androidx.compose.ui.platform.LocalFocusManager
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.tooling.preview.Preview
import tech.yeswecode.coffe4coders.ui.theme.Coffe4codersTheme


@Composable
fun CustomTextField(value: String,
                    placeholder: String,
                    enabled: Boolean = true,
                    trailingIcon: @Composable (() -> Unit)? = null,
                    onGloballyPositioned : ((LayoutCoordinates)-> Unit)? = null,
                    onValueChange: (String) -> Unit
                    ) {
        val focusManager = LocalFocusManager.current
        OutlinedTextField(
            value = value ,
            onValueChange = onValueChange,
            textStyle = TextStyle(color = Color.Black),
            label = {
                Text(placeholder, style = MaterialTheme.typography.caption)
            },
            modifier = Modifier.fillMaxWidth()
                .onGloballyPositioned { coordinates ->
                    if(onGloballyPositioned != null){
                        onGloballyPositioned(coordinates)
                    }
                },
            enabled= enabled,
            keyboardActions = KeyboardActions(
                onDone = {focusManager.clearFocus()}
            ),
            keyboardOptions = KeyboardOptions.Default.copy(
                imeAction = ImeAction.Done,
                keyboardType = KeyboardType.Text
            ),
            trailingIcon = trailingIcon
        )
}


@Preview(showBackground = true)
@Composable
fun CustomTextFieldPreview(){
    Coffe4codersTheme() {
        CustomTextField("","text field"){}
    }
}