floating hint text not disappear after typing something - android

i want to make a register fragment with text input layout. But my problem is hint property. when typing, hint's copy goes up. I have two hints when typing.And also I don't have this problem in activity page. How can i solve this in fragment?
https://imgur.com/a/S7evtIO
<android.support.design.widget.TextInputLayout
android:id="#+id/floating_hint_email"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:hintTextAppearance="#style/FloatingHintStyle">
<EditText
android:id="#+id/etEmail"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ems="10"
android:hint="Emailinizi giriniz"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/floating_hint_pass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:hintEnabled="true"
app:hintTextAppearance="#style/FloatingHintStyle">
<EditText
android:id="#+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Şifrenizi giriniz"
android:inputType="textPassword" />
</android.support.design.widget.TextInputLayout>

You need to use TextInputEditText instead of EditText, your code should be like
<android.support.design.widget.TextInputLayout
android:id="#+id/floating_hint_email"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TextInputEditText
android:id="#+id/etEmail"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ems="10"
android:hint="Emailinizi giriniz"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/floating_hint_pass"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TextInputEditText
android:id="#+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Şifrenizi giriniz"
android:inputType="textPassword" />
</android.support.design.widget.TextInputLayout>

Related

Setting android:lines on TextInputEditText not working

Do anyone know how to show Total Lines prior display when using TextInputEditText and TextInputLayout? I don't have this problem when using the normal EditText without the TextInputLayout. This is my sample code :
<android.support.design.widget.TextInputLayout
android:id="#+id/input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/spacing_small"
app:counterEnabled="true"
app:counterMaxLength="1000"
app:counterOverflowTextAppearance="#style/TextLimitError"
app:hintTextAppearance="#style/TextAppearance.App.TextInputLayout"
app:theme="#style/TextInputLayoutStyle">
<android.support.design.widget.TextInputEditText
android:id="#+id/input"
style="#style/TextInputEditTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="hint text"
android:inputType="textMultiLine"
android:lines="5"
android:maxLength="1000"/>
</android.support.design.widget.TextInputLayout>
My goal is to have the same effect like html textarea when we're setting the rows attribute.
This is what i got when setting the android:lines on the TextInputEditText. It leave a blank empty space between the floating label and the first letter that i typed.
try android:gravity="top|left" below this may help
<android.support.design.widget.TextInputLayout
android:id="#+id/input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/spacing_small"
app:counterEnabled="true"
app:counterMaxLength="1000"
app:counterOverflowTextAppearance="#style/TextLimitError"
app:hintTextAppearance="#style/TextAppearance.App.TextInputLayout"
app:theme="#style/TextInputLayoutStyle">
<EditText
android:id="#+id/input"
style="#style/TextInputEditTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="top|left"
android:hint="hint text"
android:inputType="textMultiLine"
android:lines="3"
android:maxLines="5"
android:minLines="3"
android:maxLength="1000"
android:singleLine="false"
android:scrollbars="vertical"/>
</android.support.design.widget.TextInputLayout>
set android:gravity="top|left" is working ,like below:
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TextInputEditText
android:id="#+id/notesValue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="left|top"
android:hint="#string/mlNote"
android:inputType="textCapSentences|textMultiLine"
android:lines="3" />
</android.support.design.widget.TextInputLayout>

Gap between Edittext underline and Hint in Input Layout

I am using EditText Input layout.
Below is my xml code :
<android.support.design.widget.TextInputLayout
android:id="#+id/TextInputLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/et_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter Password"
android:imeOptions="actionNext"
android:maxLines="1"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
I want to give more gap between the editText underline and the hint text(Enter Password). And I want to reduce the size of the hint text.
Can anyone please help me how to get this.
you can set padding for gap between the edittext underline and hint text and use this for changing hint size:
<string name="hint"><font size="20">Hint!</font></string>
example:
<android.support.design.widget.TextInputLayout
android:id="#+id/TextInputLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/et_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/hint"
android:imeOptions="actionNext"
android:padding="5dp"
android:maxLines="1"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
Try with below code : Use android:padding="any value in sp/dp" for between your bottom line and editText.
<android.support.design.widget.TextInputLayout
android:id="#+id/TextInputLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:clipChildren="false">
<android.support.design.widget.TextInputEditText
android:id="#+id/password_et"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="3dp"
android:hint="Password"
android:padding="5dp"
android:translationY="3dp" />
</android.support.design.widget.TextInputLayout>
Try using paddingTop with translationY property of EditText. For example
<android.support.design.widget.TextInputLayout
android:id="#+id/TextInputLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/et_edittext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Enter Password"
android:imeOptions="actionNext"
android:translationY="#dimen/dimen_10dp"
android:inputType="text"
android:maxLines="1" />
</android.support.design.widget.TextInputLayout>
Try this!!
For Space
Give padding to EditText as much as you want
For text size
In style.xml
<style name="TextLabel" parent="TextAppearance.Design.Hint">
<item name="android:textSize">16sp</item>
</style>
In your layout
<android.support.design.widget.TextInputLayout
android:id="#+id/TextInputLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:clipChildren="false"
app:hintTextAppearance="#style/TextLabel">
<android.support.design.widget.TextInputEditText
android:id="#+id/password_et"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="3dp"
android:hint="Password"
android:padding="5dp"
android:translationY="3dp" />
</android.support.design.widget.TextInputLayout>

Floating hint label in Android Studio not showing until pressed

I am trying to use a floating label in Android Studio and it is working sometimes and not others, the hint only shows once you click on the edit text otherwise it won't show. I would like it to show the password hint like the email one before you click it
<android.support.design.widget.TextInputLayout
android:id="#+id/EmailLayout"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_below="#id/logo"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:theme="#style/TextLbl">
<android.support.design.widget.TextInputEditText
android:id="#+id/emailInput"
android:layout_width="200dp"
android:layout_height="40dp"
android:ems="10"
android:hint="#string/email"
android:inputType="textEmailAddress"
android:textSize="20sp" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/PassLayout"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_below="#id/EmailLayout"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:theme="#style/TextLbl">
<android.support.design.widget.TextInputEditText
android:id="#+id/passInput"
android:layout_width="200dp"
android:layout_height="40dp"
android:ems="10"
android:hint="#string/password"
android:inputType="textPassword"
android:textSize="20sp" />
</android.support.design.widget.TextInputLayout>
I cannot see what is wrong with this code
Try this one:
<android.support.design.widget.TextInputLayout
android:id="#+id/PassLayout"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_below="#id/EmailLayout"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:theme="#style/TextLbl">
<android.support.design.widget.TextInputEditText
android:id="#+id/passInput"
android:layout_width="200dp"
android:layout_height="40dp"
android:ems="10"
android:hint="#string/password"
android:inputType="textPersonName"
android:textSize="20sp" />
</android.support.design.widget.TextInputLayout>
in Java file:
PassLayout.setInputType(InputType.TYPE_CLASS_TEXT |
InputType.TYPE_TEXT_VARIATION_PASSWORD);
Hope this help you..if you need any help you can ask.
Try to change your code by using below Code : (Its Workable code )
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
app:passwordToggleEnabled="true"
android:layout_height="wrap_content">
<android.support.design.widget.TextInputEditText
android:id="#+id/password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:inputType="textPassword"
android:hint="Password"
android:drawableLeft="#null"
/>
</android.support.design.widget.TextInputLayout>
or you can set Hint by java on your Activity class as :
passwordEt.setHint("Password");
that's because you're using android:inputType="textPassword" in the password edittext. Try using:
android:gravity="center"
android:ellipsize="start"

how to show both PasswordToggle icon and background drawable in TextInputLayout?

I want to set a background drawable for my TextInputLayout , this is my code :
<android.support.design.widget.TextInputLayout
android:id="#+id/input_layout_repass"
android:layout_width="match_parent"
android:layout_height="37dp"
android:layout_marginTop="10dp"
app:hintEnabled="false"
android:layoutDirection="rtl"
app:passwordToggleEnabled="true">
<EditText
android:id="#+id/repass"
style="#style/edittexts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/hint_repass"
android:drawableRight="#drawable/ic_https_grey600_18dp"
android:inputType="textPassword"
android:nextFocusDown="#+id/email" />
</android.support.design.widget.TextInputLayout>
the problem is, the icon is not appearing, the reason is that of passwordToggleEnabled when I remove it, it shows the drawable
how to show both PasswordToggle Drawable and background drawable?
Use
android:drawableStart="#drawable/ic_launcher_round"
instead of
android:drawableRight="#drawable/ic_launcher_round"
Try this
<android.support.design.widget.TextInputLayout
android:id="#+id/input_layout_repass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layoutDirection="rtl"
app:hintEnabled="false"
app:passwordToggleEnabled="true">
<EditText
android:id="#+id/repass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:drawableStart="#drawable/ic_launcher_round"
android:hint="nilu"
android:imeOptions="actionNext"
android:inputType="textPassword" />
</android.support.design.widget.TextInputLayout>
NOTE : android:drawableStart="#drawable/ic_launcher_round" is working because of android:layoutDirection="rtl"
OUTPUT
try this
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:id="#+id/rl_main"
android:padding="#dimen/margin_30dp"
android:background="#color/white_color">
<ImageView
android:id="#+id/img_email"
android:layout_width="#dimen/margin_25dp"
android:layout_height="#dimen/margin_25dp"
android:src="#drawable/message"
android:layout_marginTop="#dimen/margin_15dp"
android:layout_alignParentLeft="true"
/>
<!--Email-->
<android.support.design.widget.TextInputLayout
android:id="#+id/til_email_login_activity"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:hint="#string/email"
android:textColorHint="#color/gray">
<com.xxx.app.customeview.CustomFontEditText
android:id="#+id/et_email_login_activity"
style="#style/edit_text_style"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:imeOptions="actionNext"
android:inputType="textEmailAddress"
android:text="" />
</android.support.design.widget.TextInputLayout>
</RelativeLayout>
for password tongle off use app:passwordToggleEnabled="false"
You have to add this line only
android:drawableStart="#drawable/ic_action_rupee"
Use this code It will working for me.
<android.support.design.widget.TextInputLayout
android:id="#+id/input_layout_repass"
android:layout_width="match_parent"
android:layout_height="37dp"
android:layout_marginTop="10dp"
app:hintEnabled="false"
app:passwordToggleEnabled="true">
<EditText
android:id="#+id/repass"
style="#style/edittexts"
android:drawableStart="#drawable/ic_action_rupee"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/hint_repass"
android:inputType="textPassword"
android:nextFocusDown="#+id/email"
android:drawableLeft="#drawable/ic_action_rupee" />
</android.support.design.widget.TextInputLayout>

imeOption="actionNext" not working in TextInputLayout

I am using floating hint from material design. I want to shift focus from one EditText to the next, So I have put imeOptions="actionNext" in all editTexts and imeOptions="actionDone in the last EditText. But focus is not shifting to next EditText.
Below is the snippet of my xml.
<android.support.design.widget.TextInputLayout
android:id="#+id/streetWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/TextInputStyle">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Street/Locality *"
android:imeOptions="actionNext"
android:maxLines="1"/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/flatWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_10sdp"
android:theme="#style/TextInputStyle">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Building Name / Flat Number*"
android:imeOptions="actionNext"
android:maxLines="1"/>
</android.support.design.widget.TextInputLayout>
You should add android:imeOptions="actionNext" in EditText section.
<android.support.design.widget.TextInputLayout
android:id="#+id/streetWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/TextInputStyle">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:imeOptions="actionNext"
android:maxLines="1"
android:inputType="text"/>
</android.support.design.widget.TextInputLayout>
Add attribute android:inputType="text" to your EditText.
Try this:
<android.support.design.widget.TextInputLayout
android:id="#+id/streetWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Street/Locality *"
android:imeOptions="actionNext"
android:maxLines="1"
android:inputType="text"/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/flatWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_10sdp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Building Name / Flat Number*"
android:imeOptions="actionNext"
android:maxLines="1"
android:inputType="text"/>
</android.support.design.widget.TextInputLayout>
You should add android:inputType="text" on section Tag
If you not adding inputType imeOption is not work
Try this :
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/dimens_16dp">
<android.support.design.widget.TextInputEditText
android:id="#+id/et_impian"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/text_fill_your_dream_here"
android:imeOptions="actionNext"
android:inputType="text"
android:backgroundTint="#color/color_green_manulife"/>
</android.support.design.widget.TextInputLayout>
In my case I had to also add android:nextFocusForward="#id/secondInput". Make sure you are adding id's on TextInputEditText and not on TextInputLayout.
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="First input">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/firstInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:imeOptions="actionNext"
android:inputType="number"
android:nextFocusForward="#id/secondInput">
<requestFocus />
</com.google.android.material.textfield.TextInputEditText>
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Second input">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/secondInput"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:imeOptions="actionDone"
android:inputType="text"
android:maxLines="1" />
</com.google.android.material.textfield.TextInputLayout>

Categories

Resources