I got a "Insufficient text color contrast ratio" warning in my layout. When I used the "Fix" option in the warning screen, it added an attribute android:hintTextColor to my text view in the xml file.
When I built the project, I got an error saying that the above attribute was not found. When I searched through all the attributes for the TextView, the most similar attribute I could find is textColorHint.
Is this a bug in Android Studio? Or did I get something wrong?
Thanks
This warning does not require any Attribute to be added, all you need to do is to enhance the contrast between the text and the background.
e.g. Set font to white if your background is black
If there is no improvement, you can try to use less complicated patterns as background.
Use android:background="#color/white" and android:textColorHint="#color/white" in TextInputEditText and the warning will be gone. see below how I used it.
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/dru_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Type Something"
android:textColorHint="#color/black">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/dru_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColorHint="#color/black"
android:background="#color/white"/>
</com.google.android.material.textfield.TextInputLayout>
Edit: As the above code will hide InputLayout border to avoid that set you parent view color to white see the below code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/dru_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Type Something"
android:textColorHint="#color/black">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/dru_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColorHint="#color/black"/>
</com.google.android.material.textfield.TextInputLayout>
</LinearLayout>
I'm new to android mobile development and java. And wonder if anybody can help me with my issue.
Now, I'm making XML file of my android app and want it to have something like displayed below.
Can it be made in XML file without deep knowledge of java? I just want to have fixed text in my EditText attribute. Using LinearLayout to my first app. I appreciate any kind of help.
Using API 28 for testing.
Yes, there is a default layout TextInputLayout and TextInputEditText.
Here's documentation:
https://developer.android.com/reference/android/support/design/widget/TextInputLayout
https://material.io/develop/android/components/text-input-layout/
This is called TextInputLayout.Read here. Demo example here
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:hintEnabled="true">
<android.support.design.widget.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username" />
</android.support.design.widget.TextInputLayout>
You are looking for the TextInputLayout component:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/username"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
app:boxBackgroundColor="#color/white"
app:boxStrokeColor="#color/text_input_layout_stroke_color"
app:counterMaxLength="15"
app:counterEnabled="true"
>
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</com.google.android.material.textfield.TextInputLayout>
I'm working with TextInputLayout and inside TextInputEditText.
I used app:endIconMode in TextInputLayout, then distance from hint and baseline are bigger than before, how to retrieve this distance?
This is my code:
<com.google.android.material.textfield.TextInputLayout
app:endIconMode="clear_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:hint="#string/hint_phon_number">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:inputType="phone"
android:maxLength="17"
android:textColor="#FF192331" />
</com.google.android.material.textfield.TextInputLayout>
This is because, I use this project material library, then this error appear, when I delete import this library, all were well
When i create new sample project with TextInputLayout , Its working good.
But in my exist project if i have added TextInputlayout , its throws runtime exception caused by java.lang.UnsupportedOperationException.
Why its happen? How to resolve this?
compile 'com.android.support:design:22.2.0'
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TextInputLayout
android:id="#+id/til"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/textDialog"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="First Name"/>
</android.support.design.widget.TextInputLayout>
</LinearLayout>
Why it happen? how to solve this?
Compare the gradle files of your sample project to your real project. Your project might not be setup correctly to use Material Design resources.
I am using recently released Android Design Support Library to show floating label with EditTexts. But i am facing the problem that the Hint on the EditText is not showing when UI is rendered, but i see the Hint after i focus on the EditTexts.
My Layout is as follows:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/ScrollView01"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<android.support.design.widget.TextInputLayout
android:id="#+id/name_et_textinputlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin">
<EditText
android:id="#+id/FeedBackerNameET"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/feedbackname"
android:inputType="textPersonName|textCapWords" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/email_textinputlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/FeedBackerEmailET"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/feedbackemail"
android:inputType="textEmailAddress" />
</android.support.design.widget.TextInputLayout>
<Spinner
android:id="#+id/SpinnerFeedbackType"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:entries="#array/feedbacktypelist"
android:prompt="#string/feedbacktype" />
<android.support.design.widget.TextInputLayout
android:id="#+id/body_textinputlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/EditTextFeedbackBody"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/feedbackbody"
android:inputType="textMultiLine|textCapSentences"
android:lines="5" />
</android.support.design.widget.TextInputLayout>
<CheckBox
android:id="#+id/CheckBoxFeedBackResponse"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:text="#string/feedbackresponse" />
<Button
android:id="#+id/ButtonSendFeedback"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:text="#string/feedbackbutton" />
</LinearLayout>
</ScrollView>
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:background="#drawable/toolbar_shadow" />
</FrameLayout>
I have also tried to set hint for the TextInputLayout using method setHint but no luck.
mNameTextInputLayout = (TextInputLayout) v.findViewById(R.id.name_et_textinputlayout);
mNameTextInputLayout.setErrorEnabled(true);
mNameTextInputLayout.setHint(feedBackerNameET.getHint());
mEmailTextInputLayout = (TextInputLayout) v.findViewById(R.id.email_textinputlayout);
mEmailTextInputLayout.setErrorEnabled(true);
mEmailTextInputLayout.setHint(feedBackerEmail.getHint());
mBodyTextInputLayout = (TextInputLayout) v.findViewById(R.id.body_textinputlayout);
mBodyTextInputLayout.setErrorEnabled(true);
mBodyTextInputLayout.setHint(feedBackBody.getHint());
Update:
This is a bug that has been fixed in version 22.2.1 of the library.
Original Answer:
As mentioned by #shkschneider, this is a known bug. Github user #ljubisa987 recently posted a Gist for a workaround:
https://gist.github.com/ljubisa987/e33cd5597da07172c55d
As noted in the comments, the workaround only works on Android Lollipop and older. It does not work on the Android M Preview.
That is a known bug of the Android Design library. It has been accepted and assigned.
So you should have this fixed in the next Android Design library release.
In the meantime, you could watch the issue tracker for a hacky-fix that might get posted there, but I don't know any as of now.
And yes, it only affect Lollipop and above.
This works for me in Design Library 23.1.1:
Set the hint color in xml attributes of TextInputLayout:
<android.support.design.widget.TextInputLayout
....
android:layout_margin="15dp"
android:textColorHint="#color/hintColor"
android:layout_width="match_parent"
...
This issue is fixed in version 22.2.1
you should use android.support.v7.widget.AppCompatEditText as EditText and set android:hint like below
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.AppCompatEditText
android:id="#+id/etx_first_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:hint="#string/hint_first_name"/>
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="#+id/editText1"
android:layout_margin="15dp"
android:layout_centerVertical="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<AutoCompleteTextView
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:singleLine="true"
android:hint="Add City" />
</android.support.design.widget.TextInputLayout>
Use this code snippet.Make sure your activity is AppCompatActivity.
And dependency are also with latest versions
compile 'com.android.support:appcompat-v7:22.2.0'
compile 'com.android.support:design:22.2.0'
Update the android studio to latest version.
see output here
If you are setting your EditText hint programmatically it wouldn't work!
You need to set the hint on the TextInputLayout it self.
TextInputLayout textInputLayout = (TextInputLayout) findViewById(R.id.usernameTextInputLayout);
textInputLayout.setHint(getString(R.string.username_hint));
Here is the XML in case you are wondering:
<android.support.design.widget.TextInputLayout
android:id="#+id/usernameTextInputLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.AppCompatEditText
android:id="#+id/usernameEt"
android:layout_width="match_parent"
android:layout_height="#dimen/default_height"
android:layout_marginEnd="#dimen/default_margin"
android:layout_marginStart="#dimen/default_margin"
android:maxLength="#integer/username"
tools:hint="Username" />
</android.support.design.widget.TextInputLayout>
This issue is resolved in v23.0.1 of support design library. I also updated my appcompat-v7 to 23.0.1, compileSdkVersion to 23 & buildToolsVersion to 23.0.1 in build.gradle.
android {
compileSdkVersion 23
buildToolsVersion "23.0.1"
}
dependencies {
compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.android.support:design:23.0.1'
}
I solved my problem with this code:
new Handler().postDelayed(
new Runnable() {
#Override
public void run() {
TextInputLayout til = (TextInputLayout) someParentView.findViewById(R.id.til);
til.setHint("Your Hint Text");
til.bringToFront();
}
}, 10);
The key here is the bringToFront. It forces the TextInputLayout to redo its drawing, which is not the same as doing invalidate(). If you are trying to display the TextInputLayout on a view that has animations or tranistions, you need to execute the above code at the end of the animation or transition. Just make sure that the code above runs on the UI thread.
Set hint color that contrast to the EditText background.
<item name="android:textColorHint">#FF424242</item>
Related:
setHintTextColor() in EditText
Change EditText hint color when using TextInputLayout
How to change the floating label color of TextInputLayout
Looks like this issue appears when you set onFousListener on EditText - try to extend EditText and support multiple onFocusListeners
Problem solved:
Goto build.gradle of ur app and check design library.
compile 'com.android.support:design:22.2.1'
It should be 22.2.1 or newer.
Problem is the hint color. It becomes white when typing something. Please change the hint color or change the background color. You will see the hint while typing.
There is a simple solution to this as this worked for me
<android.support.design.widget.TextInputLayout
android:id="#+id/activity_login_til_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="27dp"
android:layout_marginTop="24dp"
android:padding="10dp"
app:passwordToggleEnabled="true"
app:passwordToggleTint="#000000"
app:passwordToggleDrawable="#drawable/passwordviewtoggleselector"
android:theme="#style/Base.TextAppearance.AppCompat">
<!---- add this line and theme as you need ----->
<android.support.design.widget.TextInputEditText
android:id="#+id/activity_login_et_password"
android:layout_width="match_parent"
android:layout_height="58dp"
android:hint="Password"
android:inputType="textPassword"
android:padding="10dp"
android:textColor="#f5ab3a"
android:textColorHint="#e6d2d1cf"
android:textSize="20dp" />
</android.support.design.widget.TextInputLayout>
Just add android:theme="#style/Base.TextAppearance.AppCompat" to the TextEditLayout and it should work and you can change the theme as you need.
Just add: android:hint="your_hint" for TextInputLayout.
I found something different.
When setting the style for the fragment,
f1.setStyle(DialogFragment.STYLE_NO_FRAME,android.R.style.Theme_DeviceDefault_Light);
The bug was gone when I tried different Styles than "Theme_DeviceDefault_Dialog".
Give it a try.
if you have set your layout background white please use it in your Activity Theme
parent="Theme.MaterialComponents.Light.NoActionBar"