Sprawdzanie danych wejściowych podczas wpisywania przez użytkownika

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

Wyniki

Zgodność wersji

Ta implementacja wymaga, aby minimalny pakiet SDK projektu był ustawiony na poziom API 21 lub wyższy.

Zależności

Sprawdzanie poprawności wpisywanych danych

Użyj poniższego kodu, aby wyświetlić dane wejściowe pola i sprawdzić poprawność tekstu podczas wpisywania przez użytkownika. Jeśli informacje nie zostaną zweryfikowane, komunikat o błędzie pomoże użytkownikowi 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 kompozycyjny, który ponownie wykorzystuje komponent OutlinedTextField, dodając wymagane parametry do wyświetlania komunikatów o błędach weryfikatora podczas wpisywania przez użytkownika.
• EmailViewModel służy do utrzymywania stanu i zapewniania logiki weryfikacji adresu e-mail.
• Jeśli isError ma wartość true, interfejs użytkownika wyświetla wizualny wskaźnik stanu błędu weryfikacji.
• Dopóki nie wpiszesz pełnego i prawidłowego adresu e-mail, komponent będzie wyświetlać komunikat „Nieprawidłowy format adresu e-mail”.

Kolekcje, które zawierają ten przewodnik

Ten przewodnik jest częścią wyselekcjonowanych kolekcji przewodników, które obejmują szersze cele związane z programowaniem na Androida:

Tekst wyświetlany

Tekst jest kluczowym elementem każdego interfejsu. Poznaj różne sposoby wyświetlania tekstu w aplikacji, aby zapewnić użytkownikom jak najlepsze wrażenia.

Zbiór krótkich przewodników

Prośba o dane wejściowe użytkownika

Dowiedz się, jak umożliwić użytkownikom interakcję z aplikacją przez wpisywanie tekstu i korzystanie z innych metod wprowadzania danych.

Zbiór krótkich przewodników

Masz pytania lub chcesz podzielić się opinią?

Odwiedź stronę z najczęstszymi pytaniami, aby zapoznać się z przewodnikami, lub skontaktuj się z nami i podziel się swoimi przemyśleniami.

Zobacz najczęstsze pytania Prześlij opinię