web-dev-qa-db-fra.com

Comment créer TextInputLayout avec OutlineBox par programme

Je veux créer TextInputLayout avec le style Widget.MaterialComponents.TextInputLayout.OutlinedBox. J'ai essayé beaucoup de façons mais je n'ai pas pu obtenir le résultat requis. Voici mon code.

TextInputLayout textInputLayout = new TextInputLayout(getActivity(),null,R.style.Widget_MaterialComponents_TextInputLayout_OutlinedBox);
textInputLayout.setHint("My Hint");
TextInputEditText editText = new TextInputEditText(textInputLayout.getContext());
textInputLayout.addView(editText);
parentView.addView(textInputLayout);

J'ai aussi essayé:

TextInputLayout textInputLayout = new TextInputLayout(getActivity(),null,TextInputLayout.BOX_BACKGROUND_OUTLINE);

Je veux créer une vue comme celle-ci .  enter image description here

androidandroid-layoutmaterial-designandroid-stylestextinputlayout
7
Deepak Vajpayee

METTRE À JOUR

Merci à Mike M. 

Vous devez utiliser la méthode TextInputLayout.setBoxBackgroundMode() pour utiliser le style OutlineBox.

setBoxBackgroundMode (int boxBackgroundMode)

  • Définissez le mode pour l'arrière-plan de la boîte (rempli, contour ou aucun).

Ensuite, vous devez utiliser TextInputLayout.BOX_BACKGROUND_OUTLINE) Constants

NOTE: Pour obtenir le coin dans votre OutlineBox de TextInputLayout, vous devez utiliser setBoxCornerRadii() method

SAMPLE CODE

public class MainActivity extends AppCompatActivity {

    LinearLayout parentView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        parentView = findViewById(R.id.parentView);

        TextInputLayout emailTextInputLayout = new TextInputLayout(this, null, R.style.Widget_MaterialComponents_TextInputLayout_OutlinedBox);

        emailTextInputLayout.setHint("Please Enter Email Address");
        emailTextInputLayout.setBoxBackgroundMode(TextInputLayout.BOX_BACKGROUND_OUTLINE);
        emailTextInputLayout.setBoxCornerRadii(5, 5, 5, 5);
        TextInputEditText edtEmail = new TextInputEditText(emailTextInputLayout.getContext());
        emailTextInputLayout.addView(edtEmail);

        parentView.addView(emailTextInputLayout);


        TextInputLayout passTextInputLayout = new TextInputLayout(this, null, R.style.Widget_MaterialComponents_TextInputLayout_OutlinedBox);

        passTextInputLayout.setHint("Please Enter Password");
        passTextInputLayout.setBoxBackgroundMode(TextInputLayout.BOX_BACKGROUND_OUTLINE);
        passTextInputLayout.setBoxCornerRadii(5, 5, 5, 5);
        TextInputEditText edtPass = new TextInputEditText(passTextInputLayout.getContext());
        passTextInputLayout.addView(edtPass);

        parentView.addView(passTextInputLayout);


    }

}

SORTIE

 enter image description here

Basé sur cette réponse: https://stackoverflow.com/questions/3246447/how-to-set-the-style-attrib--programmatically-in-Android} _

  • Le changement de style dynamique n'est actuellement pas pris en charge. Vous devez définir le style avant de créer la vue (en XML).

C'est la raison pour laquelle TextInputLayout n'accepte pas par programmation de définir le style de contour.

Voici la solution simple:

Vous pouvez utiliser LayoutInflater

  • Instancie un fichier de présentation XML dans ses objets View correspondants.

DÉMO

Créer une nouvelle mise en page

<?xml version="1.0" encoding="utf-8"?>
<Android.support.design.widget.TextInputLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/userIDTextInputLayout"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_margin="10dp">

    <Android.support.design.widget.TextInputEditText
        Android:id="@+id/userIDTextInputEditText"
        Android:layout_width="match_parent"
        Android:hint="Enter User Name"
        Android:layout_height="wrap_content" />
</Android.support.design.widget.TextInputLayout>

AndroidX (+ Composants matériels pour Android ):

<?xml version="1.0" encoding="utf-8"?>
<com.google.Android.material.textfield.TextInputLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/userIDTextInputLayout"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_margin="10dp">

    <com.google.Android.material.textfield.TextInputEditText 
        Android:id="@+id/userIDTextInputEditText"
        Android:layout_width="match_parent"
        Android:hint="Enter User Name"
        Android:layout_height="wrap_content" />
</com.google.Android.material.textfield.TextInputLayout>

Maintenant, en utilisant LayoutInflater, ajoutez TextInputLayout dans la mise en page requise.

public class MainActivity extends AppCompatActivity {

    LinearLayout rootView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        rootView = findViewById(R.id.rootView);

        View view = LayoutInflater.from(this).inflate(R.layout.temp_layout, null);
        TextInputLayout userNameIDTextInputLayout=view.findViewById(R.id.userIDTextInputLayout);
        TextInputEditText userNameInputEditText = view.findViewById(R.id.userIDTextInputEditText);
        userNameIDTextInputLayout.setHint("Please Enter User Name");
        rootView.addView(view);
    }
}

SORTIE

 Screenshot of app with an outlined text input

Remarque

Si vous souhaitez ajouter un TextInputLayout à partir de XML, veuillez vérifier la réponse suivante:

Si vous souhaitez ajouter plus de 5 TextInputLayout par programme, envisagez d'utiliser un RecyclerView. Découvrez les réponses suivantes:

J'espère que cela t'aides!

9
Nilesh Rathod

Vous pouvez utiliser la méthode applyStyle définie sur la classe Theme. Dans Kotlin, vous pouvez y accéder avec la propriété theme sur une instance Context (ou une sous-classe).

La fonction applyStyle vous permet d'ajouter un style au thème actuel, qui définit les styles de référence des attributs de thème. Après avoir appelé cette méthode, vous pouvez passer l'attribut en tant que troisième paramètre d'une View, comme TextInputLayout, qui appliquera les styles souhaités tout en respectant le thème.

J'ai utilisé cette technique dans Splitties (une bibliothèque dont je suis l'auteur), et il existe une documentation ainsi que des exemples qui devraient vous aider: https://github.com/LouisCAD/Splitties/blob/v3.0.0-alpha02/views-dsl /README.md#using-styles-defined-in-xml

Je n'ai pas encore ajouté de support de première classe pour les thèmes de Material Components dans Splitties Views DSL, mais vous pouvez le faire vous-même et vous pouvez même ouvrir un problème pour en discuter ou contribuer à son intégration plus rapidement.

1
Louis CAD