I'm using a style for TextInputEditText to put a border around the field and I'm usingTextInputLayout to set error messages. But when setError () is called the border disappears and remains only a space in place that should have a field.
xml:
<android.support.design.widget.TextInputLayout
android:id="#+id/input"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dp">
<android.support.design.widget.TextInputEditText
android:id="#+id/edittext"
android:layout_width="300dp"
android:layout_height="wrap_content"
style="#style/EditTextStyle"
android:textColor="#color/secondary_text"
android:paddingTop="#dimen/float_hint_margin"
android:textSize="15dp" />
</android.support.design.widget.TextInputLayout>
EditTextStyle:
<style name="EditTextStyle">
<item name="android:textColor">#color/secondary_text</item>
<item name="android:background">#drawable/lgedittext</item>
<item name="android:paddingTop">5dp</item>
<item name="android:textSize">12dp</item>
<item name="android:layout_marginTop">5dp</item>
<item name="android:layout_height">30dp</item>
</style>
lgedittext:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="#dimen/float_hint_margin">
<shape>
<solid android:color="#color/icons" />
<stroke
android:width="1dp"
android:color="#color/divider" />
<corners android:radius="8dp" />
</shape>
</item>
</layer-list>
Activity:
final TextInputEditText field = (TextInputEditText) dialog.findViewById(R.id.edittext);
final TextInputLayout input = (TextInputLayout) view.findViewById(R.id.input);
String text = field.getText().toString();
if (!text.equals("")) {
//do something
} else {
input.setError(getString(R.string.error_empty));
}
Related
I want to make round corner's of bottom line in TextInputLayout Filled Text from Material Design. I am able to change the color of it in focused and unfocussed mode but how to change the corner of it to be round shape.
This is what I have now-
And I am looking for following results-
This is the code I try but didn't do much -
<com.google.android.material.textfield.TextInputLayout
app:shapeAppearanceOverlay="#style/Rounded_ShapeAppearanceOverlay.MaterialComponents.TextInputLayout.FilledBox"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
app:boxStrokeColor="#color/selector_otp_input_box_stroke_color"
app:boxStrokeWidth="6dp"
app:boxCornerRadiusBottomEnd="5dp"
app:boxCornerRadiusBottomStart="5dp"
app:boxCornerRadiusTopEnd="5dp"
app:boxCollapsedPaddingTop="5dp"
app:boxStrokeWidthFocused="6dp">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cursorVisible="false"
android:digits="1234567890"
android:inputType="number"
android:textSize="40sp"
android:textIsSelectable="false"
android:maxLength="1"
android:maxLines="1"
android:backgroundTint="#color/colorPrimary"/>
</com.google.android.material.textfield.TextInputLayout>
Style Rounded_ShapeAppearanceOverlay
<style name="Rounded_ShapeAppearanceOverlay.MaterialComponents.TextInputLayout.FilledBox"
parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
<item name="cornerSizeBottomLeft">4dp</item>
<item name="cornerSizeBottomRight">4dp</item>
</style>
Any work would be appreciated, Thanks
For Curve Follow below code
For Layout
<com.google.android.material.textfield.TextInputEditText
android:layout_width="50dp"
android:layout_height="wrap_content"
android:cursorVisible="false"
android:digits="1234567890"
android:inputType="number"
android:textSize="40sp"
android:textIsSelectable="false"
android:maxLength="1"
android:maxLines="1"
android:textAlignment="center"
android:layout_marginStart="10dp"
android:backgroundTint="#color/focus_tint"
android:background="#drawable/underline"/>
Add this in your TextInputEditText
android:backgroundTint="#color/focus_tint"
android:background="#drawable/underline"
underline.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:gravity="bottom">
<shape>
<size android:height="4dp" />
<solid android:color="#000000" />
<corners android:radius="50dp"/>
</shape>
</item>
</layer-list>
focus_tint.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:color="#color/teal_200"/>
<item android:state_focused="false" android:color="#color/black"/>
</selector>
after setting a custom background drawable to my EditText now I'm trying to set an specific color for it's TextInputLayout error but when I set a color with textColor, it fills the EditText with that color too!
here is my background drawable file :
<?xml version="1.0" encoding="utf-8" ?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="4dp" />
<stroke
android:width="1dp"
android:color="#color/edit_text_border" />
</shape>
here is the way I defined EditTexts :
<android.support.design.widget.TextInputLayout
android:id="#+id/changePasswordOldTL"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
app:hintEnabled="false"
android:layout_marginStart="16dp"
app:errorTextAppearance="#style/error_appearance"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/changePasswordOldPasswordLabel">
<EditText
android:id="#+id/changePasswordOldET"
style="#style/customEdiText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:maxLength="60" />
</android.support.design.widget.TextInputLayout>
here is error_appearance and customeEditText style :
<style name="error_appearance" parent="#android:style/TextAppearance">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColor">#color/edit_text_border</item>
</style>
<style name="customEdiText">
<item name="android:textSize">#dimen/edit_text_font_size</item>
<item name="android:fontFamily">#font/sans_web_medium</item>
<item name="android:textCursorDrawable">#null</item>
<item name="android:textColor">#color/text_color</item>
<item name="android:background">#drawable/edit_text_background</item>
<item name="android:padding">#dimen/edit_text_padding_right_left</item>
</style>
here is the result :
but I don't want EditText being filled by textColor!
I am using TextInputLayout around edittext to display hint and error. Hint is working perfectly fine as expected, but on using setError on TextInputLayout, the whole edittext is getting foreground colored. I just want the bottom highlight line to be colored not the whole box. The current behaviour is as below:
Code on how I used it in layout is as below:
<android.support.design.widget.TextInputLayout
android:id="#+id/inputLoginEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/TextLabel">
<EditText
android:id="#+id/etLoginEmail"
style="#style/EditTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/text_email_address"
android:imeOptions="actionNext"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
The Style which is been used is as below:
<style name="TextLabel" parent="Widget.Design.TextInputLayout">
<item name="android:textColorHint">#color/COLOR</item>
<item name="android:textSize">#dimen/font_larger</item>
<item name="colorAccent">#color/COLOR</item>
<item name="colorControlNormal">#color/COLOR</item>
<item name="colorControlActivated">#color/COLOR</item>
</style>
EditTextStyle:
<style name="EditTextStyle">
<item name="android:textSize">#dimen/font_normal</item>
<item name="android:textColor">#color/grey_text</item>
<item name="android:fontFamily">#font/gotham_book</item>
<item name="android:paddingBottom">#dimen/spacing_normal</item>
<item name="android:paddingTop">#dimen/spacing_normal</item>
<item name="android:background">#drawable/edittext_background</item>
</style>
edittext_background.xml
<?xml version="1.0" encoding="utf-8"?>
<item>
<shape>
<solid android:color="#color/grey_edittext_line" />
</shape>
</item>
<item android:bottom="1dp">
<shape android:shape="rectangle">
<solid android:color="#FFFFFF" />
</shape>
</item>
How can I remove this foreground color and get the color only on 1dp of highlighted line as in password?
I want to add this type of underline in edittext
xml
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/InputLayout">
<android.support.v7.widget.AppCompatEditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name" />
</android.support.design.widget.TextInputLayout>
style
<style name="InputLayout" parent="TextAppearance.AppCompat">
<item name="android:textSize">18sp</item>
<item name="android:textColor">#color/white</item>
<item name="android:textColorHint">#color/grey</item>
<item name="colorAccent">#color/white</item>
<item name="colorControlNormal">#color/white</item>
<item name="colorControlActivated">#color/colorPrimary</item>
<item name="android:background">#drawable/edit_draw</item>
</style>
but when it got focused it shows it's own underline along with background drawable and and as you can see the drawable i am using is not working good as well.
Just create xml file like edit_text_design.xml and save it to your drawable folder
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- underline color -->
<item>
<shape>
<solid android:color="#41e3ec" />
</shape>
</item>
<!-- main color -->
<item
android:bottom="1.5dp"
android:left="1.5dp"
android:right="1.5dp">
<shape>
<solid android:color="#FFFFFF" />
</shape>
</item>
<!-- draw another block to cut-off the left and right bars -->
<item android:bottom="5.0dp">
<shape>
<solid android:color="#FFFFFF" />
</shape>
</item>
Then use it in your xml for EditText like this
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/name_edit_text"
android:background="#drawable/edit_text_design"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name"/>
</android.support.design.widget.TextInputLayout>
No theam needed..
Output like this
You have to remove the background from the EditText inside layout, because it has its own.
<android.support.design.widget.TextInputEditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null"
android:hint="Name"/>
Add this code to change the state behavior along with Enamul Haque answer
create a drawable and assign it Edittext
Edittext xml
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/InputLayout">
<android.support.v7.widget.AppCompatEditText
android:padding="7dp"
android:id="#+id/editText"
android:background="#drawable/editext_states"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name" />
</android.support.design.widget.TextInputLayout>
drawable
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:state_pressed="true"
android:drawable="#drawable/underline_blue"
/> <!-- pressed -->
<item
android:state_focused="true"
android:drawable="#drawable/underline_red"
/> <!-- focused -->
<item
android:drawable="#drawable/underline_normal"
/> <!-- default -->
create three drawable and change their color as you like and replace these drawable with that
I have a dialog layout in that i have 3 edit texts, for the 1st edit text it shows the underline color as green(primary color), and other two edit text shows the color pink(color accent).
Why so? It should be same as other two edit texts.
Tried to change this with :
name.getBackground().mutate().setColorFilter(getResources().getColor(R.color.colorAccent), PorterDuff.Mode.SRC_ATOP);
name.getBackground().setColorFilter(getResources().getColor(R.color.colorAccent), PorterDuff.Mode.SRC_ATOP);
also by the SO solutions. But nothing helped.
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
....
<item name="android:editTextStyle">#style/EditTextStyle</item>
</style>
<style name="EditTextStyle" parent="Widget.AppCompat.EditText">
<item name="colorControlNormal">#color/border_gray</item>
<item name="colorControlActivated">#color/border_gray</item>
<item name="colorControlHighlight">#color/border_gray</item>
</style>
layout :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<LinearLayout android:layout_height="50dp"
android:layout_width="match_parent"
android:background="#color/colorPrimary">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add Schedule"
android:textColor="#android:color/white"
android:textAppearance="#android:style/TextAppearance.Medium"
android:layout_gravity="center"
android:layout_marginLeft="20dp" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="20dp">
<EditText
android:id="#+id/edt_name"
android:layout_width="match_parent"
android:layout_height="45dp"
android:textColor="#000000"
android:textSize="14sp"
android:inputType="textCapSentences"
android:hint="Name"
android:cursorVisible="false"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="20dp" />
<EditText
android:id="#+id/edt_dateTime"
android:layout_width="match_parent"
android:layout_height="45dp"
android:textColor="#000000"
android:textSize="14sp"
android:cursorVisible="false"
android:inputType="textCapSentences"
android:hint="Date and Time"
android:layout_centerVertical="true"
android:layout_alignLeft="#+id/edt_name"
android:layout_alignStart="#+id/edt_name"
android:layout_below="#+id/edt_name"
android:layout_alignRight="#+id/edt_name"
android:layout_alignEnd="#+id/edt_name"
android:layout_marginTop="05dp" />
<EditText
android:id="#+id/edt_budget"
android:layout_width="match_parent"
android:layout_height="45dp"
android:textColor="#000000"
android:textSize="14sp"
android:cursorVisible="false"
android:hint="Budget"
android:layout_below="#+id/edt_dateTime"
android:layout_alignLeft="#+id/edt_dateTime"
android:layout_alignStart="#+id/edt_dateTime"
android:layout_alignRight="#+id/edt_dateTime"
android:layout_alignEnd="#+id/edt_dateTime"
android:layout_marginTop="05dp"
android:inputType="number" />
</RelativeLayout>
</LinearLayout>
This is what i got after implementing drawable.
Thank you..
It simply consists of overriding the value for colorControlActivated, colorControlHighlight and colorControlNormal in your app theme definition
<style name="Theme.App.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorControlNormal">#c5c5c5</item>
<item name="colorControlActivated">#color/accent</item>
<item name="colorControlHighlight">#color/accent</item>
</style>
or by java
editText.getBackground().mutate().setColorFilter(getResources().getColor(R.color.your_color), PorterDuff.Mode.SRC_ATOP);
by changing your "colorAccent" color you will change color or edittext bottom line and text input layout as well.
Create textfield_bg_drawable.xml in drawable folder. and set it as background resource in EditText.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:bottom="2dp"
android:left="-2dp"
android:right="-2dp"
android:top="-2dp">
<selector>
<item
android:state_enabled="true"
android:state_focused="true">
<shape android:shape="rectangle">
<stroke
android:width="2dp"
android:color="#color/focused_line_color" />
</shape>
</item>
<item android:state_enabled="true">
<shape android:shape="rectangle">
<stroke
android:width="1dp"
android:color="#color/normal_line_color" />
</shape>
</item>
</selector>
</item>
</layer-list>
Try with this following code properly working on my side
Drawable drawable = editText.getBackground(); // get current EditText drawable
drawable.setColorFilter(Color.GREEN, PorterDuff.Mode.SRC_ATOP); // change the drawable color
if (Build.VERSION.SDK_INT > 16) {
editText.setBackground(drawable); // set the new drawable to EditText
} else {
editText.setBackgroundDrawable(drawable); // use setBackgroundDrawable because setBackground required API 16
}
Where editText is the id of your EditText
I think it is because Your 1st editText focusing, when your alert layout appear.
add this line in your editText
android:focusable="true"
You need to disable focus from your first edittext when the activity is opened, so set
android:requestFocus= "false"
in your xml file. Or try the following
edittext.clearFocus();
in your java file.
It will not pick your primary color then.
Hope it works!