Android
TextInputLayout

परिचय

टिप्पणियों

compile 'com.android.support:design:25.3.1'

मूल उपयोग

यह TextInputLayout का मूल उपयोग है।
टिप्पणी अनुभाग में वर्णित build.gradle . build.gradle फ़ाइल में निर्भरता जोड़ना सुनिश्चित करें।

उदाहरण:

 <android.support.design.widget.TextInputLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content">

     <EditText
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:hint="@string/username"/>
 
 </android.support.design.widget.TextInputLayout>

त्रुटियों को संभालना

आप उपयोग कर सकते हैं TextInputLayout के अनुसार त्रुटि संदेश प्रदर्शित करने के लिए सामग्री डिजाइन दिशा निर्देशों का उपयोग कर setError और setErrorEnabled तरीकों।

EditText उपयोग के नीचे त्रुटि दिखाने के लिए:

TextInputLayout til = (TextInputLayout) findViewById(R.id.username);
til.setErrorEnabled(true);
til.setError("You need to enter a name");

TextInputLayout में त्रुटि को सक्षम करने के लिए आप app:errorEnabled="true" उपयोग कर सकते हैं app:errorEnabled="true" in xml या til.setErrorEnabled(true); ऊपर दिखाये अनुसार।

आप प्राप्त करेंगे:

कैरेक्टर काउंटिंग जोड़ना

TextInputLayout में इसके अंदर परिभाषित एक EditText के लिए एक चरित्र काउंटर है।
काउंटर को EditText के नीचे दिया जाएगा।

बस setCounterEnabled() और setCounterMaxLength विधियों का उपयोग करें:

TextInputLayout til = (TextInputLayout) findViewById(R.id.username);
til.setCounterEnabled(true);
til.setCounterMaxLength(15);

या app:counterEnabled और app:counterMaxLength xml में app:counterMaxLength विशेषताएँ।

<android.support.design.widget.TextInputLayout
    app:counterEnabled="true"
    app:counterMaxLength="15">

    <EditText/>

</android.support.design.widget.TextInputLayout>

पासवर्ड दृश्यता टॉगल

एक इनपुट पासवर्ड प्रकार के साथ, आप भी कर सकते हैं एक आइकन पता चलता है कि या छुपा सकते हैं सक्षम का उपयोग करते हुए पूरे पाठ passwordToggleEnabled विशेषता।

आप इन विशेषताओं का उपयोग करके समान डिफ़ॉल्ट को भी अनुकूलित कर सकते हैं:

• passwordToggleDrawable : डिफ़ॉल्ट आई आइकन को बदलने के लिए
• passwordToggleTint : ड्रा करने योग्य टॉगल करने के लिए पासवर्ड दृश्यता के लिए एक टिंट लागू करने के लिए।
• passwordToggleTintMode : पृष्ठभूमि टिंट को लागू करने के लिए उपयोग किए जाने वाले सम्मिश्रण मोड को निर्दिष्ट करने के लिए।

उदाहरण:

<android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:passwordToggleContentDescription="@string/description"
        app:passwordToggleDrawable="@drawable/another_toggle_drawable"
        app:passwordToggleEnabled="true">

            <EditText/>

</android.support.design.widget.TextInputLayout>

TextInputEditText

TextInputEditText IME में एक संकेत प्रदर्शित करने के लिए एक अतिरिक्त फिक्स के साथ एक EditText है, जब 'निकालें' मोड में ।

एक्स्ट्रेक्ट मोड वह मोड है जो कीबोर्ड एडिटर स्विच करने पर होता है जब आप एडिटटेक्स्ट पर क्लिक करते हैं जब स्पेस बहुत छोटा होता है (उदाहरण के लिए स्मार्टफोन पर लैंडस्केप)।
इस मामले में, जब आप पाठ को संपादित कर रहे हैं तो एक EditText का उपयोग करके आप देख सकते हैं कि IME आपको जो संपादन कर रहा है उसका संकेत नहीं देता है।

TextInputEditText हिंट टेक्स्ट प्रदान करते हुए इस समस्या को हल करता है जबकि उपयोगकर्ता के डिवाइस का IME एक्सट्रैक्ट मोड में है।

उदाहरण:

<android.support.design.widget.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="Description"
    >
    <android.support.design.widget.TextInputEditText
        android:id="@+id/description"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</android.support.design.widget.TextInputLayout>

TextInputLayout की उपस्थिति को अनुकूलित करना

आप अपनी शैलियों में कस्टम शैलियों को परिभाषित करके TextInputLayout और इसके एम्बेडेड EditText की उपस्थिति को कस्टमाइज़ कर सकते हैं। styles.xml । परिभाषित शैलियों को आपके TextInputLayout या तो शैलियों या थीम के रूप में जोड़ा जा सकता है।

संकेत स्वरूप को अनुकूलित करने के लिए उदाहरण:

styles.xml :

<!--Floating label text style-->  
<style name="MyHintStyle" parent="TextAppearance.AppCompat.Small">  
    <item name="android:textColor">@color/black</item>
</style>

<!--Input field style-->  
<style name="MyEditText" parent="Theme.AppCompat.Light">  
    <item name="colorControlNormal">@color/indigo</item>
    <item name="colorControlActivated">@color/pink</item>
</style>  

स्टाइल लागू करने के लिए अपने TextInputLayout और EditText को निम्नानुसार अपडेट करें

<android.support.design.widget.TextInputLayout  
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:hintTextAppearance="@style/MyHintStyle">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/Title"
        android:theme="@style/MyEditText" />

</android.support.design.widget.TextInputLayout>  

TextInputLayout के उच्चारण रंग को अनुकूलित करने के लिए उदाहरण। उच्चारण का रंग EditText की आधार रेखा के रंग और फ्लोटिंग हिंट टेक्स्ट के टेक्स्ट कलर को प्रभावित करता है:

styles.xml :

<style name="TextInputLayoutWithPrimaryColor" parent="Widget.Design.TextInputLayout">
    <item name="colorAccent">@color/primary</item>
</style> 

लेआउट फ़ाइल:

<android.support.design.widget.TextInputLayout
            android:id="@+id/textInputLayout_password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/TextInputLayoutWithPrimaryColor">

            <android.support.design.widget.TextInputEditText
                android:id="@+id/textInputEditText_password"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/login_hint_password"
                android:inputType="textPassword" />

</android.support.design.widget.TextInputLayout>