2
votes

Comment supprimer l'étiquette flottante de TextInputLayout avec le style OutlinedBox?

Existe-t-il un moyen de supprimer l'étiquette flottante (indice) lorsque le TextInputLayout est en mode focalisé?

Quand j'essaye de définir app: hintEnabled = "false" et de faire un indice dans TextInputeEditText , le TextInputLayout se comporte bizarrement en masquant le trait supérieur.

<com.google.android.material.textfield.TextInputLayout
      style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="Text">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

</com.google.android.material.textfield.TextInputLayout>

L'important est que j'utilise des composants matériels dans la version 1.1.0-alpha01.

Modifier

Voici à quoi cela ressemble (lorsque l'entrée n'est pas focalisée):

Le trait supérieur est couper.

android material-components-android material-components

12 commentaires

définir hint sur edittext et non textinputlayout et définir hintenabled sur false

Avez-vous vu ce que j'ai mentionné ci-dessus la partie de code?

parce que vous définissez hint sur textinputlayout et non textinputedittext.

J'ai fait comme tu l'as dit. L'AVC se cache toujours.

définir un indice pour edittext et app: hintEnabled = "false" pour textinputlayout. ça marche pour moi

Utilisez-vous des composants matériels?

oui j'utilise le même

Pouvez-vous fournir du code avec des captures d'écran? Ça ne fonctionne pas pour moi.

pastebin.com/ggf2zjmm

et ressemble à ibb.co/RhMGR76

Voir la question modifiée. Votre solution ne fonctionne que lorsque l'entrée est focalisée (couleur rouge).

continuons cette discussion dans le chat .

4 Réponses :

0
votes

Essayez de définir l'indicateur vide de la mise en page du texte et de modifier le texte: -

<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <corners android:radius="10dp"/>
    <solid android:color="#ffffff"/>
    <stroke android:color="#000000"
    android:width="2dp"/>

</shape>

Si vous souhaitez utiliser l'indicateur, vous peut utiliser un dessin personnalisé comme arrière-plan de EditText : -

<com.google.android.material.textfield.TextInputLayout
      app:boxBackgroundMode="outline"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:hint="">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:hint=""
            android:layout_height="wrap_content" />

</com.google.android.material.textfield.TextInputLayout>

2 commentaires

Mais je veux garder un indice dans un EditText.

vous pouvez utiliser un dessin personnalisé avec un contour et un fond blanc

0
votes

Vous devriez utiliser ce style en premier:

 <color name="mtrl_textinput_default_box_stroke_color" tools:override="true">#F5F5F5</color>

Et vous devriez avoir une disposition d'entrée de texte contenant ce style comme ceci: p>

  <com.google.android.material.textfield.TextInputLayout
        style="@style/TextInputLayoutOutlinedBoxStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/relativelayout_activatetoken_main"
        android:layout_marginStart="20dp"
        android:layout_marginTop="30dp"
        android:layout_marginEnd="20dp"
        android:hint="@string/activatetoken_passwordhint"
        android:textColorHint="@color/colorText"
        app:helperText="@string/activatetoken_passwordhelpertext"
        app:helperTextTextAppearance="@style/TextAppearanceHelper"
        app:hintTextAppearance="@style/TextAppearanceBase"
        app:passwordToggleTint="@color/text_50">

Et pour la couleur de la bordure, utilisez ceci dans les couleurs:

<style name="TextInputLayoutOutlinedBoxStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="android:textColorHint">#F5F5F5</item>
    <item name="hintTextAppearance">@style/HintTextAppearance</item>
    <item name="boxCornerRadiusBottomEnd">20dp</item>
    <item name="boxCornerRadiusBottomStart">20dp</item>
    <item name="boxCornerRadiusTopEnd">20dp</item>
    <item name="boxCornerRadiusTopStart">20dp</item>
</style>

0 commentaires

3
votes

Il suffit de définir un indice pour EditText par programmation et de supprimer app: hintEnabled = "false" de votre TextInputLayout si vous avez, dans mon cas travaillé :)

0 commentaires

0
votes

Oui, il existe un moyen assez simple de supprimer l'indicateur d'étiquette flottante et de n'avoir qu'un indice à l'intérieur de votre TextInputLayout .

Cela peut être facilement réalisé en désactivant l'indicateur dans TextInputLayout , et en définissant l'indication sur TextInputEditText au lieu de TextInputLayout comme ceci:

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hintEnabled="false">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="hint text comes here" />

</com.google.android.material.textfield.TextInputLayout>

Le résultat semble quelque chose comme ceci:

Et quand du texte est ajouté, il ressemblera à ceci: p>

J'ai essayé ceci dans Material Components v1.2.0

0 commentaires