Sprawdzanie danych wejściowych podczas wpisywania przez użytkownika

Możesz sprawdzać dane wprowadzane przez użytkownika w polu tekstowym, np. imię i nazwisko, adres e-mail, adres lub inne dane kontaktowe. Ta weryfikacja zmniejsza liczbę błędów i oszczędza czas użytkowników.

Zgodność wersji

Ta implementacja wymaga, aby minimalna wersja pakietu SDK projektu była ustawiona na poziom API 21 lub wyższy.

Zależności

Sprawdzanie danych wejściowych podczas ich wpisywania przez użytkownika

Użyj tego kodu, aby wyświetlić dane wejściowe w polu i sprawdzać tekst podczas wpisywania przez użytkownika. Jeśli informacje nie zostaną zweryfikowane, użytkownik zobaczy komunikat o błędzie, który pomoże mu poprawić dane wejściowe.

class EmailViewModel : ViewModel() {
    var email by mutableStateOf("")
        private set

    val emailHasErrors by derivedStateOf {
        if (email.isNotEmpty()) {
            // Email is considered erroneous until it completely matches EMAIL_ADDRESS.
            !android.util.Patterns.EMAIL_ADDRESS.matcher(email).matches()
        } else {
            false
        }
    }

    fun updateEmail(input: String) {
        email = input
    }
}

@Composable
fun ValidatingInputTextField(
    email: String,
    updateState: (String) -> Unit,
    validatorHasErrors: Boolean
) {
    OutlinedTextField(
        modifier = Modifier
            .fillMaxWidth()
            .padding(10.dp),
        value = email,
        onValueChange = updateState,
        label = { Text("Email") },
        isError = validatorHasErrors,
        supportingText = {
            if (validatorHasErrors) {
                Text("Incorrect email format.")
            }
        }
    )
}

@Preview
@Composable
fun ValidateInput() {
    val emailViewModel: EmailViewModel = viewModel<EmailViewModel>()
    ValidatingInputTextField(
        email = emailViewModel.email,
        updateState = { input -> emailViewModel.updateEmail(input) },
        validatorHasErrors = emailViewModel.emailHasErrors
    )
}
TextSnippets.kt

Najważniejsze informacje o kodzie

• Definiuje komponent, który ponownie używa komponentu OutlinedTextField, dodając wymagane parametry, aby wyświetlać komunikaty o błędach mechanizmu weryfikacji jako typy użytkowników.
• EmailViewModel służy do zachowania stanu i zapewniania logiki sprawdzania adresów e-mail.
• Jeśli isError ma wartość Prawda, interfejs wyświetla wizualny wskaźnik stanu błędu weryfikacji.
• Dopóki nie wpiszesz pełnego, prawidłowego adresu e-mail, komponent będzie wyświetlać komunikat „Nieprawidłowy format adresu e-mail”.

Wyniki

Kolekcje zawierające ten przewodnik

Ten przewodnik jest częścią tych starannie dobranych kolekcji krótkich przewodników, które obejmują szersze cele związane z tworzeniem aplikacji na Androida:

Tekst wyświetlany

Tekst jest centralnym elementem każdego interfejsu użytkownika. Dowiedz się, jak możesz wyświetlać tekst w aplikacji, aby zapewnić użytkownikom przyjemne wrażenia.

Kolekcja krótkich przewodników

Prośba o dane użytkownika

Dowiedz się, jak wdrożyć sposoby interakcji użytkowników z aplikacją przez wpisywanie tekstu i używanie innych metod wprowadzania danych.

Kolekcja krótkich przewodników

Masz pytania lub chcesz przekazać opinię?

Otwórz stronę z najczęstszymi pytaniami i poznaj krótkie przewodniki lub skontaktuj się z nami i powiedz nam, co o tym myślisz.

Najczęstsze pytania Prześlij opinię